margin-left 属性(CSS控制元素的左外边距)-IT技术网站

margin-left属性

1.CSS边距属性定义元素周围的空间。通过使用单独的属性，可以对上、右、下、左外边距进行设置。也可以使用简写的外边距属性同时改变所有的外边距。–W3School边界，元素周围生成额外的空白区。“空白区”通常是指其他元素不能出现且父元素青景可见的区域。
2.margin始终是透明的。margin通过使用单独的属性，可以对上、右、.下、左的外边距进行设置。即:margin-top、margin-right、margin-bottom、margin-left.外边距的margin-width的值类型有:autoIlength|percentage。也可以使用简写的外边距属性同时改变所有的外边距:margin:toprightbottomleft;(eg:margin:1opx20px3opx40px)记忆方式是元素周围正上方顺时针“上右下左”记忆。
3.实际工作中，垂直外边距合并问题常见于第一个子元素的margin-top会顶开父元素与父元素相邻元素的间距，而且只在标准浏览器下(FirfFox、Chrome、Opera、Sarfi)产生问题，IE下反而表现良好。例子可以查看下面代码(IE下表现“正常”，标准浏览器下查看出现“bug”):20px3opx40px)记忆方式是元素周围正上方顺时针“上右下左”记忆。

CSS控制元素的左外边距

css中margin属性即css外边距属性的具体用法代码示例：
<!DOCTYPEhtml>
<html>
<head>
<metacharset=”utf-8″>
<title>css中的margin属性使用示例</title>
<style>
.demo{
width:300px;height:100px;
background-color:#ccccff;
}
.demo1{
margin-left:50px;
margin-top:50px;
margin-bottom:50px;
width:300px;height:100px;
background-color:#b2ecef;
}
.demo2{
width:300px;height:100px;
background-color:#94ef9a;
}
.demo1p{margin-left:50px;
}
</style>
</head>
<body>
<divclass=”demo”>
<p>没有给这个div块设置margin值</p>
</div>
<divclass=”demo1″>
<p>给这个div块设置了margin值,并且给此段文字也设置margin值</p>
</div>
<divclass=”demo2″>
<p>没有给这个div块设置margin值</p>
</div>
</body>
</html>
?