标签设置长宽
只有快级标签才能设置长宽
行内标签设置了没有任何作用
字体颜色 color后面可以跟很多种颜色数据
颜色英文形式 red
06a0de 直接用pycharm提供的吸管工具取色
rgb（1,1,1） 可以利用截图软件获取三基色数字
rgba（128,128,128,0.3） 最后一个数字 只能用来调节颜色的透明度
取消a标签默认的下划线
a {
text-decoration:none;
}
背景图片 默认是铺满整个区域
通常一个页面上的一个个小的图标 并不是单独的
是一张大的图片 该图片上有网址所用的所有的小图标
通过控制背景图片的位置 来显示不同的图标样式
边框
border 后面写三个参数 位置 没有关系
颜色
字体
样式
可以单独设置 样式 颜色 粗细
border-top-style：dotted
border-top-color：red
border-right-style ：solid
border-bottom-style：dotted
border-left-style ：none
可以设置某一边的样式
/*border-top: 3px solid red;*/
/*border-left: 1px dotted green;*/
/*border-right: 5px dashed blue;*/
/*!*border-bottom: 10px solid pink;*!*/
也可以简写统一设置
border: solid 10px red;
display
inline 将块级标签变成行内标签
block 能将行内标签 设置成长宽和独占一行
inline-block 既可以设置长宽 也可以设置一行展示
display：none 隐藏标签 并且标签原来占的位置也没了
visibility：hidden 隐藏标签 但是标签原来的位置还在
盒子模型
谷歌浏览器body默认有8px外边框
body {
margin:0px;
}
以快递盒子为例
两个快递盒子之间的距离（标签与标签之间的距离） 外边距（margin）
快递盒子的厚度（边框） 边框border
物品之间的距离 （内部文本与内边框之间的距离） 内边框（padding）
物品的大小 （文本的大小） 内容（content）
margin: 10px 20px 30px 40px; /*上 右 下 左*/
padding简写规律跟margin一样
#d1 {
margin: 0 auto;
}
只能左右居中 不能上下居中
浮动
float 在css中 ，任何元素都可以浮动
浮动的元素 是脱离正常文档流的（原来的位置会让出来）
浏览器会优先展示文本的内容
浮动带来的影响
会造成父标签塌陷（类似于口袋瘪了）
如何解决父标签坍塌问题？
.clearfix:after{
content：‘’；
clear：both；/左右两边都不能有浮动的元素
display：block；
}
哪个父标签坍塌就给谁加clearfix这个类的属性值
overflow溢出属性
overflow:hidden；溢出的直接隐藏
overflow：auto 可以滚动
定位
所有的标签默认都是静态的 无法改变位置
position：static
必须将静态的状态修改成定位之后
相对定位，relative
相对于标签原来的位置移动
绝对定位（小米的购物出）absolute
相对于已经定位过（只要不是static都可以relative）的父标签 再做定位
固定定位（回到顶部）fixed
相对于浏览器 固定在某个位置不动
位置是否脱离文档流
不脱离文档流
相对定位
脱离文档流
浮动的元素
绝对定位
固定定位