前端css总结第二部分

前端css

前面介绍了前端的第三部分的前三节内容（文字样式，文本样式，背景样式），现在我们继续接下来的内容吧！
今天我们首先来介绍四：盒子模型哦。
盒子模型有四个部分组成：元素，内边距，外边距，边框。

• 元素：不言而喻，当然是，盒子里面所需要的内容；
• 内边距：padding——有四个部分，上内边距（padding-top）右内边距（padding-right） 下内边距（padding-bottom） 左内边距（padding-left） 一般网页浏览器都是按照web标准格式判定我也页面的布局，所以，综合写法属性一般都是顺时针来判定——padding：top right bottom left；（可以让块级盒子水平居中）padding：0 auto；
• 外边距：margin——同上
• 边框:border——（边框宽度，也可以上右下左的格式写）border-width （边框颜色，同上）border-color （边框样式）border-style——dasshed（虚线），solid（实线），dottded
  （点状）
  综合写法：border：border-width border-color border-style；

接下来，我们说另外一个重点啦！；五：浮动（float）

• 脱标的——目的：让多个块级元素在一行内显示。浮动，只有左浮动，右浮动。
  我们浮动的元素只能在一行显示，除非宽度不够，才会被挤下去。

• float——浮 -漂浮在标准流上面，就是脱标的； 漏-浮动的盒子不会占有空间； 特-浮动的盒子会改变display属性，如：“行内块”。

• 设置浮动——左浮动（float：left；） 右浮动（float：right；）
  4.清除浮动——（1）啥时候可以清除浮动：父级没有高度啦，子元素浮动，影响页面布局。总一句话说，就是 高度塌陷。
  （2）清除浮动的方法——

• 额外标签法（隔墙法）：通过在浮动元素末尾添加一个空的标签，

• 父级添加overflow属性的方法：可以给父级添加非visible的值，hidden或auto；

• 使用after伪类元素清除浮动：.clearfix:after{ content:""; display:block; clear:both; hight:0; visibility:hidden; } .clearfix{ zoom:1;}

• 使用双伪类元素清除浮动：.clearfix:before, .clearfix:after{ content:""; display:table; clear；both；} .clearfix{zoom:1; }

接来下是css第三部分最后的内容啦哦！六：定位（重点）

• 固定定位：position：fixed；
• 绝对定位：position：absoluted；脱离文档，会跑向窗口最左上角，通常子绝父相搭配使用。
• 相对定位：position：relative；不脱离文档，通常子绝父相搭配使用。
• 静态定位：position：static；
• z-index：通常获得定位之后会获得z-index，谁的优先级高，就优先显示。
  设置背景透明度 opacity，数值0-1；
  opacity：0； 完全透明
  opacity：0.5；完全半透明
  opacity：1； 完全不透明

opacity：0-1；
filter：alpha（opacity=透明度），透明度可设置1-100的数值，意义和0-1一样。

今日份的笨笨就分享到这里吧，希望和大家一起学习鸭，有什么不对的地方，还请大家指点评论噢。