知识点回顾
表格知识点补充:
边框与边框的距离border-spacing
border-collapse:两个属性值
caption-side标题的位置top,bottom
empty-cells空表格的隐藏显示:show/hide
table-layout:fixed固定宽度
form表单:
表单控件:
单选框 type=radio name属性连用 name属性值必须一致、复选框 type=checkbox 、file、select option、文本域:textarea
表单属性:
cols设置文本域的宽度、rows设置文本域的行数、multiple多文件上产、checked默认选中、disabled禁用、
表单的css样式:
获取焦点,选中,outline,清除默认样式
fieldset、legend、label
h5新增的控件
BFC
双飞翼布局
1.
2.
BFC
定义:
块级格式化上下文
作用:
相邻元素垂直外边距合并【】,margin-top值传递【子元素设置margin-top之后,父元素会随之下移】,高度塌陷【父元素没有设置高度,子元素 设置浮动之后高度会发生塌陷】,布局【两栏布局,双飞翼布局。。。】
属性选择器
定义
选择属性进行操作
属性选择器无法识别 : // .
[type]
选择带有type属性的进行操作
[type="value"]
选择的type属性值为value
[type^="value"]
选择的type属性值开始位置带有value
[type$="value"]
选择的type属性值结束位置带有value
[type*="value"]
选择的type属性值含有value
结构伪类选择器
1.:first-child[选择第一个元素]/:last-child[选择最后一个元素]/:nth-child()[第n个元素,或者是奇数odd偶数even]/:nth-last-child()[倒着来]
2.:first-of-type[选择第一类元素]/:last-of-type[选择最后一类元素]/
:nth-of-type第n个元素,或者是奇数odd偶数even
:nth-last-of-type[倒着来 第n个元素,或者是奇数odd偶数even]
3.E:only-child 只有一个子元素【并且这个子元素为E才会操作他的样式】
4.E:only-of-type 这一类子元素只有一个
5.:empty 元素为空【连空格也不允许】
6.:root 操作的为body的样式
状态伪类选择器:
表单控件
:disabled 禁用表单的样式
:enabled 正常使用的表单的样式
:checked 选中之后的样式
:focus 获取焦点之后的样式
否定伪类选择器:
:not() 除了什么什么 可以让你定位不匹配该选择器的元素
目标伪类选择器:
:target 选择器可用于选取当前活动的目标元素。
使用该选择器来对页面中的某个target元素(该元素的id当做页面中的超链接来使用)指定样式,该样式只在用户点击了页面中的超链接,并且跳转到target元素后起作用。