css 知识汇总与补充（一）

css : cascading style sheet 层叠样式表

一、引入css 

1.行间样式   

<div style="width: 100px;height: 100px;background-color: green;"></div>

2.页面级css

<style type="text/css">
	div{
		width: 100px;
		height: 100px;
		background-color: red;
	}
</style>

3.外部css文件

<link rel="stylesheet" type="text/css" href="1.css">

二、正确认识域名和地址

www.baidu.com  域名 ---   dns解析 --- 192.168.000.001  地址

异步加载：多进程同时进行（一个线程下载html，一个线程下载css）

异步：同时进行（与现实生活相反）

三、选择器

1.class 可以公用（多个标签同一个class） 

 id  一对一

标签选择器：span

通配符选择器： *

2.各类选择器的优先级比较：

!important > 行间样式 > id > class | 属性选择器[] > 标签选择器 > 通配符

3.权重（以256进制计算）

!important       	 Infinity
行间样式         	 1000  256进制
id               	 100
class|属性|伪类  	 10
标签|伪元素      	 1
通配符           	 0

4.

	父子选择器/派生选择器（不是必须用标签选择器） div span{ }

	直接子元素选择器  div > em{}

	section 与 div 效果相同

	并列选择器 div.demo{}

	分组选择器 div,span,em{}

5.字体颜色

1>土鳖式（纯英文单词）

2>颜色代码

r:red    g:green   b:blue  

00-ff 

#000000 黑

transparent 透明色

3>颜色函数 rgb(0-255,0-255,0-255)

四、快速画出一个三角形

div{/*三角形*/
	width:0px;
	height: 0px;
	border:100px solid black;
	border-left-color: transparent;/*透明色*/
	border-right-color:  transparent;
	border-bottom-color:  pink;
	border-top-color:  transparent;
}

通过更改颜色变换为