小白的前端学习笔记（定位+html5）

定位

position属性

1、static   默认值 无定位
2、relative 相对定位
       1、在文档流中
	   2、相对自身原来的位置
	   3、发生偏移时保留原来位置
	   4、自身偏移时不会影响到其他元素
3、absolute 绝对定位
       1、绝对定位相对父容器的位置（其父容器必须含有定位）
	   2、脱离文档流
	   3、如果没有设置位置则显示在原来的位置（但不在文档流中，即浮在原来的位置上）
4、fixed    固定定位
       1、脱离文档流
	   2、相对浏览器的位置（不会随着滚动条滚动）
	   3、精确的控制位置： left right top bottom

设置优先级

   z-index:  值越大优先级越高越排在最上面

html5新增标签

article

用于存放一段独立的内容，可以使文档或者文章

header

一般在页面的顶部，或者某个独立内容的顶部
一般作为标题简介，一个页面可以有多个header

footer

一般在页面的底部，或者某个独立内容的底部
一般作为页面最底部，一个页面可以有多个footer

nav 用于页面导航，或者是侧边导航栏

aside

不是页面的主要内容
一般作为侧边栏、广告、对页面的补充、友情链接

section

用于主题性的内容，一般含有一个标题，可能会含有一个底部
一般用来分组使用

main

主题内容，一个页面只能包含一个main

figure

用于存放图片或者视频

figcaption

用于存放图片或者视频的标题

time

  属性有datetime="2020-05-23"
  一般作为搜索引擎或者阅读器更容易获取到的时间

视频播放标签 video

controls  设置播放的工具
muted     设置静音播放
autoplay  设置自动播放（如果有就会播放 如果没有就不会播放）
preload   设置是否预先加载视频
           none  不预先加载
		   auto  根据你当前的网络状态，设置是否预先加载
		   metadata  不放钱不会预先加载，只会加载前几帧
poster   设置预加载的图片
width height 宽高
loop     循环播放
里面的source属性
     src 视频地址
	 视频加载自上而下选择视频格式

结语

html+css大致已结束，以此留念