前端——HTML标签
什么是HTML标签？HTML（超文本标记语言）是构建网页和网络应用的标准标记语言。HTML 文档由一系列的标签（tags）构成，这些标签是构成网页内容的基础。每个标签都有特定的用途和寄义，它们定义了网页的结构和内容。
https://i-blog.csdnimg.cn/direct/dc3fd2d28eea48f4ba74b6a12e0e93fd.png
所有主流欣赏器都支持<html>标签。
如今大多使用HTML 5。
标签定义及使用阐明
<html> 标签告知欣赏器这是一个 HTML 文档。
<html> 标签是 HTML 文档中最外层的元素。
<html> 标签是所有其他 HTML 元素（除了 <!DOCTYPE> 标签）的容器。
块级元素 内联元素
HTML标签中分块级和内联。
块级元素会强制换行，并且占欣赏器全部的宽度 （div标签）
内联元素可以包罗在块级元素内 （a标签）
https://i-blog.csdnimg.cn/direct/ffaee82330574f1eb7ea796e01e2ec20.png
标签属性
标签可以拥有属性，属性格式如下：
https://i-blog.csdnimg.cn/direct/c356211aee09449b98cbe62b920809f4.png
a代表超链接
可以使用双引号，也可以使用单引号
href代表引用，厥后加上一个链接，“>”后可以填写代表这个链接的内容，以百度链接为例，例子如下：
https://i-blog.csdnimg.cn/direct/a73815c9483e45ce82fc94fba87efe4b.png
接下来右键点击Open with Live Server运行，会得到如下页面：
https://i-blog.csdnimg.cn/direct/c4b052a58daf4ef2b699860dbf2e48f6.png
点击蓝标的百度就会乐成进入百度搜索网页
常用标签
html
html标签限定了文档的开始点和结束点
https://i-blog.csdnimg.cn/direct/5e3ae56697384d61b431735b797b7ba7.png
head
head标签用于定义文档的头部。head标签中一般用于引入脚本、样式表以及文档的各种属性信息,绝大多数文档头部包罗的数据都不会真正作为内容显示给读者。
https://i-blog.csdnimg.cn/direct/4f708bb74ef9431999c95fdade95f78c.png
body
body 标签定义文档的主体。
https://i-blog.csdnimg.cn/direct/b4743260fcb44dba9500d3bb9816c924.png
h1--h6
一级标题—-六级标题
https://i-blog.csdnimg.cn/direct/eff1cbb75a9043378ebeb342158b4089.png
会出现如下的效果：
https://i-blog.csdnimg.cn/direct/80d45f4d29cf4a1eb1cf95d0893ed1e0.png
p
段落，一个p（<p></p>）表现一行
https://i-blog.csdnimg.cn/direct/45214717874a4999bc1acad430b48055.png
br
换行，举例：
换行前
https://i-blog.csdnimg.cn/direct/c8fe71e749ea4aaa93778fcf1afb54f9.png
https://i-blog.csdnimg.cn/direct/626c0b10746c4e998c47ddfae06bdb8d.png
换行后
https://i-blog.csdnimg.cn/direct/57ac8ea26f874384af50aae7464c0896.png
https://i-blog.csdnimg.cn/direct/b8141afb7b014875a5f9ea68b685cd35.png
a
超链接，以百度为例
<a href="https://baidu.com">百度</a> <p>请点击<a href="https://baidu.com">百度</a></p>
<p>在新的页面打开<a href="https://baidu.com" target="_blank">百度</a></p>
注释
快捷键“Ctrl + ？”，再次点击则为取消注释
若需要添加多行注释，则需要先选中多行，再点击“Ctrl + ？”
<！-- 注释的内容 --> https://i-blog.csdnimg.cn/direct/2557e928d6864388831b802eb2cd575e.png
ul li
无序列表
https://i-blog.csdnimg.cn/direct/fe48bf869029470baedb7b048b4a5c37.pnghttps://i-blog.csdnimg.cn/direct/a983460c16ac4d47a20279596638d464.png
ol li
有序列表
https://i-blog.csdnimg.cn/direct/56746873f8b64c2bb66e2184eb04fc01.pnghttps://i-blog.csdnimg.cn/direct/562a56bf45a7462794ded8b699a6f9c2.png
table
表格
没有css样式的table很丢脸
https://i-blog.csdnimg.cn/direct/aaf64775fa4445ecbc7c16c0ccab9402.pnghttps://i-blog.csdnimg.cn/direct/228e1ee7a56f42cd9d65feb9db0b7ac9.png
上面是随便举的一个例子，在这个table之前可以添加一个style样式来美化这个表格
form
表单
样例如图：
https://i-blog.csdnimg.cn/direct/45decac3dff44e458b36bc981b2c1936.png
https://i-blog.csdnimg.cn/direct/42b4e7f2aff041b1a939f0c0c3be3021.png
img
图片
https://i-blog.csdnimg.cn/direct/b9e8c132fe2b44ee8958ccbe6fe454ba.png
src填图片路径，alt填反馈效果
style
样式标签
css选择器
1.类选择器：.classname
2.id选择器：#idname
https://i-blog.csdnimg.cn/direct/558ac53d3ac5404f9dc65b22201306ff.png
比力复杂，涉及css内容
总结
HTML标签尚有许多，大家可以自行查找
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]