Rumah > hujung hadapan web > Tutorial H5 > HTML5第三天笔记

HTML5第三天笔记

黄舟
Lepaskan: 2016-12-28 17:14:00
asal
1511 orang telah melayarinya

CSS 

html:结构

css:表现

CSS:层叠样式表

作用:修饰和美化html 。实现了结构和样式的分离。

Cascading Style Sheet

使用DIV+CSS优点:

1.表现和内容分离

2.提高页面浏览速度

3.易于维护和改版

样式表

选择器

样式

语法: 选择器{样式1:样式值1;样式2:样式值2;}

样式表的分类:

1,行内样式表;(没有实现结构和表现的分离;优先级最高)

语法:

123



2, 内部样式表;(没有实现结构和表现的分离;)

语法;



3,外部样式表;(实现了结构与表现的分离;

1)链接式样式表:





2)导入式样式表;(很少用到)

语法:

样式表的优先级:

就近原则

行内样式表优先级最高

注释:

html注释

css注释 /*CSS*/ 

不能嵌套注释

选择器:

基本选择器:

1)全局选择器:* 表示 语法:*{样式}

*代表所有的标签、所有的标签样式全部改变

2)标签选择器

p{ }

h1{ }

特点:相同的标签具有相同的样式

3)类别选择器

先定义 后引用

定义: .类选择器名称{样式}

引用:class="类别选择器的名称"

特点:定义一次,多次使用。使用两个类别选择器时用空格空开

4)id选择器

先定义 后引用

定义:#id选择器的名称{样式}

引用:id="id选择器的名称"

特点:具有唯一性

id在同一个页面中名称一样的id只能出现一次

优先级高

选择器的优先级:

行内样式表>id>.class>element(标签选择器)>*(全局选择器)

权重: 1000 >100> 10 > 1 > 0

权重用加法计算

颜色值的表示法:

1,单词表示法:red;green;blue;yellow;orange;pink;purple;black;white;

2,十六进制表示法:(0-9 a-f) #ff0000 #红红绿绿蓝蓝

#f00 #红绿蓝

3,rgb表示法:(0-255)

background-color:rgb(255,0,0) rgb(红,绿,蓝)

rgb(255,255,255)白色

4,rgba表示法:

a表示透明度(0-1之间的改变,0表示完全透明,1表示不透明;)

background-color:rgba(255,0,0,0.5)

background-color:rgba(255,0,0,.5)

rgb相等的时候表示一种灰

 以上就是HTML5第三天笔记的内容,更多相关内容请关注PHP中文网(www.php.cn)!


Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan