给所有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...
1.margin是什么？ margin用于控制元素周围空间的间隔，从视觉上达到空间间隔的目的。相对于前一个元素有相应的外边距。用于隔开元素与元素的。始终是透明的。 2.外边距的合并问题（参见w3school）---前提：元素出于文档流中 2.1 两个垂直外边距相遇时，在垂直方向上会发生外边距的叠加，最终的外边距等于二者的较大值； 2.2 当一个元素（没有边框和内边距）包含另外一个元素时，将在垂直方向上发生叠加； 2.3 当一个元素为空元素时...
转载自 http://www.cnblogs.com/zhuzhenwei918/p/6124263.html深入理解css中的margin属性 之前我一直认为margin属性是一个非常简单的属性，但是最近做项目时遇到了一些问题，才发现margin属性还是有一些“坑”的，下面我会介绍margin的基本知识以及那些“坑”。这篇博文主要分为以下几个部分：margin--基础知识margin--在同级元素（非父子关系）之间应用margin--在父元素和子元素之间应用（重点）margin--margin值的单位为%时的...
margin塌陷解决方法：1、给父级顶加上一条线，不太合适。2、bfcblock format context设定bfc后，特定的盒子会遵循另一套语法规则，解决了margin塌陷触发bfc元素1）position:absolute;2）display:inline-block;3）float:left/right;4）overflow:hidden; //溢出和隐藏 原文：https://www.cnblogs.com/xibuhaohao/p/10343128.html
塌陷问题 当两个盒子在垂直方向上设置margin值时，会出现一个有趣的塌陷现象。①垂直并列 首先设置两个DIV,并为其制定宽高 1 /*HTML部分*/2 <body>3 <div class="box1">box1</div>4 <div class="box2">box2</div>5 </body>6 /*CSS部分*/7 <style> 8 *{9 margin: 0;
10 padding: 0;
11 }
12 .box1{
13 width: 200px;
14 height: 200px;
15 backgrou...
原文 简书原文：https://www.jianshu.com/p/5f18f12cd162大纲 1、什么是外边距合并？(折叠外边距) 2、外边距带来的影响 3、折叠的结果 4、产生折叠的原因 5、出现的情况1、什么是外边距合并？(折叠外边距) 外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。而左右外边距不合并。 在CSS当中，相邻的两个盒子（可能是兄弟关...
前段时间我同事对于margin和padding应用百分比值似乎有些误解，觉得可能是个普遍问题，所以觉得有必要拿出来单独写一下。margin和padding都可以使用百分比值的，但有一点可能和通常的想法不同，就是margin-top | margin-bottom | padding-top | padding-bottom 的百分比值参照的不是容器的高度，而是宽度 。引用标准(2.1)原来的表达： The percentage is calculated with respect to the width of the generated box‘s containing...
Class与ID区别 margin和padding区别 CSS学习笔记_经验交流