学了半个月说实话技术贴也不知道该写些什么，我就把自己有道云上的记录的笔记发下给大家参考下吧。
清除无序列表开头的特效：
        list-style:none;


text-align 文本水平对齐方式       
line-height 设置行间距
text-indent 设置首行文本缩进 属性：em(文字单位)
text-decoration 取消下划线   属性：none/underline


font-style 文字倾斜控制 属性：italic倾斜/normal不斜
font-size 文字大小         单位：px
font-family 设置文字字体  例：“微软雅黑”
font-weight 文字粗细   400/700
font-align 文字居中设置  left/center/right/
注：只盒子内容对齐

font（综合写法）：倾斜/加粗/文字大小/行高/字体

链接伪类选择器：
link 访问前
visited 已访问的链接
hover 鼠标经过
active 选定的链接

显示模式转换：
disply :block 转化为快元素
inline 转化为行内元素
inline-biock 转化为行内块元素

背景颜色：
background： color 背景颜色
image 插入图片（url）
repeat 平铺  X Y
position 背景定位 设置XY轴
attachment 背景固定  fixed
rgba 背景透明 （r,g,b,0.3）
只让背景透明
opacity 让背景和内容透明
opacity:0.3
size 背景缩放 取具体的值设置图片位置 background-size:100%（cover）将背景图等比放大铺满盒子 但是图片可能现实不全
background-size: contain
将背景图等比放大，接触盒子边缘停止缩放
背景简写 ：
  颜色 地址 平铺 固定 位置（X Y）


盒子模型：
border 边框：
border-width:1px 边框的宽度
-style:  边框的样式 solid实线 dashed虚线  dotted点线

-color：颜色
边框简写 border：边框 样式 颜色


padding内边距：设置上 右 下 左

    盒子实际大小 ：内容宽高+内边距+边框

   margin盒子外边距
    块级盒子水平居中 margin：0px(设置高度) auto


盒子圆角：
正圆：border-radius：50%(取盒子宽度半径的值）
矩形：border-radius：固定值(盒子半径以下值)

盒子阴影：
box-shadow：
水平阴影 垂直阴影 模糊距离 阴影大小 阴影颜色 内/外阴影；
例
box-shadow: 1px 1px 20px 1px green inset,2px 2px 20px orange

css布局三种：普通流布局（标准流）、浮动布局、 定位布局

浮动目的是为了让盒子在一行显示
浮动原理：让元素脱离文档流，进行页面效果布局
特性：
1、浮动以后的元素脱离标准流，原本的位置空了
2、下面的盒子就会补上来
3、加了浮动之后盒子显示模式默认相当于转换于inline-block     浮动元素之间默认是没有缝隙的和真正的行内块有差距的
4、如果父级盒子装不下，盒子会掉下来另起一行。

float :left/right; 浮动  

浮动元素与标准流的搭配

清除浮动：
为什么要清除浮动：因为父级盒子里面如果是标准流盒子会撑开父级盒子 如果是浮动盒子父级盒子如果没有高度就是脱标，影响布局，父级盒子就不会被撑开
解决方法：给父级盒子添加一个属性
overflow:hidden;  溢出隐藏，
隔墙法 chear:both  在最后一个盒子加一个标签填入这个属性
Cursor:pointer 让鼠标变成小手
声明清除浮动的样式：
.clearfix:after {content : "";
display ：block;
height :0;
visibiliti :heidden
clear:both;
}
.clearfix {
*zoom:1;          这个是专门需要给IE6和IE7加入的
}
给父级盒子加就可以解决了
双伪类清除浮动：
/*声明清除浮动的样式*/
.clearfix:before ,.clearfix:after {
       content: "";
       display: table;
}
.clearfix:after {
     clear:both;
}
.clearfix {
      *zoom: 1;  /*ie6,7 专门清除浮动的样式*/
}


定位：
position:
relative ：相对定位
（相对原来位置来移动，“原位还在”）
absolute： 绝对定位   子绝父相
如果父盒子没有用定位,子盒子从浏览器为准   如果子盒子找不到就会一层一层的往上找，最终以浏览器为标准“不保留位置”
fixed：固定定位 跟父级无关  完全脱离标准流

绝对定位和固定盒子设置居中
（不能用margin：auto居中）设置left：50% margin-left（本身宽度的一半）

堆叠顺序：z-index 没有单位 只有定位才可以用

过渡特效：
transition: all .2s;
然后设置鼠标经过往left像素。

学了半个月说实话技术贴也不知道该写些什么，我就把自己有道云上的记录的笔记发下给大家参考下吧。
清除无序列表开头的特效：
        list-style:none;


text-align 文本水平对齐方式       
line-height 设置行间距
text-indent 设置首行文本缩进 属性：em(文字单位)
text-decoration 取消下划线   属性：none/underline


font-style 文字倾斜控制 属性：italic倾斜/normal不斜
font-size 文字大小         单位：px
font-family 设置文字字体  例：“微软雅黑”
font-weight 文字粗细   400/700
font-align 文字居中设置  left/center/right/
注：只盒子内容对齐

font（综合写法）：倾斜/加粗/文字大小/行高/字体

链接伪类选择器：
link 访问前
visited 已访问的链接
hover 鼠标经过
active 选定的链接

显示模式转换：
disply :block 转化为快元素
inline 转化为行内元素
inline-biock 转化为行内块元素

背景颜色：
background： color 背景颜色
image 插入图片（url）
repeat 平铺  X Y
position 背景定位 设置XY轴
attachment 背景固定  fixed
rgba 背景透明 （r,g,b,0.3）
只让背景透明
opacity 让背景和内容透明
opacity:0.3
size 背景缩放 取具体的值设置图片位置 background-size:100%（cover）将背景图等比放大铺满盒子 但是图片可能现实不全
background-size: contain
将背景图等比放大，接触盒子边缘停止缩放
背景简写 ：
  颜色 地址 平铺 固定 位置（X Y）


盒子模型：
border 边框：
border-width:1px 边框的宽度
-style:  边框的样式 solid实线 dashed虚线  dotted点线

-color：颜色
边框简写 border：边框 样式 颜色


padding内边距：设置上 右 下 左

    盒子实际大小 ：内容宽高+内边距+边框

   margin盒子外边距
    块级盒子水平居中 margin：0px(设置高度) auto


盒子圆角：
正圆：border-radius：50%(取盒子宽度半径的值）
矩形：border-radius：固定值(盒子半径以下值)

盒子阴影：
box-shadow：
水平阴影 垂直阴影 模糊距离 阴影大小 阴影颜色 内/外阴影；
例
box-shadow: 1px 1px 20px 1px green inset,2px 2px 20px orange

css布局三种：普通流布局（标准流）、浮动布局、 定位布局

浮动目的是为了让盒子在一行显示
浮动原理：让元素脱离文档流，进行页面效果布局
特性：
1、浮动以后的元素脱离标准流，原本的位置空了
2、下面的盒子就会补上来
3、加了浮动之后盒子显示模式默认相当于转换于inline-block     浮动元素之间默认是没有缝隙的和真正的行内块有差距的
4、如果父级盒子装不下，盒子会掉下来另起一行。

float :left/right; 浮动  

浮动元素与标准流的搭配

清除浮动：
为什么要清除浮动：因为父级盒子里面如果是标准流盒子会撑开父级盒子 如果是浮动盒子父级盒子如果没有高度就是脱标，影响布局，父级盒子就不会被撑开
解决方法：给父级盒子添加一个属性
overflow:hidden;  溢出隐藏，
隔墙法 chear:both  在最后一个盒子加一个标签填入这个属性
Cursor:pointer 让鼠标变成小手
声明清除浮动的样式：
.clearfix:after {content : "";
display ：block;
height :0;
visibiliti :heidden
clear:both;
}
.clearfix {
*zoom:1;          这个是专门需要给IE6和IE7加入的
}
给父级盒子加就可以解决了
双伪类清除浮动：
/*声明清除浮动的样式*/
.clearfix:before ,.clearfix:after {
       content: "";
       display: table;
}
.clearfix:after {
     clear:both;
}
.clearfix {
      *zoom: 1;  /*ie6,7 专门清除浮动的样式*/
}


定位：
position:
relative ：相对定位
（相对原来位置来移动，“原位还在”）
absolute： 绝对定位   子绝父相
如果父盒子没有用定位,子盒子从浏览器为准   如果子盒子找不到就会一层一层的往上找，最终以浏览器为标准“不保留位置”
fixed：固定定位 跟父级无关  完全脱离标准流

绝对定位和固定盒子设置居中
（不能用margin：auto居中）设置left：50% margin-left（本身宽度的一半）

堆叠顺序：z-index 没有单位 只有定位才可以用

过渡特效：
transition: all .2s;
然后设置鼠标经过往left像素。