CSS学习笔记 第一天
css是 cascading style sheet的缩写 ，译为层叠样式表。
1、CSS引入方式
(1) 行间样式
行间样式方式是在标签的开始部分以加属性的方式加上css样式，具体添加凡是如下：
<div style="
width:100px;
height:100px;
background-color:red;
">
</div>
(2)页面级样式
页面级样式是在html文件中的head标签中加入形如下面style标签的代码：
<style type="text/css">
div{
width:100px;
height:100px;
background-color:red;
}
</style>
(3)外部引用样式
创建一个index.css文件，在文件中写出样式的值，例如一下为css文件中的内容：
div{
width:100px;
height:100px;
border-radius:50%;
background-color:black;
}
然后在html文件中引入，引入的方式为，在html文件的head标签内，添加link标签，里面的链接属性href指向css文件，例如：
<head>
<link rel="stylesheet" type="text/css" href="index.css"
</head>
此时css的内容就会影响到html中。
2、html和css文件的下载是异步的同时的。
在下载html执行到link css文件时，会单独开一个线程去下载css文件，原线程继续下载html。
3、选择器
css如何选择html的元素
(1)id选择器
在html的标签中添加属性id
<div id="only">123
</div>
在css文件中选择此id
#only{
background-color:red;
}
这样css中的样式就可以通过id影响到html中属性id的值为only的元素了。
id选择器是一对一的。
(2)class选择器
在html的标签中添加属性class
<div class="demo">123
</div>
在css文件中选择此class
.demo{
background-color:red;
}
class选择器与元素的关系是多对多的，多个元素可以使用一个class，一个元素也可以有多个class class多个的写法是class="aaa bbb"空格分隔是两个class值。
(3)标签选择器
直接在css文件中写形如下面的形式的代码：
div{
background-color:black;
}
这样包含此css文件的html文件中的所有div标签都被影响，嵌套关系不会影响标签选择器的效果。
(4)通配符选择器
在css文件中写形如下面的代码：
*{
background-color:green;
}
通配符的意思是选择引入此css文件的所有标签都被此选择器影响。
(5)属性选择器
css文件中写如下形式代码：
[id或id="aaa"]{
background-color:red;
}
这种形式表示具备此种属性的标签被影响。
4、权重
权重的大小：
!important > 行间样式 > id > class = 属性选择器 > 标签选择器 > 通配符
权重的值：用来计算权重
!important infinity
行间样式 1000
id 100
class|属性|伪类 10
标签|伪元素 1
通配符 0
这里的值是256进制
796
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
