Css基础

什么是CSS？
层叠样式表，专门是用来修饰HTML的元素的
CSS的组成主要是两部分：
选择器：就是主要用来查找要修饰的元素
声明:包含两部分：属性和属性值
选择器{
属性：属性值;
}
基本的选择器分为三种：
标签选择器
类选择器
ID选择器
正常来说，三种选择器的优先级是:
ID选择器>类选择器>标签选择器


css样式共有三种用法：
行内样式：直接在标签里加一个style属性，只能用来修饰这个标签
内部样式表:是在页面的head标签里加一个style标签，可以用来修饰整个页面
外部样式表：把CSS样式写在一个外部的扩展名为.css的文件里
在页面中通过两种方式可以引入外部的样式表：
1.链接式
<link href="css/css.css" rel="stylesheet" type="text/css" />
2.导入式
<style type="text/css">
@import url("css/css.css")
</style>
正常情况下：三种样式表的优先级
行内样式表>内部样式表>外部样式表
注意：内部样式表和外部样式表的优先级和引入顺序和选择器有关


选择器又包含一些复合选择器
后代选择器：以空格的方式隔开，修饰儿子，孙子。。
并集选择器：多种选择器之间用逗号隔开
子代选择器：以>隔开，只修饰儿子
相邻兄弟选择器：以加号隔开
属性选择器：把属性写在[]里，在指定元素中找指定属性的


超链接的伪类：
a:link
a:visited
a:hover
a:active
通常来讲样式写前两个即可
样式的顺序一定是:lvha


css的常用样式：
1.字体样式：以font开头的属性都是用来修饰字体的
2.文本样式：
3.背景样式：以background开头的属性都是用来修饰背景的
背景色
背景图
背景的重复
背景的偏移
4.列表样式:list-style
5.盒子模型：边框，外边距，内边距
外边距指盒子与盒子之间的距离
内边距：指盒子与内容之间的距离
这三个属性分别都有四个方向，top,right,bottom,left
6：浮动属性，float,就是可以把块级元素变成行级元素的的属性
7:清除浮动，clear,就是可以让新的块级元素重新按正常文档流走
8：定位：position,常用的有相对定位和绝对定位
相对定位relative:就是相对元素自己原来的位置来移动（占着茅坑不拉屎）
绝对定位absolute:就是相对于元素的有定位的父元素来移动，如果（不占坑，脱离正常文本流）
它所有的直接或者间接的父元素都没有定位，就会以浏览器为基准
一但有了定位，就可以设置上，下，左，右移动的方向
9：盒子的叠放层次
一但有了定位，可以用z-index属性来设置让哪个元素在上面
该属性值越大，那就越是处于最上方