html 语法

原创

1. 显示图片

显示一张图片

<div align=center>
<img src=img.jpg width="60%"/>
<p>title</p>
</div>

并列显示两张图片

<table><tr>
<td><img src=img1.jpg border=0 width="100%"></td>
<td><img src=img2.jpg border=0 width="100%"></td>
</tr></table>

2. 输出一段空行

<p>这是第一段文本。</p>
<br>
<p>这是第二段文本，它与第一段文本之间空了一行。</p>

这是第一段文本。

这是第二段文本，它与第一段文本之间空了一行。

3. 句子的基本设置

<p style="color: red;">这是红色文本。</p>

上面是影响的整行的文本，如果想要影响部分文本，可以使用：

<span style="color: red;">这是红色文本。</span>

下面的内容依旧如此

设置句子的颜色

<p style="color: red;">这是红色文本。</p>
<p style="color: blue;">这是蓝色文本。</p>
<p style="color: green;">这是绿色文本。</p>
<p style="color: #008000;">这是绿色文本。</p>
<p style="color: #0000FF;">这是蓝色文本。</p>
<p style="color: #FF0000;">这是红色文本。</p>
<p style="color: #008000;">这是绿色文本。</p>
<p style="color: #0000FF;">这是蓝色文本。</p>
<p style="color: #FF0000;">这是红色文本。</p>

设置句子的字体

<p style="font-family: 'Times New Roman';">这是 Times New Roman 字体。</p>
<p style="font-family: 'Arial';">这是 Arial 字体。</p>
<p style="font-family: 'Courier New';">这是 Courier New 字体。</p>
<p style="font-family: 'Georgia';">这是 Georgia 字体。</p>
<p style="font-family: 'Helvetica';">这是 Helvetica 字体。</p>
<p style="font-family: 'Verdana';">这是 Verdana 字体。</p>
<p style="font-family: 'Tahoma';">这是 Tahoma 字体。</p>
<p style="font-family: 'Trebuchet MS';">这是 Trebuchet MS 字体。</p>
<p style="font-family: 'Palatino';">这是 Palatino 字体。</p>
<p style="font-family: 'Bookman';">这是 Bookman 字体。</p>
<p style="font-family: 'Comic Sans MS';">这是 Comic Sans MS 字体。</p>
<p style="font-family: 'Impact';">这是 Impact 字体。</p>
<p style="font-family: 'Lucida Sans Unicode';">这是 Lucida Sans Unicode 字体。</p>

设置句子的字体大小

<p style="font-size: 16px;">这是 16px 字体。</p>
<p style="font-size: 18px;">这是 18px 字体。</p>
<p style="font-size: 20px;">这是 20px 字体。</p>
<p style="font-size: 22px;">这是 22px 字体。</p>
<p style="font-size: 24px;">这是 24px 字体。</p>
<p style="font-size: 26px;">这是 26px 字体。</p>
<p style="font-size: 28px;">这是 28px 字体。</p>
<p style="font-size: 30px;">这是 30px 字体。</p>

设置句子高亮等

<p style="font-weight: bold;">这是加粗文本。</p>
<p style="font-style: italic;">这是斜体文本。</p>
<p style="background-color: yellow;">这是高亮文本。</p>
<p style="text-decoration: underline;">这是下划线文本。</p>
<p style="text-decoration: line-through;">这是删除线文本。</p>
<p style="text-decoration: underline line-through;">这是下划线和删除线文本。</p>
<p style="font-weight: normal;">这是正常文本。</p>

本文由 Yonghui Wang 创作，采用 知识共享署名4.0 国际许可协议进行许可
本站文章除注明转载/出处外，均为本站原创或翻译，转载前请务必署名
最后编辑时间为: Mar 18, 2025 09:56 pm