一、margin与元素尺寸的关系元素尺寸： 可视尺寸-clientWidth(标准) 占据尺寸-outerWidth（在js中）【【margin对可视尺寸的影响】】适用于没有设定width/height的普通【block】水平元素只适用于改变水平方向的尺寸？？利用这一特性，可以实现？？ 一侧定宽度的自适应布局 /*图片左浮动，跟随文字实现自适应效果。给<P>元素添加margin-left，可视尺寸减小，实现自适应效果；如果希望右侧固定，左边文字环绕，则让图片右浮动，...
margin 与 padding 翻译分别为：margin: 边缘，极限；padding : 垫子，材料； 在CSS中，margin： 指从自身边框到另一个容器边框之间的距离，即容器外距离；padding: 指从自身边框到自身内部容器边框之间的距离，即容器内距离。 下面讲解 padding和margin常用的用法一、padding1、语法结构（1）padding-left:10px; 左内边距（2）padding-right:10px; 右内边距（3）padding-top:10px; 上内边距（4）padding-bottom:10px; 下...
清除浮动.clearfix:after{ content:”.”; display:block; height:0; clear:both; visibility:hidden; }清除margin溢出问题.overflow:before{content: ".";display: block;height: 0;visibility: hidden;} 原文：http://www.cnblogs.com/duanyue/p/7307878.html
原文：http://www.cnblogs.com/1111duguxiaoyu/p/6225266.html
之前在使用经常遇到下面的问题：html：1<div class="top">2<div class="one">I‘m the first!</div>3<div class="two">I‘m the second!</div>4</div>css： .one{width: 100px;height: 100px;background: red;margin-top:20px;}.two{width:100px;height:100px;background:blue;}.top{width:200px;height:300px;background:gray;} 显示结果：.one与.top之间并没有实现margin-top的效果，这个问题发生的原因是根据规范，一...
XAML中 Margin:左 上 右 下 CSS中 Margin:上 右 下 左原文：http://www.cnblogs.com/leavind/p/3718277.html
给所有div加上边框=10px之后，再给所有div设置margin-left与margin-top;以及浮动（float:left）因此时需要鼠标悬停效果：所以设置给div设置伪类:hover,然因浮动脱离了标准流。所以覆盖了div的边框,所以鼠标悬停时div边框显示不全设置定位（position:releative;）之后；经测验：在html中的层级关系为；标准流<浮动流<定位；所以现在鼠标悬停时div所有的边框都会显示，可以模仿淘宝案例等；<!DOCTYPE html> <html lang="en"> <head><...
一般在将div居中显示时，使用css： divX {margin:0 auto;} 此css在firefox下是好的，但是在ie下不起作用，网上看到原因如下： <div id="cnbruce">margin: 0 auto 看看内容居中否</div> 如上调试结果，IE6.0是不居中的，当然解决的办法可以是对网页主体“<body>”声明文本居中，即 复制代码代码如下:<style> body{text-align:center} #cnbruce{width:500px; background-color: #ccc; margin: 0 auto} </style> <div id="cnbruce">ma...
css007 margin padding border1、理解盒模型（盒模型：就是把一些东西，包括html各种标签都包含在一个看不见的盒子里） 1/在web浏览器中任何标签都是一个盒子，内容的周围环绕着装饰盒子的不同属性 Pad ding：内容和其框线之间的距离 Margin：一个标签和另一个标签之间的距离 Border：盒子周边的直线 Background-color：填充边框内部空间的间隔 2、用margin和padding控制空间 （margin控制盒子外部和其他元素...
如下代码：<div style=" width:1000px; height:700px; margin:auto;"><div style=" width:1000px; height:49px; margin-top:281px; "><span style="display:inline-block; width:121px; height:49px; margin-left:230px;"><a href="#"><img name="r2_c2" src="shc.png" width="121" height="49" border="0" id="btn1" alt=""/></a></span></div></div> 会发现，内层div的margin-top显示在了外层div上。 这个“问题”……它是...
<!DOCTYPEHTML PUBLIC"-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title></title> <metaname=""content=""> <style> *{ margin:0px; padding:0px; } #no1{ background:#808000; width:300px; height:300px; margin:100px 0 0 100px; } #no2{ background:#c0c0c0; width:150px; height:150px; margin-left:20px; margin-top:30px; } </style> </head> ...
在CSS中加了margin:0px auto;却没有效果，不能实现居中的问题！margin:0px auto;意思就是：上下边界为0，左右根据宽度自适应！就是水平居中的意思.无效的原因是，当你没有设置width时，解释器不知道你的宽度，当然就不会居中，就会到左边去，所以设置width就好了。原文：http://blog.csdn.net/liang5630/article/details/39030799
由于在页面的任何地方嵌套一个div，对原来的页面不会产生任何的影响，这就是父子重叠产生的原因 margin：auto 用来分配剩余空间的大小的，只有在默认的时候能够填充满才能进行分配，如下就不能垂直居中 原文：http://www.cnblogs.com/xiedashuaige/p/7801009.html
4参：上 右 下 左margin:10px 5px 15px 20px;3参：上 右 下margin:10px 5px 15px;2参：上下 左右margin:10px 5px;原文：https://www.cnblogs.com/sylys/p/12074654.html
1、运用css3的nth-child(3n):<!DOCTYPE html><html><head><meta charset="UTF-8"><title>demo</title><style>*{margin:0;padding:0}.box{width:620px;padding:10px;background:#bbb;border:1px solid #f00;margin:0 auto;}.box ul{overflow:hidden;}.box ul li{list-style:none;width:200px;height:100px;background:#fff;float:left;margin-right:10px;margin-bottom:10px;}.box ul li:nth-child(3n){margin-right:0;}</style></h...