問答
1. 塊級元素和行內(nèi)元素分別有哪些遗嗽?動(dòng)手測試并列出4條以上的特性區(qū)別
- 塊級元素包括:div h1 h2 h3 h4 h5 h6 p hr form ul dl ol pre table li dd dt tr td th
- 行內(nèi)元素包括:em strong span a br img button input label select textarea code script
- 塊級元素可以設(shè)置width和height屬性盟榴,行內(nèi)元素不能設(shè)置寬高
- 塊級元素寬度默認(rèn)占整行,而行內(nèi)元素寬度自適應(yīng)大小
- 塊級元素可以包含塊級元素和行內(nèi)元素,而行內(nèi)元素只能包含文本和行內(nèi)元素
- 行內(nèi)元素設(shè)置上下外邊距會失效,設(shè)置上下內(nèi)邊距有效但不占高度
2. 什么是 CSS 繼承? 哪些屬性能繼承,哪些不能?
- CSS繼承:父元素設(shè)置的屬性星瘾,自動(dòng)繼承到子孫元素
- 不可繼承的:display、margin乖酬、border死相、padding、background咬像、height算撮、min-height、max-height县昂、width肮柜、min-width、max-width倒彰、overflow审洞、position、left、right芒澜、top仰剿、bottom、z-index痴晦、float南吮、clear、table-layout誊酌、vertical-align部凑、page-break-after、page-bread-before和unicode-bidi碧浊。
- 所有元素可繼承:visibility和cursor涂邀。
- 內(nèi)聯(lián)元素可繼承:letter-spacing、word-spacing箱锐、white-space比勉、line-height、color瑞躺、font敷搪、font-family、font-size幢哨、font-style、font-variant嫂便、font-weight捞镰、text-decoration、text-transform毙替、direction岸售。
- 終端塊狀元素可繼承:text-indent和text-align。
- 列表元素可繼承:list-style厂画、list-style-type凸丸、list-style-position、list-style-image袱院。
3. 如何讓塊級元素水平居中屎慢?如何讓行內(nèi)元素水平居中?
- 設(shè)置左右外邊距的值為auto;
- 設(shè)置text-align:center;
4. 用 CSS 實(shí)現(xiàn)一個(gè)三角形
#triangle{
width:0;
height:0;
border-left:20px solid transparent;
border-right:20px solid transparent;
border-bottom:20px solid blue;
}
5. 單行文本溢出加 ...如何實(shí)現(xiàn)?
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
6. px, em, rem 有什么區(qū)別
- px:固定尺寸
- em:相對于父元素的尺寸倍數(shù)
- rem:相對于根元素(body)的尺寸倍數(shù)
7. 解釋下面代碼的作用?為什么要加引號? 字體里\5b8b\4f53代表什么?
body{
font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
}
表示字體規(guī)格為:
- 字體大小為12px
- 字體行高為1.5倍字體大小
- 字體可在tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif 這些字體中選擇(若都不存在,則為瀏覽器默認(rèn)字體)
- 當(dāng)有空格或者Unicode碼時(shí)忽洛,需要加引號
- \5b8b\4f53是字體的Unicode碼腻惠,表示黑體