1.html 结构
- html标签是整个html文件的根标签(最顶层标签)
- head标签中写页面的属性
- body标签中写的是页面上显示的内容
- title标签中写的是页面的标题
- head和body是html的子标签(html就是head和body的父标签)
- title是head的子标签.head是title的父标签
- head和body之间是兄弟关系
2. html 常见标签
- 2.1 注释标签
- 2.2 标题标签
- h 系列标签“标题”语义,h 是 headline 的意思
- 搜索引擎非常看重
<h1></h1>标签的内容,应该将重点内容放到<h1></h1>中,比如网页的 logo 等 <h1></h1>标签一般只能放置一个,否则会被搜索引擎视为作弊- 标题一共有 6 级, h1 为一级标题, h2 为二级标题, 以此类推, 重要程度依次递减
- 标题的特点, 文字加粗, 字体变大, h1 最大, h6 最小, 独占一行
- p标签
- p标签表示一个段落
- br标签
- br, break 的缩写, 单标签, 可以让文字强制换行, 不会像 p 标签一样有缝隙
<br>,<br/>,<br />都可以- br标签和p标签的区别
- 段落标签之间会有间隙
- 换行标签只是单纯的换行, 行距不变
<br>是单标签,<p>是双标签- hr标签
- hr 标签
Horizontal Rule的缩写, 使用场景: 分割主题和内容, 在页面中显示一条水平线 - 文本格式化标签
- 转义字符
- 图片标签
- img标签必须带有src属性,表示图片的路径
- img标签的其他属性
- alt:替换文本,当文本不能正确显示的时候,会显示一个替换的文字
- title:提示文本,鼠标放在图片上,就会有提示。
- width/height:控制宽度和高度,高度和宽度一般改一个就行,另一个会等比例缩放,否则图片会失衡。
- border:边框,参数是宽度的像素,但是一般使用css来设定。
- 超链接标签
- a标签
- 使用 a 标签制作超级链接
- href属性:href 属性支持相对路径和绝对路径
- title属性:a 标签的 title 属性用于设置鼠标的悬停文本
- target 属性:将 a 标签的 target 属性设置为
_blank,即可在新标签页中打开网页
- 将 a 标签的 target 属性设置为
_self,即可在原标签页中打开网页
- 给图片设置超链接
- 图片也可以设置超级链接,只需要用 a 标签包裹 img 标签即可
- 页面内锚点
- 较长的页面,可以适当的给 h 系列标签添加 id 属性,它将成为页面的“锚点”
- 当网址后面添加#时,网址会在后面加上
#id的名字, 页面将自动滚动到锚点所在位置,效果就像设置了目录一样, 点击可以跳转到指定位置。
-
下载链接
-
指向 exe、zip、rar 等文件格式的链接,将自动成为下载链接
-
空链接, 如果暂时不知道跳到哪个地址, 可以做成空链接, 写一个
#占位置