轻松上手,快乐学习!

HTML基本范例


在本章中,我们将显示一些基本的HTML示例。

如果我们使用您尚未了解的标签,请不要担心。


HTML文件

所有HTML文档都必须以文档类型声明开头: <!DOCTYPE html>

HTML文档本身以<html>开始,以</html>结尾。

HTML文档的可见部分在<body></body>

<!DOCTYPE html>
<html>
<body><h1>My First Heading</h1>
<p>My first paragraph.</p></body>
</html>

自己尝试»


<!DOCTYPE>声明

<!DOCTYPE>声明表示文档类型,并帮助浏览器正确显示网页。

它只能在页面顶部(在任何HTML标记之前)出现一次。

<!DOCTYPE>声明不区分大小写。

HTML5的<!DOCTYPE>声明为:

<!DOCTYPE html>

HTML标题

HTML标题使用<h1><h6>标记定义。

<h1>定义最重要的标题。 <h6>定义了最不重要的标题:

<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>

自己尝试»


HTML段落

HTML段落使用<p>标记定义:

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

自己尝试»


HTML链接

HTML链接使用<a>标记定义:

<a href="https://www.w3schools.com">This is a link</a>

自己尝试»

链接的目的地在href属性中指定。

属性用于提供有关HTML元素的其他信息。

您将在下一章中了解有关属性的更多信息。


HTML图片

HTML图像使用<img>标记定义。

提供源文件( src ),备用文本( alt ), widthheight作为属性:

<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">

自己尝试»


如何查看HTML源代码?

您曾经看过网页并想知道“嘿!他们是怎么做到的?”

查看HTML源代码:

右键单击HTML页面,然后选择“查看页面源代码”(在Chrome中)或“查看源代码”(在Edge中),或在其他浏览器中类似。 这将打开一个包含页面HTML源代码的窗口。

检查HTML元素:

右键单击一个元素(或空白区域),然后选择“检查”或“检查元素”以查看由哪些元素组成(您将同时看到HTML和CSS)。 您还可以在打开的“元素或样式”面板中即时编辑HTML或CSS。