css內邊距 邊框

標籤：種類   矩形   對象   ott   建立   png   寬度   包含   等價   

/*1 元素的各邊都有 10 像素的內邊距  四個值上、右、下、左   兩個上下，左右   三個值：上，左右，下*//*p {padding: 10%;}*/h1 {  padding-top: 10px;  padding-right: 0.25em;  padding-bottom: 2ex;  padding-left: 20%;  }/*下面這條規則把段落的內邊距設定為父元素 width 的 10%：*/  p {padding: 10px 50px 100px 20px; background: red}

 內邊框：

border-style:

• border-top-style
• border-right-style
• border-bottom-style
• border-left-style

 

等價：

p {border-style: solid solid solid none;}p {border-style: solid; border-left-style: none;}

 

 border-color: blue red;

 

border-top-width

border-width: 15px 5px 15px 5px;

 

綜合：寬度，樣式，顏色

border: medium double rgb(250,0,255)

 

 

外邊框：

margin: top right bottom left

 

 

定位：

static元素框正常產生。區塊層級元素產生一個矩形框，作為文檔流的一部分，行內元素則會建立一個或多個行框，置於其父元素中。

relative 相對定位：元素框位移某個距離。元素仍保持其未定位前的形狀，它原本所佔的空間仍保留。

absolute 絕對位置：元素框從文檔流完全刪除，並相對於其包含塊定位。包含塊可能是文檔中的另一個元素或者是初始包含塊。元素原先在正常文檔流中所佔的空間會關閉，就好像元素原來不存在一樣。元素定位後產生一個塊級框，而不論原來它在正常流中產生何種類型的框。

fixed 固定定位：元素框的表現類似於將 position 設定為 absolute，不過其包含塊是視窗本身。

 

}
/*fixed對象脫離正常文檔流，使用top，right，bottom，left等屬性以視窗為參考點進行定位，當出現捲軸時，對象不會隨著滾動。而其層疊通過z-index屬性定義。*/

/*對象脫離正常文檔流 絕對位置，使用top，right，bottom，left等屬性進行絕對位置。而其層疊通過z-index屬性定義。*/

 /*relative：對象遵循正常文檔流，但將依據top，right，bottom，left等屬性在正常文檔流中位移位置。而其層疊通過z-index屬性定義。*/

 

css內邊距 邊框