Heim  >  Artikel  >  Web-Frontend  >  1.DIV+CSS 的练习_html/css_WEB-ITnose

1.DIV+CSS 的练习_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:27:051035Durchsuche

   

       

瓜瓜   

 

 body    {/*     padding:0;     margin:0;     */    }   

 #head    {   

  /*     margin:0;     height:99px;         

 background-image:url("images/guagua_01.jpg");    

 background-repeat:no-repeat;     

background-position:center center; 距离左边的边距,距离上边的边距    

 */

    /*background:url("images/guagua_01.jpg") left bottom no-repeat;  另一种写法*/   

  /*background-color:#F00; Red

    float:left;     

*/   

 }        

div    

{    

 /*    

 border:1px solid #ccc;     width:50px;     height:50px;    

 */   

 }

   #container   

 {     

width:560px;     

padding:5px;   

  margin:0 auto;/* 居中 (很常用的功能),但要配合Html标签上面那两句声明使用,另外像

这种功能已经很少在用了 */   

  border:1px solid #ccc;    

}

       #left,#right    

{     width:100px;     height:100px;     border:1px solid #ccc;    }        

#left    {     float:left;     width:400px;    }   

 #right    {     float:right;    }        

.clear{clear:both;}    /* 因为浮动关系,要加上它,不然其他DIV会脱离Container这个DIV    所有网站都是这样解决的    */       

 

 

 

 

  

  左侧   

  

  

   
 

   

 

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn