发表于: 2020-03-15 23:10:50
0 1565
今天完成的事情:
# 基础
## img图片元素
**map属性**
给图片划分区域
点击图片跳转链接,点击指定形状跳转链接
```html
<a href="https://baike.baidu.com/item/蒸汽机器人/2697464?fr=aladdin"><img usemap="#blz" src="./11.png"></a>
<map name="blz">
<area shape="circle" coords="367,118,65" href="https://www.baidu.com" alt="" target="_blank">
</map>
shape="circle" 圆形
coords="367,118,65" 坐标 用截图量出x和y的坐标,然后填半径
shape="rect"矩形
coords="242,359,456,410" 坐标 用截图量出矩形的左上角和右下角坐标
shape="poly"多边形
coords="301,258,341,343,457,356,427,262,378,215"
```
**figure元素**
指代,定义,通常用于把图片,图片标题,描述包裹起来
子元素:figcaption 包裹标题
## 多媒体元素
### video
布尔属性,在HTML5中,可以不用书写属性值
controls="controls" // 可以简写成controls
autoplay:自动播放
muted:静音播放,网站不允许自动播放时加上这个书写可以播放
loop:循环播放
### audio
和视频完全一致
### 兼容性
不同的浏览器支持的音频格式可能不一致
准备多种格式让浏览器选择能识别的
```html
<video controls autoplay muted loop>
<source src="mp4">
<source src="webm">
<p>对不起,你的浏览器不支持video元素,请点击这里下载最新版本的浏览器</p>
</video>
```
## 容器元素
div 没有语义
## 元素包含关系
> 以前:块级元素在显示时会独占一行,行级元素不会,块级元素可以包含行级元素,行级元素不可以包含块级元素,a元素除外,根据W3C标准描述,到了HTML5,已经弃用这种说法,元素代表什么含义,和显示无关,元素的包含关系由元素类别决定
明天计划的事情:
学习基础
遇到的问题:
无
收获:
好看的颜色#008c8c
font-family:consolas,微软雅黑,Arial,sans-serif;//sans-serif,非衬线字体
用户电脑必须存在的字体才有效,使用多个字体,匹配不同环境
line-height:1.5;每行文本的,行高可以设置为春数字,表示相对于当前元素的字体大小
评论