zoukankan      html  css  js  c++  java
  • HTML学习(三)文本格式化

    HTML文本格式化
    HTML 可定义很多供格式化输出的元素,比如粗体和斜体字。
    例1:此例演示如何在一个 HTML 文件中对文本进行格式化
    <html>

    <body>

    <b>This text is bold</b>

    <br />

    <strong>This text is strong</strong>

    <br />

    <big>This text is big</big>

    <br />

    <em>This text is emphasized</em>

    <br />

    <i>This text is italic</i>

    <br />

    <small>This text is small</small>

    <br />

    This text contains
    <sub>subscript</sub>

    <br />

    This text contains
    <sup>superscript</sup>

    </body>
    </html>


    例2:此例演示如何使用 pre 标签对空行和空格进行控制。
    <html>

    <body>

    <pre>
    这是
    预格式文本。
    它保留了 空格
    和换行。
    </pre>

    <p>pre 标签很适合显示计算机代码:</p>

    <pre>
    for i = 1 to 10
    print i
    next i
    </pre>

    </body>
    </html>


    例3:此例演示不同的“计算机输出”标签的显示效果。
    <html>

    <body>

    <code>Computer code</code>
    <br />
    <kbd>Keyboard input</kbd>
    <br />
    <tt>Teletype text</tt>
    <br />
    <samp>Sample text</samp>
    <br />
    <var>Computer variable</var>
    <br />

    <p>
    <b>注释:</b>这些标签常用于显示计算机/编程代码。
    </p>

    </body>
    </html>


    例4:此例演示如何在 HTML 文件中写地址。
    <!DOCTYPE html>
    <html>
    <body>

    <address>
    Written by <a href="mailto:webmaster@example.com">Donald Duck</a>.<br>
    Visit us at:<br>
    Example.com<br>
    Box 564, Disneyland<br>
    USA
    </address>

    </body>
    </html>


    例5:此例演示如何实现缩写或首字母缩写。
    <html>

    <body>

    <abbr title="etcetera">etc.</abbr>
    <br />
    <acronym title="World Wide Web">WWW</acronym>

    <p>在某些浏览器中,当您把鼠标移至缩略词语上时,title 可用于展示表达的完整版本。</p>

    <p>仅对于 IE 5 中的 acronym 元素有效。</p>

    <p>对于 Netscape 6.2 中的 abbr 和 acronym 元素都有效。</p>

    </body>
    </html>


    例6:此例演示如何改变文字的方向。
    <html>

    <body>

    <p>
    如果您的浏览器支持 bi-directional override (bdo),下一行会从右向左输出 (rtl);
    </p>

    <bdo dir="rtl">
    Here is some Hebrew text
    </bdo>

    </body>
    </html>


    例7:此例演示如何实现长短不一的引用语。
    <html>

    <body>

    这是长的引用:
    <blockquote>
    这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。
    </blockquote>

    这是短的引用:
    <q>
    这是短的引用。
    </q>

    <p>
    使用 blockquote 元素的话,浏览器会插入换行和外边距,而 q 元素不会有任何特殊的呈现。
    </p>

    </body>
    </html>


    例8:此例演示如何标记删除文本和插入文本。
    <html>

    <body>

    <p>一打有 <del>二十</del> <ins>十二</ins> 件。</p>

    <p>大多数浏览器会改写为删除文本和下划线文本。</p>

    <p>一些老式的浏览器会把删除文本和下划线文本显示为普通文本。</p>

    </body>
    </html>


    文本格式化标签
    <b>      定义粗体文本
    <big>     定义大号字
    <em>     定义着重字
    <i>       定义斜体字
    <small>    定义小号字
    <strong>    定义加重语气
    <sub>      定义下标字
    <sup>    定义上标字
    <ins>     定义插入字
    <del>     定义删除字
    <u>      不赞成使用。使用样式(style)代替


    “计算机输出”标签
    <code>    定义计算机代码
    <kbd>     定义键盘码
    <samp>    定义见算计代码样本
    <tt>     定义打自己代码
    <var>    定义变量
    <pre>    定义预格式文本


    引用、引证和术语定义
    <abbr>         定义缩写
    <acronym>     定义首字母缩写
    <address>      定义地址
    <bdo>        定义文字方向
    <blockquote>   定义长的引用
    <q>             定义短的引用
    <cite>          定义引用、引证
    <dfn>          定义一个定义项目

  • 相关阅读:
    leetcode 279. Perfect Squares
    leetcode 546. Remove Boxes
    leetcode 312. Burst Balloons
    leetcode 160. Intersection of Two Linked Lists
    leetcode 55. Jump Game
    剑指offer 滑动窗口的最大值
    剑指offer 剪绳子
    剑指offer 字符流中第一个不重复的字符
    leetcode 673. Number of Longest Increasing Subsequence
    leetcode 75. Sort Colors (荷兰三色旗问题)
  • 原文地址:https://www.cnblogs.com/wlsxmhz/p/5345630.html
Copyright © 2011-2022 走看看