CSS
HTML 的块标签:
div 标签: 默认占一行，自动换行
span 标签: 内容显示在同一行
CSS概述:
Cascading Style Sheets : 层叠样式表
红砖, 抹了一层水泥, 白灰
主要用作用:
用来美化我们的HTML页面的
HTML 决定网页的骨架 ,CSS 化妆
将页面的HTML和美化进行分离
div ，division ，分隔，区域
CSS 的简单语法: 在一个 style 标签中 , 去编写 CSS 内容 , 最好将 style 标签写在这个 head 标签中.
<style>
选择器{
属性名称:属性的值;
属性名称2: 属性的值2;
}
</style>
元素选择:
元素的名称{
属性名称:属性的值;
属性名称:属性的值;
}
ID选择器:
以#号开头 ID 在整个页面中必须是唯一的s
#ID的名称{
属性名称:属性的值;
属性名称:属性的值;
}
类选择器:
以 . 开头
.类的名称{
属性名称:属性的值;
属性名称:属性的值;
}
CSS 的引入方式:
外部样式 : 通过 link 标签引入一个外部的 css 文件
内部样式: 直接在style标签内编写 CSS 代码
行内样式: 直接在标签中添加一个style属性, 编写CSS样式
CSS 浮动 : 浮动的元素会脱离正常的文档流,在正常的文档流中不占空间，
下面的元素会占用上面浮动元素的空间，设置了浮动属性的元素会脱离标
准文档流的控制，移动到其父元素中指定位置的过程，
float属性:
left
right
clear属性: 清除浮动
both : 两边都不允许浮动，同时清除两边的浮动
left: 左边不允许浮动
right : 右边不允许浮动
overflow : hidden ，清除子元素浮动对父元素的影响。
流式布局
CSS的优先级 :
标记选择器权重1，类选择器权重10，id 选择器权重100，
按照选择器搜索精确度来编写: 行内样式 > ID选择器 > 类选择器 > 元素选择器
就近原则: 哪个离得近,就选用哪个的样式 。
CSS中的其它选择器
选择器分组 : 选择器1 , 选择器2 { 属性的名称 : 属性的值 }
属性选择器:
a[title]
a[titile='aaa']
a[href][title]
a[href][title='aaa']
后代选择器: 爷爷选择器 孙子选择器 找出所有的后代
子元素选择器: 父选择器 > 儿子选择器
伪类选择器: 通常都是用在 A 标签上 ，超链接
CSS的盒子模型: 万物皆盒子 顺时针 : 上右下左
内边距: Pandding
padding-top:
padding-right:
padding-bottom:
padding-left:
padding:10px; 上下左右都是10px
padding:10px 20px; 上下是10px 左右是20px
padding: 10px 20px 30px; 上 10px 右20px 下30px 左20px
padding: 10px 20px 30px 40px; 上右下左, 顺时针的方向
外边距: Margin
margin-top:
margin-right:
margin-bottom:
margin-left:
CSS 绝对定位: 依据最近已经定位的父元素进行定位，若果所有父元素都没有定位，则根据 body 根元素定位。
position: absolute
top: 控制距离顶部的位置
left: 控制距离左边的位置