02-CSS基础与进阶-day7_2018-09-07-20-15-37

最新推荐文章于 2019-06-22 12:13:00 发布

weixin_34301307

最新推荐文章于 2019-06-22 12:13:00 发布

阅读量142

点赞数

原文链接：http://www.cnblogs.com/HiJackykun/p/11061826.html

版权

　　盒子模型布局稳定性
1 什么时候用内边距什么时候用外边距
绝大多数情况下可以混用，想用什么就用什么，但是总有一个
最好用的，建议
优先使用width > padding > margin
浮动(float)
1 标准流（文档流普通流）
一个网页的标签元素正常是从上往下，从左到右排列，块级元素独占一行，行内元素按照顺序依次前后排列
三种布局标准流浮动定位
2 什么是浮动
元素设置了浮动属性会脱离标准流的控制(脱标)
float:left
float: right
float: none
3 浮动特性
* 脱离标准流不占位置会影响标准流
* 子盒子浮动不会压住父盒子的padding和margin
* 浮动元素改变元素的模式,无论行内元素还是块级元素设置浮动后都具有行内块元素特性

01盒子模型稳定性.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
       div {
        
       }

       p {
             /* margin-left: 200px;  */
             padding-left: 200px;
       }
    </style>
</head>
<body>
    <div><p>文字</p></div>
    <div>第二个div</div>
</body>
</html>