> 웹 프론트엔드 > HTML 튜토리얼 > 一.CSS工作原理_html/css_WEB-ITnose

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

WBOY
풀어 주다: 2016-06-24 12:00:35
원래의
1103명이 탐색했습니다.

 

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

CSS规则

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

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

p{background-color: green}
로그인 후 복사

CSS基本规则

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

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

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

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

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

p{color: green;font-size: 45px;font-weight: bold}
로그인 후 복사

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

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

h1,h3,p{color: green;font-size: 45px;font-weight: bold}
로그인 후 복사
로그인 후 복사

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

h1,h3,p{color: green;font-size: 45px;font-weight: bold}
로그인 후 복사
로그인 후 복사

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

p{background-color: blue}
로그인 후 복사

CSS选择符分类

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

上下文选择符

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿