1.CSS:层叠样式表,规定如何显示HTML,美化HTML。CSS由多个样式规则组成,每个样式规则有两部分组成:选择器和样式声明。CSS的使用方式有三种,分别是:
1)内联样式:样式定义在单个的HTML元素中,直接写在标签的style属性里,属性与属性值之间用:连接,属性之间用;分隔
2)内部样式:样式定义在HTML的头元素(<head>)中,包含在<style>标签中
3)外部样式:样式定义在外部.css文件中,再由HTML的头元素中的<link/>(单标签)引用
2.CSS规则性:
1)继承性:子元素继承父元素的规则声明
2)层叠性:若元素有不同的规则声明,则可以叠加
3)优先级:对于冲突的规则声明(如都声明了字体大小),则内联样式的优先级最高,遵循就近原则
3.CSS选择器
1)元素选择器:根据元素名选择CSS的作用目标
2)类选择器:根据元素的class属性值选择,语法:.className{}
3)id选择器:根据元素的id属性值选择,语法:#id{}
4)选择器组:多个选择器用逗号隔开
5)派生选择器:选择某个元素的子元素
6)伪类选择器:用于设置不同状态的元素规则,一般和其他选择器一起使用
---:link:向未被访问的超链接添加样式
---:visited:向已被访问过的超链接添加样式
---:active:向被激活的元素添加样式
---:hover:鼠标悬停至元素上方时,添加样式
---:focus:元素获得焦点时,添加样式
4.border:边框,它的overflow(当内容溢出元素边框时如何处理)值有:
---visible:溢出部分可见,缺省值
---hidden:溢出部分隐藏
---scroll:溢出部分组成滚动条
---auto:边框自动适应高度,包含全部内容
5.box模型:定义了元素框处理元素内容、边框、内外边距的方式
6.box模型边框设置:
1)四边设置:内外边距只设置一个值,表示四个方向的值一样
2)单边设置:分别给每个边设置
3)对边设置:只设置两个值,分别表示上下、左右的值
7.定位:定义了元素框相对于元素本身的位置或父元素的位置,甚至浏览器等出现的位置
1)流定位:块级元素从上到下垂直排列,行内元素从左到右水平排列
2)浮动定位:让元素脱离流定位,然后将元素放置在父元素的左边或右边,浮动定位不脱离父元素,经常用来实现特定的显示效果。设置浮动定位的属性是float,清除浮动定位的属性是clear
3)相对定位:元素所占空间不释放,只是相对本身位置进行移动。首先设置position的值为relative,然后由left或right设置水平偏移,top或button设置垂直偏移
4)绝对定位:元素所占空间释放,相对最近已定位的祖元素的位置进行移动。首先设置position的值为absolute,然后由left或right设置水平偏移,top或button设置垂直偏移
5)固定定位:元素不占页面空间,相对于浏览器进行设置首先设置position的值为fixed,然后由left或right设置水平偏移,top或button设置垂直偏移
8.显示方式:元素都有默认的显示方式,块级元素是从上到下,可以设置宽高;行内元素是从左到右,不能设置宽高;行内块,从左到右显示,能设置宽高
---用display属性改变显示方式,值有none(不显示该元素,并释放位置)、block(将元素设置为块显示)、inline(将元素设置为行内显示)、inline-block(将显示方式设置为行内块)