HTML学习之HTML格式化

2025-10-22 04:46:38

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>

HTML学习之HTML格式化

2、预格式文本

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

<html>

<body>

<pre>

这是

预格式文本。

它保留了      空格

和换行。

</pre>

pre 标签很适合显示计算机代码:

<pre>

for i = 1 to 10

     print i

next i

</pre>

</body>

</html>

HTML学习之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 />

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

</body>

</html>

HTML学习之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>

HTML学习之HTML格式化

5、缩写和首字母缩写

此例演示如何实现缩写或首字母缩写。

<html>

<body>

<abbr title="etcetera">etc.</abbr>

<br />

<acronym title="World Wide Web">WWW</acronym>

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

仅对于 IE 5 中的 acronym 元素有效。

对于 Netscape 6.2 中的 abbr 和 acronym 元素都有效。

</body>

</html>

HTML学习之HTML格式化

6、文字方向

此例演示如何改变文字的方向。

<html>

<body>

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

<bdo dir="rtl">

Here is some Hebrew text

</bdo>

</body>

</html>

HTML学习之HTML格式化

7、块引用

此例演示如何实现长短不一的引用语。

<html>

<body>

这是长的引用:

<blockquote>

这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。

</blockquote>

这是短的引用:

<q>

这是短的引用。

</q>

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

</body>

</html>

HTML学习之HTML格式化

8、删除字效果和插入字效果

此例演示如何标记删除文本和插入文本。

<html>

<body>

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

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

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

</body>

</html>

HTML学习之HTML格式化

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢