CSS布局和CSS动画笔记

　　1.css的概述

　　1.问题

　　HTML属性修饰有一定局限，是不太便捷

　　2.css的语法规范

　　1.使用css样式方式

　　1.内联样式

　　行内样式

　　特点：将css样式定义在HTML标记中

　　语法：<ANY

　　样式声明：用样式属性和值组成（属性：值;）

　　常用的样式属性：

　　1.颜色

　　属性：color 颜色

　　取值：颜色英文名

　　2.背景颜色

　　属性：background

　　取值：颜色

　　3.设置文字大小

　　属性：font-size

　　取值：数值 px （pt）

　　2.内部样式

　　在网页独立地方声明所有样式

　　在头元素<head></head>中先增加一对<style></style>,在<style>标记写样式规则

　　样式规则：由选择器和样式声明组成

　　3.外部样式

　　独立于任何网页位置处，声明一个样式文件（。css为后缀），在文件中声明样式，在使用的网页中引入。css文件。

　　使用步骤：

　　1.创建样式表文件（。css）

　　2.在样式文件中编写样式规则

　　3.在网页中对样式文件进行引入

　　3.CSS样式特征

　　1.继承性

　　必须是父子（有层叠嵌套的关系）结构

　　大部分的css效果是可以

　　2.优先级

　　1.浏览器默认样式

　　2.内部样式和外部样式（就近原则）

　　3.内联样式

　　4.!important;

　　绝对优先使用（）

　　格式 p{

　　color:red !important;

　　}

　　2.css选择器

　　1.选择器的作用

　　规范页面中那些元素能够使用定义好的样式。

　　2.选择器详解

　　1.通用选择器

　　*{样式}

　　2.元素选择器

　　p{样式}

　　3.类选择器

　　1. 声明

　　。class名{样式}

　　2.引用可以引用多个类名用空格隔开

　　4.id选择器

　　#id名{样式}

　　3.特殊选择器

　　1.群组选择器

　　#id ,.class{样式}

　　1.子选择器

　　#id>.class{样式}

　　1.分类选择器

　　div .class{样式}

　　4.伪类选择器

　　作用：匹配元素不同状态的选择器

　　语法：所有的伪类都是以 : 作为开始

　　选择器：伪类选择器{样式}

　　伪类分类

　　1.伪类链接

　　：link 匹配尚未访问的超级链接状态

　　：visited 匹配访问过的元素的状态

　　2.动态伪类

　　：hover 匹配鼠标悬停在元素上时的状态

　　：active匹配鼠标激活时元素的状态超链接、文本框、

　　密码框点击的时候，就是active。

　　：focus匹配元素获取焦点时的状态文本框和密码框

　　5.尺寸与边框

　　1.单位

　　1.尺寸单位

　　1.px 像素

　　1024*768

　　2.in 英寸

　　1in=2.54cm

　　3.pt 磅（1pt=1/72in）

　　4.cm 厘米

　　5.mm 毫米

　　6.em 相对父元素乘以倍数

　　7.rem 相对于根元素（html,body）乘以倍数

　　8.% 相对单位

　　2.颜色单位（取值）

　　1.颜色英文单词

　　blue,red,green,yellow…

　　2.rgb（r,g,b）

　　r:red;

　　g:green;

　　b:blue;

　　r,g,b:0-255

　　rgb（0-255,0-255,0-255）

　　3.rgb（r%,g%,b%）

　　4.rgba（r,g,b,aplha）

　　aplha:透明度，0-1之间的小数，值越大，不透明度越高

　　5.#rgb

如需转载，请注明文章出处和来源网址：http://www.divcss5.com/html/h61889.shtml