塊級(jí)元素和行內(nèi)元素分別有哪些誓琼？動(dòng)手測(cè)試并列出4條以上的特性區(qū)別。
常見的塊級(jí)元素和行內(nèi)元素：
- 塊級(jí)元素：h/p/div/hr/form/ui/ol/li/dl/dt/dd/pre/table/tr/td/th
- 行內(nèi)元素：em/strong/span/a/br/img/buttom/input/label/select/textarea/code/script
塊級(jí)元素和行內(nèi)元素的特性：
- 塊級(jí)元素會(huì)占用一整行磅网，其他塊級(jí)元素會(huì)被擠下到另一行，而行內(nèi)元素之間可以在同一行存在
- 塊級(jí)元素可以設(shè)計(jì)長(zhǎng)寬，而行內(nèi)元素?zé)o法設(shè)置長(zhǎng)寬
- 行內(nèi)元素設(shè)置margin和padding時(shí)只有左右有效锯梁，上下無(wú)效
- 塊級(jí)元素可以包含行內(nèi)元素和塊級(jí)元素徙硅，行內(nèi)元素只能包含行內(nèi)元素和文本
什么是 CSS 繼承? 哪些屬性能繼承黎侈，哪些不能？
繼承：繼承是依賴于父子關(guān)系的一種機(jī)制闷游。對(duì)于某個(gè)樣式應(yīng)用于某個(gè)父元素時(shí)峻汉，子元素如果不做特別的限制，子元素會(huì)繼承父元素的一些樣式
-
無(wú)繼承性的屬性
1脐往、display：規(guī)定元素應(yīng)該生成的框的類型
2休吠、文本屬性：
vertical-align：垂直文本對(duì)齊
text-decoration：規(guī)定添加到文本的裝飾
text-shadow：文本陰影效果
white-space：空白符的處理
unicode-bidi：設(shè)置文本的方向
3、盒子模型的屬性：width业簿、height瘤礁、margin 、margin-top梅尤、margin-right柜思、margin-bottom、margin-left巷燥、border赡盘、border-style、border-top-style缰揪、border-right-style陨享、border-bottom-style、border-left-style钝腺、border-width抛姑、border-top-width、border-right-right艳狐、border-bottom-width定硝、border-left-width、border-color毫目、border-top-color蔬啡、border-right-color诲侮、border-bottom-color、border-left-color星爪、border-top浆西、border-right、border-bottom顽腾、border-left近零、padding、padding-top抄肖、padding-right久信、padding-bottom、padding-left
4漓摩、背景屬性：background裙士、background-color、background-image管毙、background-repeat腿椎、background-position、background-attachment
5夭咬、定位屬性：float啃炸、clear、position卓舵、top南用、right、bottom掏湾、left裹虫、min-width、min-height融击、max-width筑公、max-height、overflow砚嘴、clip十酣、z-index
6、生成內(nèi)容屬性：content际长、counter-reset、counter-increment
7兴泥、輪廓樣式屬性：outline-style工育、outline-width、outline-color搓彻、outline
8如绸、頁(yè)面樣式屬性：size嘱朽、page-break-before、page-break-after
9怔接、聲音樣式屬性：pause-before搪泳、pause-after、pause扼脐、cue-before岸军、cue-after、cue瓦侮、play-during
-
可以繼承屬性
1艰赞、字體系列屬性
font：組合字體
font-family：規(guī)定元素的字體系列
font-weight：設(shè)置字體的粗細(xì)
font-size：設(shè)置字體的尺寸
font-style：定義字體的風(fēng)格
font-variant：設(shè)置小型大寫字母的字體顯示文本，這意味著所有的小寫字母均會(huì)被轉(zhuǎn)換為大寫肚吏，但是所有使用小型大寫字體的字母與其余文本相比方妖，其字體尺寸更小。
font-stretch：對(duì)當(dāng)前的 font-family 進(jìn)行伸縮變形罚攀。所有主流瀏覽器都不支持党觅。
font-size-adjust：為某個(gè)元素規(guī)定一個(gè) aspect 值，這樣就可以保持首選字體的 x-height斋泄。
2杯瞻、文本系列屬性
text-indent：文本縮進(jìn)
text-align：文本水平對(duì)齊
line-height：行高
word-spacing：增加或減少單詞間的空白（即字間隔）
letter-spacing：增加或減少字符間的空白（字符間距）
text-transform：控制文本大小寫
direction：規(guī)定文本的書寫方向
color：文本顏色
3、元素可見性：visibility
4是己、表格布局屬性：caption-side又兵、border-collapse、border-spacing卒废、empty-cells沛厨、table-layout
5、列表布局屬性：list-style-type摔认、list-style-image逆皮、list-style-position、list-style
6、生成內(nèi)容屬性：quotes
7掺喻、光標(biāo)屬性：cursor
8拾积、頁(yè)面樣式屬性：page、page-break-inside剿牺、windows、orphans
9环壤、聲音樣式屬性：speak晒来、speak-punctuation、speak-numeral郑现、speak-header湃崩、speech-rate荧降、volume、voice-family攒读、pitch朵诫、pitch-range、stress薄扁、richness剪返、、azimuth泌辫、elevation
如何讓塊級(jí)元素水平居中随夸？如何讓行內(nèi)元素水平居中?
- 塊級(jí)元素水平居中：margin：0 auto；
- 行內(nèi)元素水平居中：text-align：center震放；
用 CSS 實(shí)現(xiàn)一個(gè)三角形
<style> .a{ width: 0; height: 0 ; border-top:solid 20px red; border-left:solid 20px transparent; border-right:solid 20px transparent; border-bottom:solid 20px transparent; } </style> <body> <h1 class="a"></h1> </body>
- 把內(nèi)容的寬高設(shè)為0宾毒，把border設(shè)寬同時(shí)把三個(gè)方向的border設(shè)為隱藏,這樣就可以了
單行文本溢出加 ...如何實(shí)現(xiàn)?
需要三行標(biāo)簽，主要思路：阻止自動(dòng)換行殿遂、對(duì)溢出的文本隱藏诈铛、對(duì)隱藏的文本用...表示
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
當(dāng)遇到比如h標(biāo)簽時(shí)，h標(biāo)簽屬性本身就不會(huì)換行時(shí)就不需要white-space:nowrap,當(dāng)然直接加三行代碼會(huì)更加方便墨礁，類似于清除浮動(dòng)時(shí)直接寫clear：both的感覺(jué)是一樣的幢竹。
px, em, rem 有什么區(qū)別
- px是相對(duì)于瀏覽器的大小，也就是像素單位
- em是相對(duì)父容器寬高長(zhǎng)度或者文字字體本身的倍數(shù)
- rem是相對(duì)于根節(jié)點(diǎn)body設(shè)置的字體倍數(shù)
解釋下面代碼的作用?為什么要加引號(hào)? 字體里\5b8b\4f53代表什么?
body{ font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif; }
- 設(shè)置字體為12px恩静，行高為字體的1.5倍焕毫，使用的字體類型為tahoma，arial驶乾，hiragino sans GB邑飒，\5b8b\4f53，sans-serif字體類型由瀏覽器级乐、計(jì)算機(jī)中的字體庫(kù)搜尋優(yōu)先選用前面的字體疙咸，如果找不到用后面字體替代，以此類推风科。
- 加引號(hào)的作用是為了區(qū)別每個(gè)字體的名稱撒轮，方便瀏覽器識(shí)別字體名稱防止識(shí)別錯(cuò)誤產(chǎn)生亂碼
- 字體里的\5b8b\4f53代表宋體，因?yàn)槿绻菄?guó)外的用戶可能字體庫(kù)中沒(méi)有中文贼穆，會(huì)導(dǎo)致無(wú)法識(shí)別該字體名稱题山，所以用通用的unicode編碼表示。
