div、盒子

HTML的div佈局在body中:

<body>
    <div id="container" style ="width:950px;">
        <div id="heading"style="width :400px;color :aqua; background :url(one.jpg)">
        <h1><b><i>第一節標題</i></b></h1>   
        </div>
        <div id="ending"style="width:300px;color:blue;background :url(one.jpg)">
           <h2>第二級標題~</h2>
        </div>
    </div>
</body>

盒子的佈局:盒子是css,所以注重的是style,在head中。<style type="text/css">。
body{}裏面的設定是全局的。也可以用{}在style中設定h1\h2\p的一些屬性。(比如 color、font-family字體、line-height行間距…)
盒子包括的元素是:
1\ margin(含有 top\left\right\bottom)
2\ border(width\color\style…)
3\padding(top\left\right\bottom)
4\content

可以改變元素的值來是盒子的位置發生改變。
float可以使div class 按照要求排列整齊。float:left/right。

body 
    {
      
        font-family:Verdana ;
        line-height :1.6em;
        margin:0px;
    }
 h1{
        color:darkred;
    }
 .vs {
    width:30%;
    height:500px;
    border-width :1px;
    border-color:aqua;
    border-style :dotted;
    padding :5px;
    margin:0px;
    float :left;
    }
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章