zoukankan      html  css  js  c++  java
  • 实现文字字数不等对其

     :空格   占据宽度受字体的影响

     透明;占据的宽度正好是1/2个中文宽度,而且基本上不受字体影响。

     透明;占据的宽度正好是1个中文宽度,而且基本上不受字体影响。

    中文字符:

    中文都是等宽的,因此可以使用  和  实现两个 三个  四个字符的对齐(还可以使用&#x3000:据的宽度正好是1个中文宽度,而且基本上不受字体影响)

    当中文和英文混杂的时候,使用  等空格实现冒号的完美对齐还是有些困难的,除非英文使用的是等宽字体,于是乎,我们就可以使用普通的 空格做英文字符的宽度调节。

    英文字符和一些非文字的符号一般都是非等宽的,有时候为了美观让它们等宽,可以使用等宽字体,(在网上下载常用的等宽字体)

    在web页面上,一般有3种书写:

    1. HTML中字符输出使用&#x配上charCode值;
    2. 在JavaScript文件中为防止乱码转义,则是u配上charCode值;
    3. 而在CSS文件中,如CSS伪元素的content属性,直接使用配上charCode值。
    4. unicode-rangeU+配上charCode值。

    unicode编码转换:http://tool.chinaz.com/tools/unicode.aspx

    demo:想在HTML/JS/CSS中转义“我”这个汉字,分别是:

    1. 我
    2. u6211, 如console.log('u6211');
    3. 6211, 如.xxx:before { content: '6211'; }

    考虑到直接 这种形式暴露在HTML中,可能会让屏幕阅读器等辅助设备读取,从而影响正常阅读流,因此,我们可以进一步优化下,使用标签,利用伪元素,例如:

    .half:before { content: '2002'; speak: none; }
    .full:before { content: '2003'; speak: none; }
  • 相关阅读:
    USACO2.2 Preface Numbering【思维+打表】
    USACO2.1 Hamming Codes【枚举+二进制处理+输出格式+题意理解】
    USACO1.6 Healthy Holsteins【dfs/bfs 爆搜】
    USACO1.5 Mother's Milk【搜索】
    USACO1.6 Number Triangles [dp-简单dp]
    USACO1.6 回文质数 Prime Palindromes
    泛型简介
    涉及 C#的 foreach问题
    c#委托事件及其讲解
    WPF 打印 包括设置,打印预览,打印等等
  • 原文地址:https://www.cnblogs.com/xiaofenguo/p/6102044.html
Copyright © 2011-2022 走看看