HTML基础笔记之CSS盒子模型1(布局)


   
      HTML示例
      
   
    
      CSS的盒子模型,目前以div+CSS来布局。

(1)边框

  border:统一设置
  上border-top
  下border-bottom
  下border-left
  下border-right

(2)内边距

  距离上下左右四条边的距离叫内边距
(3)
	   
	   
	   
	   
	   
	   
AAAAAAAAAAAAAA
BBBBBBBBBBBBBB
CCCCCCCCCCCCCC

内边距

 
   
      HTML示例
      
   
    
       内边距

padding:20px;
使用padding统一设置
上下左右
padding-top....

AAAAAAAAAAAAAA
BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB
CCCCCCCCCCCCCC


外边距


 
   
      HTML示例
      
   
    
        外边距:

margin
统一设置和分别设置
上下左右
margin-top...
也可已使用margin统一设置
也可以分别设置
上下左右四个外边距



AAAAAAAAAAAAAA
BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB
CCCCCCCCCCCCCC






你可能感兴趣的:(HTML基础笔记之CSS盒子模型1(布局))