本節簡介: 本節課主要詳細介紹塊級、行級、行塊級三種區塊的應用以及轉換方法。
本節課同學們做的筆記 點擊播放按鈕可自動定位到對應時間進行播放
行級塊元素:1.標簽:image input;2.特性:共同顯示在一行,默認的寬度等于子集元素的寬度,能夠任意定義寬高;3.通過【display:inline-block】轉為行級塊元素。
塊級元素:1.代表標簽:div h1-h6 ul ol li dl dt dd p;2.特性:能夠獨立顯示一行,默認的寬度等于父級寬度,能夠任意定義寬高;3.任何元素都可以通過【display:block】轉為塊元素。行級元素:1.標簽:span a strong b em i font;2.特性:共同顯示在一行,默認的寬度等于子集元素的寬度,不能定義寬高;3.通過【display:inline】轉為行級元素;
如文字區域設置寬高,超出部分,overflow-x (y)( 溢出 ):hidden scroll(卷紙)滾動條 auto自動(在沒超出時不加,超出后自動加滾動條
display,none時,會消失掉9(位置也會消失) visibilty可見性hidden隱藏(位置不會消失)
行塊元素imgage input等,共同顯示在一行,也能定義寬高,轉換為行塊元素:display:inline-block
行級元素span a strong b em i ont,共同顯示在一行,不可定義寬高,用display:block,轉換成塊級元素
塊級元素:div h1-h6 ol li di dt dd等,能獨立顯示一行,可定義寬高,轉行級元素用display;line轉化行級元素
行級元素轉塊級元素:添加{display:block}
如果內容超過框架overflow-x(y):hidden影藏內容 scroll加滾動條 auto自動加滾動條 opacity:0-1設置透明度
display:none 原來的位置和內容影藏消失 visibility:hidden 影藏內容但位置還在
display 在屬性里,文字上下居中,在文本屬性里設置行高,行高為字中心到邊距的距離
快級標簽:div h1-h6 ul ol li dl dt dd p 轉換:display:block 行級元素:span a shrong b em i font 轉換:displayinline 行級塊元素:image input 轉換:display:inline-block
display: none 設置元素為隱藏,并且原有的位置消失;visibility:hidden 設置元素為隱藏,但是原有的位置還在;visibility:visity 設置元素為可見;
overflow-y:auto 將垂直方向上溢出的內容設置為根據區塊顯示滾動條