这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天
一.语法规范
<!DOCTYPE html>文档类型声明,让文档知道网页的版本是html
<html lang="en">lang是用来指定语言的,en 英文,zh中文
<meta charset="UTF-8">meta用来设置网页基本信息,设置网页的元数据告诉浏览器如何解析网页,避免出现乱码
二.常用标签
1.表示强调
<em></em>表示强调,默认浏览器会以斜体显示em中的文字,读音上的强调
<i></i>与em显示效果相同,但是没有含义
<strong></strong>表示强调,默认浏览器会以黑体的形式显现,语义上的强调
<b></b>与strong效果相同,但无意义
<h1>-<h6> 标题标签,h1-h6强调等级逐渐降低
2.表示引用
<q></q>表示引用,双引号
<blockquote></blockquote>长引用,块元素,不要放在p标签中
<cite></cite> 短引用
<code></code> 代码引用
3.删除线和下划线
<del></del> 删除线 <s></s> 含义相同
<ins></ins> 下划线 <u></u> 含义相同
4.盒子标签
<div></div>标签用来布局,是一个大盒子。一行只能占一个
<span></span>标签也用来布局,一行可以放多个,是一个小盒子。
5.图像标签
<img src=“图像路径”/>
属性:
(1)alt 替换文本 图像显示不出来的时候用文字进行替换。也是无障碍的一种形式
eg.<img src="图片路径” alt="对图片的解释文字”/>
(3)title 提示文本,鼠标放到图像上,提示的文字。
eg.<img src="图片路径” title=“当鼠标当在图片上时会显示的文字”/>
(4) width 和 height 设置图像的宽与高
宽度和高度如果只修改一个,则另一个会等比例缩放。
eg. <img src="图片路径” width="500" height="500"/>
(5)border设置边框的粗细
eg. <img src="图片路径” border="15"/>
6.音频标签
<audio src="音频路径"></audio>
属性
(1)Controls 用来设置是否允许用户控制音频播放
(2)Autoplay 用来设置音乐是否自动播放
(3)loop循环播放
7.视频标签
<video src="视频路径"></video>
8.超链接
<a href="跳转目标页面" target="目标窗口的弹出方式”>文本图像</a>
属性
target:用于指定链接页面的打开方式,
_self为默认值,将原窗口换为超链接的窗口,
_blank为在新窗口中的打开方式,原窗口不变,打开另外一个窗口。
锚点链接:点击时可以快速定位到链接中的某个位置
eg.<a id ="bottom" href="#">回到顶部</a>
<a href="#bottom">回到底部</a>
用id指定
<a href="#live">个人生活</a>
<h3 id="live">个人生活</h3>