問(wèn)題一:塊級(jí)元素和行內(nèi)元素分別有哪些拄氯?動(dòng)手測(cè)試并列出4條以上的特性區(qū)別
- 塊級(jí)元素和行內(nèi)元素分別由哪些?
1它浅、塊級(jí)元素:div译柏;h1~h6;p姐霍;hrform鄙麦;ul;dl;ol黔衡;pre蚓聘;tableli;dd盟劫;dt夜牡;tr;td侣签;th
2塘装、行內(nèi)元素:em;strong影所;span蹦肴;a;br猴娩;img阴幌;button;iput卷中;label矛双;select;textareacode蟆豫;script
- 動(dòng)手測(cè)試并列出4條以上特性區(qū)別
1.塊級(jí)元素可以包含文本议忽,塊級(jí),行內(nèi)元素十减,而行內(nèi)元素只能包含文本和行內(nèi)元素栈幸;
2.塊級(jí)元素單獨(dú)占據(jù)一整行帮辟,行內(nèi)元素占據(jù)的位置只有自身文本寬度的空間速址;
3.塊級(jí)元素可以設(shè)置寬高壳繁,行內(nèi)元素設(shè)置寬高無(wú)效;
4.塊級(jí)元素的padding闹炉,margin值設(shè)置有效,行內(nèi)元素padding润樱,margin上下的值設(shè)置無(wú)效渣触,但左右有效;
問(wèn)題二:什么是 CSS 繼承? 哪些屬性能繼承壹若,哪些不能嗅钻?
- 什么是CSS繼承皂冰?
答:繼承就是子元素繼承了父元素的CSS樣式的屬性 - 什么屬性能繼承?
1.字體:family养篓,size秃流,weight,line-height
2.文本:letter-spacing柳弄,word-spacing舶胀,text-align, text-indent
3.列表:list-style-type
4.顏色:color,ps:a標(biāo)簽不能繼承父元素的字體顏色碧注,原因是a標(biāo)簽自己有默認(rèn)字體顏色嚣伐,會(huì)覆蓋掉- 繼承自父元素的字體顏色; - 什么屬性不能被繼承萍丐?
1.display
2.float
3.padding和margin
4.背景相關(guān)轩端,比如顏色圖片等
問(wèn)題三:用 CSS 實(shí)現(xiàn)一個(gè)三角形
問(wèn)題四:?jiǎn)涡形谋疽绯黾?code>...如何實(shí)現(xiàn)?
1、white-space:nomal;
:設(shè)置文本不換行逝变;
2基茵、overflow:hidden;
:設(shè)置文本溢出隱藏;
3骨田、text-overflow:ellipsis
: 設(shè)置溢出部分顯示為"...”
問(wèn)題五:px, em, rem 有什么區(qū)別耿导?
- px 像素的單位声怔,當(dāng)使用px來(lái)規(guī)定字體的大小時(shí)态贤,那么該字體的大小就是規(guī)定的大小,不會(huì)改變醋火。
- em 相對(duì)于父元素字體大小的倍數(shù)悠汽。
- rem 相對(duì)于根元素字體大小的倍數(shù)。
問(wèn)題六:解釋下面代碼的作用?為什么要加引號(hào)? 字體里的數(shù)字符號(hào)代表什么?
body{
font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
}
這段代碼的作用是:
- 代碼的作用:將
body
元素設(shè)置字體的大小是12px(Chrome瀏覽器最小字體為12px)芥驳,行高是字體大小的1.5倍柿冲,其中的字體待選為:tahoma字體,arial字體兆旬,Hiragino Sans GB字體假抄,'\5b8b\4f53',sans-serif字體這幾種丽猬,瀏覽器查找用戶的字體庫(kù)宿饱,如果有第一種就使用第一種,如果沒(méi)有查找第二種脚祟,以此類推谬以。 - 添加引號(hào)的原因:加引號(hào)是因?yàn)樽煮w的名字中包含空格,避免瀏覽器解析時(shí)候把它解析成多個(gè)詞匯由桌。
- 字體里的數(shù)字符號(hào)代表Unicode碼为黎,為了避免直接寫(xiě)中文的情況下編碼不匹配時(shí)會(huì)產(chǎn)生亂碼的情況邮丰,將字體名稱用Unicode來(lái)表示。'\5b8b\4f53'就代表宋體铭乾。