基本的 HTML 标签 - 四个实例
HTML基础 2022-05-19 16:58:33小码哥的IT人生shichen
基本的 HTML 标签 - 四个实例
本章通过实例向您演示最常用的 HTML 标签。
提示:不要担心本章中您还没有学过的例子,您将在下面的章节中学到它们。
提示:学习 HTML 最好的方式就是边学边做实验。我们为您准备了很好的 HTML 编辑器。使用这个编辑器,您可以任意编辑一段 HTML 源码,然后单击 TIY 按钮来查看结果。
HTML 标题
HTML 标题(Heading)是通过 <h1> - <h6> 等标签进行定义的。
示例代码:
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
完整实例【亲自试一试】:
<html>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
<p>请仅仅把标题标签用于标题文本。不要仅仅为了产生粗体文本而使用它们。请使用其它标签或 CSS 代替。</p>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
HTML 段落
HTML 段落是通过 <p> 标签进行定义的。
示例代码:
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
完整实例【亲自试一试】:
<html>
<body>
<p>这是段落。</p>
<p>这是段落。</p>
<p>这是段落。</p>
<p>段落元素由 p 标签定义。</p>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
HTML 链接
HTML 链接是通过 <a> 标签进行定义的。
示例代码:
<a href="http://www.phpcodeweb.com">This is a link</a>
完整实例【亲自试一试】:
<html>
<body>
<a href="http://www.phpcodeweb.com">
This is a link</a>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
注释:在 href 属性中指定链接的地址。
(您将在本教程稍后的章节中学习更多有关属性的知识)。
HTML 图像
HTML 图像是通过 <img> 标签进行定义的。
示例代码:
<img src="/skin/news/images/logo1.png" width="490" height="150" />
完整实例【亲自试一试】:
<html>
<body>
<img src="/skin/news/images/logo1.png" width="490" height="150" />
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
注释:图像的名称和尺寸是以属性的形式提供的。