CSS中使用margin属性定义网页边距

开发 前端
你知道在CSS中如何使用margin属性定义网页边距吗,这里和大家简单分享一下,当他们要分别定义网页的顶、右、底、左时用法有2种。

本文和大家重点讨论一下CSS中如何使用margin属性定义网页边距,margin属性包括margin-top,margin-right,margin-bottom,margin-left等。

CSS中margin属性定义网页边距

margin属性包括margin-top,margin-right,margin-bottom,margin-left,margin。

◆当他们要分别定义网页的顶、右、底、左时用法有2种,他们分别为:

margin:top-valueright-valuebottom-valueleft-value;(顺序是固定的上右下左,顺时针。) 

  1. margin-top:value;  
  2. margin-right:value;  
  3. margin-bottom:value;  
  4. margin-left:value;  
  5.  

◆当他们定义的网页顶、右、底、左边距是等同时,用这种方法:

margin:value;

例如:margin:10px20px20px40px;这个说明网页的上右下左边距分别为10、20、20、40.

或者也可以写成这样:

  1. margin-top:10px;  
  2. margin-right:20px;  
  3. margin-bottom:20px;  
  4. margin-left:40px;  
  5.  

效果是一样的。

一般常用举例:

  1. <styletypestyletype="text/CSS"> 
  2. <!--  
  3. #header{  
  4. height:120px;  
  5. width:960px;  
  6. background-image:url(headPic.gif);  
  7. background-repeat:no-repeat;  
  8. margin:0px0px5px0px;  
  9. }  
  10. --> 
  11. </style> 
  12. <dividdivid="header"></div><!--网站的头部--> 
  13. <dividdivid="nav"></div><!--网站的导航--> 
  14. <dividdivid="content"></div><!--网站内容--> 
  15. <dividdivid="footer"></div><!--网站底部--> 

上面的代码就是我们经常用到的div+css做的网站让他的头部和导航之间有5px的高度。
 

【编辑推荐】

  1. margin-top属性的语法和特征
  2. IE6.0对padding的解读分析
  3. CSS margin 属性定义和用法
  4. CSS中margin-top和margin-bottom属性使用说明
  5. 技术分享 如何使用CSS控制超链接文字样式

 

 

责任编辑:佚名 来源: blue1000.com
相关推荐

2010-09-08 09:11:32

CSSmargin

2010-08-23 08:53:04

CSSmargin外边距

2010-09-06 11:02:59

CSSmargin

2010-08-25 09:25:13

CSSmargin

2010-08-30 12:54:59

CSSmargin

2010-08-26 09:33:46

CSSmargin-bott

2010-09-08 14:00:08

marginCSS

2010-08-25 11:23:31

IE6margin

2010-08-25 09:30:56

marginCSS

2010-08-25 10:21:49

CSSmargin

2010-08-26 10:08:50

CSSmargin

2010-08-27 09:02:22

IE6margin双倍

2010-08-25 10:53:04

CSSmargin-bott

2010-08-25 09:48:25

CSSmargin

2010-09-03 10:31:31

CSSmargin

2010-08-24 13:14:36

CSSmargin

2010-08-31 08:51:58

marginCSS

2010-08-19 11:03:56

CSSpadding

2010-08-25 11:13:49

CSS margin-righ

2010-09-03 10:43:05

CSSmargin
点赞
收藏

51CTO技术栈公众号