CSS的基本認(rèn)識

幾個認(rèn)識:

一般行內(nèi)元素是在同一行橫向排列的;;;塊級元素元素會占滿整個一行,總是換行,在頁面中豎向排列。【但是可以設(shè)置display,改變塊或行元素原來的屬性,display:inline(塊改成行),display:block(行改成塊)】

注意1:disPlay:inline-block,(此時是既具有行元素的橫向排列,又具有塊元素的可設(shè)置寬高等)

注意2:disPlay:none,(隱藏元素,一些設(shè)置的屬性也會隱藏)

常見的塊內(nèi)元素:<div> <p> <h1> <form> <ul> <li>和h5新增的一些標(biāo)簽(header、section、footer)等標(biāo)簽。

常見的行內(nèi)元素:<span> <a> <label> <input> <stong> <img>的是行內(nèi)標(biāo)簽。

CSS3特殊部分:新增display:flex ?或display:inline-flex 使元素為彈性盒子,是一個全新的布局方式,也分為塊級和行內(nèi)級,(塊級和行級)基本思想是一樣的。


盒子浮動:顧名思義,浮動就是可以是元素相互疊加,

屬性:float,默認(rèn)是none,如果設(shè)置left、right,元素就會向其父元素左側(cè)或右側(cè)靠近,一旦設(shè)置浮動,這個文檔就會是3D了,被設(shè)置的元素就不會當(dāng)做下一個元素布局的參照了,(相當(dāng)于被設(shè)置元素被他后面的元素拋棄了,但被設(shè)置元素之前的元素都是正常的,(相對于被設(shè)置元素也是正常的)),,,此時被設(shè)置元素的下一個元素可能會受到影響(被蓋住等等)如果不想受影響,此時可以設(shè)置下一個元素clear(清除浮動)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 13,814評論 1 92
  • 移動開發(fā)基本知識點 一.使用rem作為單位 html { font-size: 100px; } @media(m...
    橫沖直撞666閱讀 3,519評論 0 6
  • H5移動端知識點總結(jié) 閱讀目錄 移動開發(fā)基本知識點 calc基本用法 box-sizing的理解及使用 理解dis...
    Mx勇閱讀 4,630評論 0 26
  • 1.CSS基本概念 1.1 CSS的定義 CSS(Cascading Style Sheets)層疊樣式表,主要用...
    寥寥十一閱讀 1,880評論 0 6
  • 文康, 端午節(jié)回家了,和你面談了一下,發(fā)現(xiàn)了幾個問題,當(dāng)時和你談了一下,這里想以家書的方式再和你聊一聊。 你的問題...
    wenju_song閱讀 1,526評論 1 1