慢慢說CSS第一天

玉兒Qi發表於2015-08-23

CSS是web前端的漂亮衣服~可以精細到畫素點的不同div塊兒(或者其他什麼的標籤比如說table啦ul啦)就是這衣服的(一針||一線||一塊布)。另外,如果你是一個完美主義者+強迫症,那麼恭喜你,CSS絕對夠你玩兒~

下面慢慢絮叨絮叨它~

先來八一八div~

<div id="myFirstDiv" class="first"></div>

以上這一行程式碼應該是前端戰鬥組的兄弟姐妹們熟悉熟悉爛熟於心的程式碼~配上了id和class的html標籤只是木有雕琢的璞玉,如果木有css來修飾的話...它們可能會在web頁面上呈現出各種奇形怪狀的樣子==!

用不同的選擇器來鎖定:id用#id,class用.class~也就是:#myFirstDiv{} & .first{},具體的內容寫到大括號裡面,bingo成功了!

div這個東西其實可淘氣了,熊孩子一樣非願意自己佔用一行(如果木有css管教),所以這時候,如果你想要將它們並排放,怎麼辦呢:方法一,float float float!float其實很萬能,只要一float它們就乖乖排成一行了;方法二:display:inline!於是它們被去掉換行符~乖乖排排坐了;方法三:position:absolute,想放哪裡放哪裡~

div還會偷偷藏起來它裡面的東西:預設的屬性是overflow:hidden...所以有時候就會出現,有個東西,明明有這個標籤,可是頁面上就是找不到???為什麼,因為熊孩子div給你藏起來了唄~解決方法是:overflow:scroll或者auto~哈,孺子可教也~

div還會自己偷偷長大,作為一個盒子它有margin和padding,即內邊距&外邊距,div需要的位置,可不僅僅是height和width的值那麼簡單~

。。。

既然是慢慢說,那今天就到這裡吧~作為一隻兔子,要去蹦躂一會兒了~~

相關文章