zoukankan      html  css  js  c++  java
  • 比较好的firefox中字符换行解决方法

    在网页中经常碰到字符断行的问题,一般情况下只要设置了外层容器的宽度都能自动断行,但也不能排除极端情况下,比如数字“11111111”和字母“lllllllllllllllllllllll”的情况下,浏览器就不能自动断行了。这时用word-wrap:break-word;和word-break : break-all;属性就能解决。但这只是IE7及以下浏览器能支持,FF和IE8就不支持了(FF4.0好像可以了)。

         原来解决这个问题都是用JS判断字符数,然后加上“<br />”强制断行,今天遇到了新需求,再用这个JS处理就不是很理想了。

    就是如果用JS判断字符数,因为像数字中文“啊啊啊啊”“1111”和字母“llll”字符数是一样,但所占宽度相差还是很大的,所以这个方法对于需要处理很细的项目还是不行的。

        在群里和各位前辈们讨论了,也没有其它好的方法,菲哥提供了一个解决方法就是,使用等宽字体,因为每个字符的宽度都一样,那样用JS处理字符截断不同的字符效果就一样了,但这也局限了字体,等宽字体排版不好看,现在用等宽字体的也很少。

         后来在百度知道上看到百度的解决方法不错,就是用“<pre>”将内容包起来,然后设定它的宽度,同时加上white-space: pre-wrap; word-wrap: break-word; ,问题解决!暂时用的效果不错,可能会有些局限性不能用这个标签,但暂时还没有碰到别的解决方法,这个算是比较完美的了。

  • 相关阅读:
    鼠标移上,内容显示
    Jquery横向菜单和纵向菜单的收起与展开
    适配不同大小浏览器——固定排班
    jQuery UI Widgets-menu
    Web前端的35个jQuery小技巧-转载
    android中listview中包含ratingbar响应不了点击事件
    点击空白区域,键盘向下收缩
    时间轮 Dialog 最简单的时间轮
    android 获取电话本中的联系人列表
    《网红经济》读后感
  • 原文地址:https://www.cnblogs.com/load/p/2004078.html
Copyright © 2011-2022 走看看