Heim  >  Artikel  >  Web-Frontend  >  Css盒子模型的应用_html/css_WEB-ITnose

Css盒子模型的应用_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-21 08:48:511515Durchsuche

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>盒子模型的应用</title>    <link href="index.css" type="text/css" rel="stylesheet"></head><body>    <div class="top">        <div class="top_content"></div>    </div>    <div class="body">        <div class="body_img"></div>        <div class="body_content">            <div class="body_no"></div>        </div>    </div>    <div class="footing">        <div class="footing_content"></div>        <div class="footing_subSav"></div>    </div></body></html>


*{    margin: 0px;    padding: 0px;}.top{    width: 100%;    height: 50px;    background-color: black;}.top_content{    width: 75%;    height: 50px;    margin: 0px auto;    background-color: blue;}.body{    margin: 20px auto;    width: 75%;    height: 1500px;    background-color: blanchedalmond;}.body_img{    width:100%;    height: 400px;    background-color: darkorange;}.body_content{    width: 100%;    height: 1100px;    background-color: blueviolet;}.body_no{    width: 100%;    height: 50px;    background-color: aqua;}.footing{    width: 75%;    height: 400px;    background-color: indigo;    margin: 0px auto;}.footing_content{    width: 100%;    height: 300px;    background-color: darkseagreen;}.footing_subSav{    width: 100%;    height: 100px;    background-color: black;}


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