Heim > Web-Frontend > HTML-Tutorial > 一.CSS工作原理_html/css_WEB-ITnose

一.CSS工作原理_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 12:00:35
Original
1107 Leute haben es durchsucht

 

CSS全称层叠样式表,它是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。是能够真正做到网页表现与内容分离的一种样式设计语言,能够对网页中的对象的位置排版进行像素级的精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力,并能够进行初步交互设计,是目前基于文本展示最优秀的表现设计语言。

CSS规则

CSS文档由一系列规则组成,一条CSS规则实际上就是一条CSS指令,这条指令先选择HTML元素,然后设定选择元素的样式

下面是一条简单的CSS规则,它把段落背景色设置为绿色

p{background-color: green}
Nach dem Login kopieren

CSS基本规则

一条CSS规则由选择符+声明两部分组成

选择符:指出要选择的元素

声明:由属性和值组成,属性指出影响元素哪方面样式,值其实就是属性的一种状态

在上面的例子中可以看出一条规则从左到右依次是:选择符、左花括号、属性、冒号、值、右花括号

对基本规则扩展1:多个声明包含在一条规则中

p{color: green;font-size: 45px;font-weight: bold}
Nach dem Login kopieren

每个声明后加一个分号,以示分隔

对基本规则扩展2:多个选择符组合在一起

h1,h3,p{color: green;font-size: 45px;font-weight: bold}
Nach dem Login kopieren
Nach dem Login kopieren

选择符之间用逗号分隔
对基本规则扩展3:多条规则应用于同一选择符

h1,h3,p{color: green;font-size: 45px;font-weight: bold}
Nach dem Login kopieren
Nach dem Login kopieren

现在我们想让p段落的背景色为蓝色,可以继续添加一条规则

p{background-color: blue}
Nach dem Login kopieren

CSS选择符分类

所有用于选择特定元素的选择符分为三种:上下文选择符、ID和Class选择符、属性选择符

上下文选择符

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage