国开大学Web开发课程基础知识点小结(四)
(1)样式声明中,属性名和属性值之间用冒号连接,多个样式声明之间用分号隔开。
(2)内联样式,又称为“行内样式”,是指定义在HTML元素的开始标记中的style属性内的一组CSS样式声明。例如:
(3)内部样式表,是指在网页的head元素内的标记内定义的一组样式规则。 样式规则是指由选择器和样式声明组成的一套样式整体。例如:body{font-size:12px;color:red;}。其中,选择器是用于查页面中要应用该样式的元素的查条件。一套样式规则中的多个CSS样式声明应该定义在紧跟选择器之后的{}内。
(4)外部样式表,是指定义在一个独立于任何网页之外的文件中的一组CSS样式规则。通常保存外部样式表的文件扩展名为.css。一个网页要使用一个CSS文件,必须先引入CSS文件。代码为。
(5)CSS样式具有三大特征:继承性、层叠性和优先级。继承性是指父元素上定义的样式,可由子元素直接继承。但不是所有父元素的样式,子元素都自动继承。层叠性是指可在不同样式表中为同一个元素设置多处样式规则。如果多处样式规则中的样式声明不冲突,最终都会合并应用到该元素行。优先级是指当为同一个元素在不同样式表中定义的样式声明有冲突时,按照优先级顺序来应用样式。
(6)默认的优先级顺序是:内联样式的优先级高于内部样式表和外部样式表;内外部样式表的优先级高于浏览器内置样式表的优先级;内部样式表和外部样式表的优先级,取决于在页面中引入的先后顺序;浏览器加载页面内容时,是顺序加载,后加载的同名样式会覆盖先加载的。
(7) !important可将当前样式声明的优先级提升为最高。
(8)元素选择器,用于匹配与指定标签名相同的元素,如div{}、p{}、a{}等。
(9)类选择器,用于为一个样式规则定义一个自定义的样式类名称。类选择器的名称必须以“.”开头,且中间不能包含特殊字符,也不能以数字开头,如.menu{}、.btn{}等。但是,样
式类名不会自动匹配元素,需要在HTML页面中,在要应用该样式规则的元素开始标记中,人为设置class属性的值为样式类名(不加“.”)。例如:
(10)元素分类选择器,是指将元素和分类选择器联合使用,为了匹配必须同时满足两个条件的元素,如p.test{}。
(11)id选择器,用于为某一个特定元素定义专属样式。使用id选择器需要两步。第一步是自定义id选择器和样式规则。语法为:#id名{}。其中,id名前必须加“#”,表示是id选择器的意思。第二步,在HTML中要应用该样式的元素上定义唯一的id名。HTML中定义id属性,不用加“#”。
(12)组选择器,是将多个选择器并列放在一起匹配样式。每个子选择器之间用“,”分隔,如div,p{}。
(13)后代选择器,用于在一个元素的所有后代子元素中查符合条件的元素。后代子元素是指当前元素的直接子级以及子元素内更深层次的内嵌子元素。语法为:父元素选择器子元素选择器 …。例如:ulli{}。
(14)子代选择器,是指仅查某个父元素下的满足条件的直接子元素。语法为:父选择器>子选择器。例如:ul>li{}。
设置纵向自动滚动条css(15)伪类选择器,是用于匹配元素不同状态的选择器。当元素状态改变时,可实现样式随之改变。伪类选择器都是以“:”作为选择器的开始,并紧跟要修饰的元素选择器或其他选择器后。
(16)链接伪类:用于匹配超链接元素不同状态的伪类。其包括: :link,匹配超链接元素尚未访问时的链接样式; :visited,匹配超链接元素访问后的链接样式。
(17)动态伪类:用于根据元素状态变化动态改变样式的伪类,可用于任意元素。其包括: :hover,匹配当鼠标悬停在该元素上时的样式; :active,匹配当元素被激活时的样式;:focus,匹配当元素获得焦点时的样式。
(18)选择器的权重值如下:元素选择器权重值=1;类选择器权重值=10;伪类选择器权重值=10;ID选择器权重值=100;内联样式权重值=1000。可见,内联样式的优先级最高,不会被替换。在样式表内,ID选择器优先级最高,元素选择器优先级最低。如果两个选择器优先级相同,则后定义选择器中的CSS属性会覆盖先定义的同名CSS属性。
(19)尺寸单位包括:px,指像素单位;in,指英寸;pt,指磅;cm,指厘米;mm,指毫米;em,指倍数,查父元素同属性的值;rem,也指倍数,但是,参照的是body的同属性的数值; %,指百分比,参照父元素相同属性的大小。
(20)为了尽量适应不同大小的显示设备,应该尽量选择相对单位设置尺寸。
(21)颜的值由3个数值组成,分别代表红、绿、蓝。3种颜叠加或混合,形成各种各样的颜。定义颜属性的值,有以下几种方式:rgb(r,g,b); rgb(r%,g%,b%); rgba(r,g,b,alpha);#rrggbb;#rgb,还可使用颜的英文名设置颜值。
(22)尺寸属性包括:width和height。块级元素都可修改尺寸。行内块元素也可修改尺寸。表单元素中,除单选按钮和复选框之外,其余都可设置尺寸。本身具有width属性和height属
性的元素,也可以通过CSS修改尺寸,如img和table等。但是,大多数行内元素,无法设置尺寸,如a和span等。
(23)当内容多、元素区域小时,就会产生溢出。如果内容是文字,默认就是纵向溢出。如果内容是图片,则默认纵向和横向都会溢出。控制溢出的属性包括:overflow属性用于设置纵向和横向两个方向的溢出显示样式;overflow-x属性用于设置横向溢出的显示样式;overflow-y属性用于设置纵向溢出的显示样式。
(24)溢出属性,可取以下4个值之一:visible,表示显示溢出部分,此为默认值;hidden,表示隐藏溢出部分,但不提供滚动条;scroll,表示隐藏溢出部分,但是,无论是否内容溢出,都始终显示滚动条;auto,表示自动判断是否溢出,只有溢出,才显示滚动条,否则不显示。
(25)border属性值由三部分组成,按顺序分别是:width、style和color。width属性值控制边框的粗细。style属性值控制边框的样式,可选以下几个值:solid实线、dotted圆点虚线、dashed线条虚线。color属性控制边框的颜。