前端——CSS
2018-11-19 本文已影响0人
浮_屠
CSS
- CSS可以用来为网页创建样式表,通过样式表可以对网页进行装饰
基本语法
- 语法:
—选择器{样式名:样式值;样式名:样式值;}
— p {color:red;font-size:12px}
三种样式
行内样式
直接将样式写在标签内部中的style属性中,不用填写选择器,直接声明
image.png
—— 不推荐使用
内部样式
<style>
p{color:red;font-size:12px;}
</style>
直接写在style标签中,让其独立于HTML代码,同事可以设置多个元素样式
—— 只能在一个页面中使用,不能多个页面中重复使用
外部样式
<link rel="stylesheet" type="test/css" href="style.css">
将样式保存在一个外部的css文件中通过<link>标签调用
—— 使用最多的方式
选择器
元素选择器
根据标签名来进行选择,会选择所有的该标签名相同的
语法:标签名{}
类选择器
根据标签中的class 来进行选择,其中class可以自己创建
语法:.className{}
ID选择器
根据元素中的id属性来选取元素,ID可以自己创建
语法:**#idName{}
复合选择器
可以同时使用多个选择器,可选择同时满足多个选择器的元素
语法:**选择器1选择器2{}
群组选择器
可以同时使用多个选择器,多个选择器同时使用指定的样式
语法:选择器1,选择器2,选择器3{}
通配选择器
可以选择当前页面中的所有的元素
语法:*{}
后代选择器
根据标签的关系来选择代元素的设置样式
语法:祖先元素 后代元素 后代元素{}
属性选择器
image.png子元素选择器
image.png兄弟选择器
image.png否定伪类
image.png继承类
祖先元素的样式是可以被子类元素继承的,具体就是应用在一个标签上的那些CSS样式会应用到其内嵌标签上的