属性
class
HTML 元素可以有一个或多个类,类之间用空格分隔。你可以使用 CSS 通过类来选择元素并为其设置样式。
示例
id
HTML 元素可以有一个 id 属性来标识它。id 应该是唯一的,每个元素最多只能有一个 id。
示例
href
链接使用 href 属性告诉浏览器要去哪里,href 存储一个 URL。
示例
基本格式
你可以使用简单的格式标签轻松地将文本设置为粗体、斜体或下划线。
示例
这段文字是 粗体,斜体 和 下划线。
Body(主体)
主体是页面所有内容的容器。它紧跟在
标签之后,位于整体 标签内。示例
这是在主体里面!
阅读更多
HTML
标签使用
几乎所有内容都应该放在主体标签内。主要例外是脚本和样式标签,以及页面标题标签。如你所见,在这个例子中,主体标签内有一个标题、一个图像和一个链接。头部标签只包含外部文件和页面标题。
示例
你好,这是一张我的猫的照片!
子元素
一个元素是另一个元素的直接后代或嵌套在另一个元素内时,它被称为子元素。在使用 CSS 子选择器和伪元素时,这些概念非常有用。
示例
- 我是 parent 的子元素!
注释
HTML 注释有时用于代码中以解释标记的部分。它们与其他语言中的注释类似。用户在浏览器中看不到注释。
语法
Div(分区)
一个块级容器(或网页的“分区”),用于没有语义意义的内容。
语法
Head(头部)
头部标签围绕对用户不可见但对浏览器重要的内容。此标签内的元素包含关于页面的元数据以及样式表、脚本等的链接。
标题
标题元素如
、、 等允许你使用六级文档标题,从最大到最小,将文档分成逻辑部分。例如,上面的“标题”一词被包裹在一个 标签中。
等允许你使用六级文档标题,从最大到最小,将文档分成逻辑部分。例如,上面的“标题”一词被包裹在一个 标签中。
语法
这是一个标题!
水平线
此标签创建一条贯穿其容器的黑色 1 像素粗的线。你可以使用 CSS 使其看起来不同。
示例
这段文字被
分隔... 从这段文字!
阅读更多
HTML
标签
HTML
HTML 是什么?
HTML 代表超文本标记语言。它是用于创建所有网站的语言。
阅读更多
HTML 是什么?
标签
所有 HTML 文件都包含在一个总体的 html 标签内。这是定义 html 文档的基本标签。
语法
你的网页其余部分放在这里!
阅读更多
标签
超链接
超链接(或链接)当用户点击时会将他们带到另一个网页。链接最常用的属性是 href,它告诉浏览器链接指向哪里。
语法
示例
以下文字 去 Google。
图像
img 标签将图像嵌入到你的 HTML 中。总是与 'src' 属性一起使用,它告诉浏览器在哪里找到图像。注意 标签是自闭合的。
语法
换行
此标签用于在文本块中强制换行。这适用于单个段落中需要此格式的情况,如诗歌或地址。要分隔段落,请将每个段落分成一个单独的
元素。结果元素在网页上将如下所示:
示例
一些文本
跨两行的文本
链接
链接元素用于将你的文档连接到相关资源(与超链接非常不同,超链接当你点击它们时会带你到另一个网页)。链接只出现在文档的头部部分,因此它们不会改变内容,只改变呈现方式。链接最常用于连接到样式表、脚本、网站图标或页面的替代格式,如 RSS 源或 PDF。
示例
列表
HTML 支持两种列表:有序列表和无序列表。在列表中,每个列表项都有自己的标签。
无序列表
无序列表是项目以项目符号表示的列表。
示例
购物清单
- 洗碗液
- 猫砂
- 番茄酱
阅读更多
HTML
- 标签
- 第一项!
- 第二项!
- 最后一项!
有序列表
有序列表的项目以数字表示。
示例
我的编号列表
阅读更多
HTML
- 标签
段落
HTML 中最常用的标签之一 - 它表示一个文本段落。它通常包含其他元素,如 、、 和 。
语法
这是段落文本!
语义化格式
这些标签与之前提到的格式标签类似,但它们有语义价值(意义)。 用于你想要强调的内容, 用于重要的内容。通过嵌套这些元素,你可以传达文本的强调或重要性级别。嵌套的层数越多,文本的重要性就越高。
示例
警告:酸会造成严重灼伤
表格
用于以行和列显示信息的元素。支持带有标签的列标题和列尾。将信息分为行(由 tr 标签表示),行中包含单元格(由 td 标签表示)。
示例
项目 | 价格 |
---|---|
香蕉 | ¥8.00 |
酸奶 | ¥10.00 |
总计 | ¥18.00 |
标签和元素
标签是基本的标签,用于将你的标记分成元素。它们由一个关键词组成,关键词被尖括号 <> 包围。内容位于两个标签之间,关闭标签前缀为斜杠(注意:有些 HTML 标签是自闭合的,如图像标签)。标签还可以有属性。
语法
标题
此标签告诉浏览器在顶部显示页面标题,并告诉搜索引擎你的网站标题是什么。它位于
标签内。尽量使你的页面标题描述性,但不要太冗长。示例
希望这篇文章能帮助你更好地理解 HTML!如果你有任何问题或需要进一步的帮助,请随时访问 编程狮。
课程推荐:
HTML入门课程
小白学前端:HTML零基础入门