zoukankan      html  css  js  c++  java
  • html空格字符

    一、使用全角空格IDEOGRAPHIC SPACE---- 

    Encodings
    HTML Entity (decimal)  
    HTML Entity (hex)  
    How to type in Microsoft Windows Alt +3000
    UTF-8 (hex) 0xE3 0x80 0x80 (e38080)
    UTF-8 (binary) 11100011:10000000:10000000
    UTF-16 (hex) 0x3000 (3000)
    UTF-16 (decimal) 12,288
    UTF-32 (hex) 0x00003000 (3000)
    UTF-32 (decimal) 12,288
    C/C++/Java source code "u3000"
    Python source code u"u3000"

           

    全角空格被解释为汉字,所以不会被被解释为HTML分隔符,可以按照实际的空格数显示。 
    「叉三千」指什么呢?哈哈,其实是全角空格。 中文字体都是等宽的,一个全角空格的宽度就是一个普通中文的宽度。所以,上面的demo中
     空格换成全角空格也是可以滴! 但是,我们不能直接在页面中打全角空格,因为在大多数编辑器中空格是透明滴,很容易就被删掉;另外,HTML压缩时候,空格很可能被干掉!咋办?需要转换书写形式。 在web页面上,一般有3种书写: 直接,例如搜狗输入法输入“版权” – ©. web字符,© charCode表示:© 而上面的 ,  就是具有特定名称的web字符。但是,恕我寡闻,我并不清楚全角空格是否有对应& + 关键字示意,所以,就使用工具转成了charCode字符表示,也就是这里的 ,又称「叉三千」!

    二、使用空格的替代符号 

        替代符号就是在需要显示空格的地方加入替代符号,这些符号会被浏览器解释为空格显示。 

    字符以及HTML实体描述以及说明
     

     

    这是我们使用最多的空格,也就是按下space键产生的空格。在HTML中,如果你用空格键产生此空格,空格是不会累加的(只算1个)。要使用html实体表示才可累加。为了便于记忆,我总是把这个空格成为“牛逼(nb)空格(sp – space)”,虽然实际上并不牛逼。该空格占据宽度受字体影响明显而强烈。在inline-block布局中会搞些小破坏,在两端对齐布局中又是不可少的元素。是个让人又爱又恨的小东东。

     

    该空格学名不详。为了便于记忆,我们不妨就叫它“恶念(e n-ian)空格”。此空格传承空格家族一贯的特性:透明滴!此空格有个相当稳健的特性,就是其占据的宽度正好是1/2个中文宽度,而且基本上不受字体影响。

     

    该空格学名不详。为了便于记忆,我们不妨就叫它”恶魔(e m-o)空格”。此空格也传承空格家族一贯的特性:透明滴!此空格也有个相当稳健的特性,就是其占据的宽度正好是1个中文宽度,而且基本上不受字体影响。

     

    该空格学名不详。我们不妨称之为“瘦弱空格”,就是该空格长得比较瘦弱,身体单薄,占据的宽度比较小。我目前是没用过这个东西,这里亮出来是让其过一下群众演员的瘾。

    可以用名称或编号作为空格的替代符号,名称必须小写,末尾的“;”不能省略。 

    其中的  ,由于具有某一超赞的特性,使其可以登上web届的舞台!什么特性呢?如上表加粗展示,1. 透明; 2. 宽度正好跟中文正好是1:21:1的关系,于是,一些中文排版对齐什么的,直接就可以使用这两个空格调节

      三、使用CSS的 white-space 属性

      CSS的white-space属性用于设置文本中空格的处理方式,当white-space属性取值为pre时,浏览器会保留文本中的空格和换行,这样你就可以直接在文本中使用空格和回车了。 这种方法特别适合于在网页中显示程序代码。

      使用HTML的标签也可以达到类似的效果,但标签有一些不太好的特性,不如使用CSS的white-space属性更方便。

       四、使用CSS的 letter-spacing 属性

      CSS的letter-spacing属性用于设置文本中字符之间的间隔,它的取值可以是一个带单位的长度值,浏览器会在字和字之间设置指定长度的空白。

      注意,如果文本中有英文单词,则空白会加在字母之间,而不是单词之间。


    五、使用CSS的 word-spacing 属性
    CSS的word-spacing属性用于设置文本中单词之间的间隔,它的取值可以是一个带单位的长度值,浏览器会在单词和单词之间设置指定长度的空白。 注意,HTML是以空格来区分单词的,它会把单词间的空白按指定长度显示。 六、使用CSS的 text-indent 属性 CSS的text-indent属性用于设置首行缩进,它的取值可以是一个带单位的长度值,浏览器会在段落的首行开始处设置指定长度的空白。 说明:em 是一个相对长度单位,2em 表示要缩进两个字的距离。

    内容部分来自:http://www.zhangxinxu.com/wordpress/2015/01/tips-blank-character-chinese-align/
  • 相关阅读:
    DDOS攻击与防御
    .NET Core 二维码生成Demo
    腾讯云服务器远程登录卡顿严重导致无法登录解决办法
    signalR【一、官方案例】
    Python题目:生成100个随机不重复的字符串【杭州多测师】【杭州多测师_王sir】
    把字符串当中重复的字符打印出来【杭州多测师】【杭州多测师_王sir】
    PC#1 ping PC#2,请描述PC1和PC2之间的通信过程【杭州多测师】【杭州多测师_王sir】
    逻辑题【杭州多测师】【杭州多测师_王sir】
    编程题:给一个网址获取分配网址的协议,域名,路径,端口,参数1的值,参数2的值,并以字典的形式打印出结果【杭州多测师】【杭州多测师_王sir】
    经典的Python题目之找到a开头的元素、组成新的列表【多测师王sir】【杭州多测师_王sir】
  • 原文地址:https://www.cnblogs.com/fenglie/p/4447550.html
Copyright © 2011-2022 走看看