前端——CSS

2018-11-19  本文已影响0人  浮_屠

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样式会应用到其内嵌标签上的

权重

image.png
上一篇下一篇

猜你喜欢

热点阅读