发表于: 2020-03-15 23:10:50

0 1562


今天完成的事情:

# 基础


## 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;每行文本的,行高可以设置为春数字,表示相对于当前元素的字体大小




返回列表 返回列表
评论

    分享到