HTML基础学习笔记-1
一、HTML基础
1.1、HTML 标题
HTML 标题(Heading)是通过<h1> - <h6> 标签来定义的。
下面展示一些 内联代码片
。
<h1>这是一个标题</h1>
<h2>这是一个标题</h2>
<h3>这是一个标题</h3>
1.2、HTML 段落
HTML 段落是通过标签 <p> 来定义的。
<p>这是一个段落。</p>
<p>这是另外一个段落。</p>
1.3、HTML 链接
HTML 链接是通过标签 <a> 来定义的。
<a href="https://www.runoob.com">这是一个链接</a>
1.4、HTML 图像
HTML 图像是通过标签 来定义的.
<img loading="lazy" src="/images/logo.png" width="258" height="39" />
注意: 图像的名称和尺寸是以属性的形式提供的。
二、HTML元素
HTML 文档由 HTML 元素定义。
开始标签* | 元素内容 | 结束标签* |
---|---|---|
<p> | 这是一个段落 | </p> |
<a href=“default.htm”> | 这是一个链接 | </a> |
<br > | 换行 |
2.1、HTML 元素语法
- HTML 元素以开始标签起始
- HTML 元素以结束标签终止
- 元素的内容是开始标签与结束标签之间的内容
- 某些 HTML 元素具有空内容(empty content)
- 空元素在开始标签中进行关闭(以开始标签的结束而结束)
- 大多数 HTML 元素可拥有属性
2.2、嵌套的 HTML 元素
大多数 HTML 元素可以嵌套(HTML 元素可以包含其他 HTML 元素)。
HTML 文档由相互嵌套的 HTML 元素构成。
实例:包含了三个 HTML 元素
<!DOCTYPE html>
<html>
<body>
<p>这是第一个段落。</p>
</body>
</html>
HTML 实例解析:
<p> 元素:
\<p>这是第一个段落。\</p>
这个 <p> 元素定义了 HTML 文档中的一个段落。
这个元素拥有一个开始标签 <p> 以及一个结束标签 </p>.
元素内容是: 这是第一个段落。
元素:
<body>
<p>这是第一个段落。</p>
</body>
<body> 元素定义了 HTML 文档的主体。
这个元素拥有一个开始标签 <body> 以及一个结束标签 </body>。
元素内容是另一个 HTML 元素(p 元素)。
<html> 元素:
<html>
<body>
<p>这是第一个段落。</p>
</body>
</html>
<html> 元素定义了整个 HTML 文档。
这个元素拥有一个开始标签 <html> ,以及一个结束标签 </html>.
元素内容是另一个 HTML 元素(body 元素)。
2.3、HTML 空元素
没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。
<br> 就是没有关闭标签的空元素(<br> 标签定义换行)。
在 XHTML、XML 以及未来版本的 HTML 中,所有元素都必须被关闭。
在开始标签中添加斜杠,比如 <br />,是关闭空元素的正确方法,HTML、XHTML 和 XML 都接受这种方式。
即使
在所有浏览器中都是有效的,但使用 <br /> 其实是更长远的保障。
三、HTML属性
属性是 HTML 元素提供的附加信息。
- HTML 元素可以设置属性
- 属性可以在元素中添加附加信息
- 属性一般描述于开始标签
- 属性总是以名称/值对的形式出现,比如:name=“value”。
3.1、属性实例
HTML 链接由 标签定义。链接的地址在 href 属性中指定:
实例:
<a href="http://www.runoob.com">这是一个链接</a>
3.2、HTML 属性常用引用属性值
属性值应该始终被包括在引号内。
双引号是最常用的,不过使用单引号也没有问题。
Remark提示: 在某些个别的情况下,比如属性值本身就含有双引号,那么您必须使用单引号,例如:name=‘John “ShotGun” Nelson’
3.3、HTML 属性参考手册
查看完整的HTML属性列表: HTML 标签参考手册。
如下是适用于大多数 HTML 元素的属性:
属性 | 描述 |
---|---|
class | 为html元素定义一个或多个类名(classname)(类名从样式文件引入) |
id | 定义元素的唯一id |
style | 规定元素的行内样式(inline style) |
title | 描述了元素的额外信息 (作为工具条使用) |
更多标准属性说明: HTML 标准属性参考手册.