本文是黑马pink老师的Web前端入门笔记第二部分，主要介绍了HTML的基础知识，包括HTML标签的语法规范，基本结构，常用标签如语义标签、标题、段落、换行、文本格式、div和span、图像和超链接的使用，以及HTML中的注释和特殊字符。重点讲解了标题标签、段落标签、图像标签和超链接标签的语法和应用。
Web前端入门
二、HTML标签
（一） 学习目标
（二）HTML语法规范
1、 所有标签由尖括号加关键词组成，如<html >。
2、 双标签：大部分情况下标签成对出现。<html></html>,其中<html>为开始标签，</html>为结束标签，多一个/。
双标签关系分为包含关系和并列关系。
3、单标签极少情况，单标签的结尾加上/如<br />。
（三） HTML基本结构标签
1、概念
/2、制作第一个网页
txt中编辑如下内容，另存为.html文件，并用浏览器打开。
（四） 开发工具
1、使用记事本写.html文件有诸多不便，课程中选择VSCode进行.html的编写。
/2、 安装VSCode
VSCode中安转以下插件，输入英文感叹号出现HTML基本结构，编辑title和body后，右键选择Open in Default Browser 打开网页。
3、使用VSCode进行网页开发：
（1）Ctrl n:新建文件
（2）Ctrl s:保存为.html
（3） Ctrl +/-: 代码字体变大/变小
（4） 英文!:生成页面骨架结构
（5） 安装插件，右键鼠标选择浏览.html文件
4、VSCode工具生成骨架标签新增代码
※ <!DOCTYPE>标签：必须写到整个页面的第一行，文档类型声明标签，告诉浏览器当前页面采用的那个HTML版本，（HTML4/HTML5/XHTML）。如<!DOCTYPE html>表示当前页面采取HTML5进行显示。不是HTML标签，而是文档类型声明标签。
5、lang语言：定义当前文档显示的语言。
en为英文页面、zh-CN表示中文页面，但对于文档显示来说，定义成en也可以显示中文，定义成zh-CN也能显示英文。这个属性对浏览器和搜索引擎有作用，建议中文网站为zh-CN，否者浏览器会提升进行翻译。
6、charset字符集：识别和存储各种文字,charset常用的值有：GB2312, BIG5, GBK和UTF-8, 其中UTF-8也被成为万国码，基本包含了全世界所有国家的文字。必须写得代码，否则会引起乱码情况。
（五） HTML常用标签
1、语义标签：
标签的含义，用来干嘛的。根据标签的语义，在合适的地方给一个合理的标签，能让页面的结构更清晰。
2、标题标签(重要)：
<h1>-<h6>，表示一级-六级标签，重要性递减。h为head的缩写，是双标签如：<h1> </h1>。加了标题的文字会加粗，字号也会变大，并且独占一行。
※ 练习：
※ 新建ctrl n， 后先保存ctrl s，代码更改后先ctrl s保存，在用浏览器打开。
3、段落和换行标签(重要)：
①段落标签
a、语法格式
<p>我是一个段落标签</p>
b、标签语义：把文字分为不同的段落，p为paragraph 段落缩写。
c、文本在一个段落中，会根据浏览器的大小自动换行，段落和段落之间保有空隙。
d、练习
e、 查看中勾选自动换行能消除文字的段落间隙。
②换行标签
a、语法格式（单标签）
我是<br />一个换行标签
我是
一个换行标签
b、 标签语义：强制换行，br为break 换行缩写。
c、 <br />是一个单标签，<br />和<p>的区别，段落标签不同段落间有间距，换行标签没有间距只是换行。
d、 练习：新闻
e、 双标签，先将标签内的内容剪切，在输入html标签，最后将粘贴板的文字复制到标签内；单标签直接加在合适位置。按层级依次对标题、段落、换行标签进行操作。
4、文本格式标签：
①语法格式：
② 标签语义：突出重要性，在网页中为文字添加粗体、斜体或下划线等效果，使文字以特殊方式显示。
③ 练习
5、div和span标签：
①语法格式：
<div>我是一个div标签，我一个人单独占一行</div>
<span>百度</span>
<span>新浪</span&g
最低0.47元/天 解锁文章
656
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
