• Chrome,firefox,ie等浏览器空格 宽度不一样


    方案一:使用其他字符代替空格

    使用( )空格浏览器之间,显示的不一样,对不齐等现象。
    解决方案:
    用半角空格 或者全角空格 就可以了, 相当于半格中文字符的宽度, 相当于一个中文字符宽度。
    扩展:
      
    它叫不换行空格,全称No-Break Space,它是最常见和我们使用最多的空格,大多数的人可能只接触了 ,它是按下space键产生的空格。在HTML中,如果你用空格键产生此空格,空格是不会累加的(只算1个)。要使用html实体表示才可累加,该空格占据宽度受字体影响明显而强烈。
      
    它叫“半角空格”,全称是En Space,en是字体排印学的计量单位,为em宽度的一半。根据定义,它等同于字体度的一半(如16px字体中就是8px)。名义上是小写字母n的宽度。此空格传承空格家族一贯的特性:透明的,此空格有个相当稳健的特性,就是其占据的宽度正好是1/2个中文宽度,而且基本上不受字体影响。
      
    它叫“全角空格”,全称是Em Space,em是字体排印学的计量单位,相当于当前指定的点数。例如,1 em在16px的字体中就是16px。此空格也传承空格家族一贯的特性:透明的,此空格也有个相当稳健的特性,就是其占据的宽度正好是1个中文宽度,而且基本上不受字体影响。
      
    它叫窄空格,全称是Thin Space。我们不妨称之为“瘦弱空格”,就是该空格长得比较瘦弱,身体单薄,占据的宽度比较小。它是em之六分之一宽。
    ‌ 
    它叫零宽不连字,全称是Zero Width Non Joiner,简称“ZWNJ”,是一个不打印字符,放在电子文本的两个字符之间,抑制本来会发生的连字,而是以这两个字符原本的字形来绘制。Unicode中的零宽不连字字符映射为“”(zero width non-joiner,U+200C),HTML字符值引用为: ‌
    ‍ 
    它叫零宽连字,全称是Zero Width Joiner,简称“ZWJ”,是一个不打印字符,放在某些需要复杂排版语言(如阿拉伯语、印地语)的两个字符之间,使得这两个本不会发生连字的字符产生了连字效果。零宽连字符的Unicode码位是U+200D (HTML: ‍ ‍)。
     
    方案二:
    解决办法:
    一、修改页面的编码格式<meta http-equiv="content-type" content="text/html; charset=gbk">
    和页面的编译方式(myeclipse中)
    然后IE右键修改编码显示格式即可
     
     
    二、(推荐)在空格那一行设置一下字体,把字体设置成任意一种字符等间距的字体就行了。
    如:
    <div style="font-family: '宋体'">nbsp;nbsp;nbsp;nbsp;我是第二行</div>

    PS:nbsp;替换为&nbsp;

    如果style="font-family: '宋体'" 实现不了,可将"宋体"改为"Times New Roman"
     
     
    笔者建议是第一种,挺好用的......
  • 相关阅读:
    Android 判断字符串是否为空
    Android 7.0以上版本 系统解决拍照的问题 exposed beyond app through ClipData.Item.getUri()
    laravel中的登录页面逻辑
    linux的典型分支:
    laravel模型表建立外键约束的使用:
    laravel中的plicy授权方法:
    laravel中的storePublicly对上传的文件设置上传途径
    GitHub下的文件放到Linux系统下
    laravel注册行为的方法和逻辑
    laravel的日志服务
  • 原文地址:https://www.cnblogs.com/ZenoLiang/p/9470082.html
Copyright © 2020-2023  润新知