1.塊級元素和行內(nèi)元素分別有哪些事镣？動手測試并列出4條以上的特性區(qū)別
- 塊級元素：獨占一行,默認(rèn)情況下,其寬度自動填滿其父元素寬度玖绿。
以下都是塊級元素
| 塊級元素 | 含義 |
|---|---|
| address | 地址 |
| blockquote | 塊引用 |
| center | 舉中對齊塊 |
| dir | 目錄列表 |
| div | 常用塊級容易硫惕，也是css layout的主要標(biāo)簽 |
| dl | 定義列表 |
| fieldset | form控制組 |
| form | 交互表單 |
| h1 | 大標(biāo)題 |
| h2 | 副標(biāo)題 |
| h3 | 3級標(biāo)題 |
| h4 | 4級標(biāo)題 |
| h5 | 5級標(biāo)題 |
| h6 | 6級標(biāo)題 |
| hr | 水平分隔線 |
| isindex | input prompt |
| menu | 菜單列表 |
| noframes | frames可選內(nèi)容雹顺，（對于不支持frame的瀏覽器顯示此區(qū)塊內(nèi)容 |
| noscript | 可選腳本內(nèi)容（對于不支持script的瀏覽器顯示此內(nèi)容） |
| ol | 排序表單 |
| p | 段落 |
| pre | 格式化文本 |
| table | 表格 |
| ul | 非排序列表 |
- 行內(nèi)元素（內(nèi)聯(lián)元素）：僅占據(jù)自己行內(nèi)的位置
下列為常見行內(nèi)元素
| 行內(nèi)元素 | 含義 |
|---|---|
| a | 錨點 |
| abbr | 縮寫 |
| acronym | 首字 |
| b | 粗體(不推薦) |
| bdo | bidi override |
| big | 大字體 |
| br | 換行 |
| cite | 引用 |
| code | 計算機代碼(在引用源碼的時候需要) |
| dfn | 定義字段 |
| em | 強調(diào) |
| font | 字體設(shè)定(不推薦) |
| i | 斜體 |
| img | 圖片 |
| input | 輸入框 |
| kbd | 定義鍵盤文本 |
| label | 表格標(biāo)簽 |
| q | 短引用 |
| s | 中劃線(不推薦) |
| samp | 定義范例計算機代碼 |
| select | 項目選擇 |
| small | 小字體文本 |
| span | 常用內(nèi)聯(lián)容器，定義文本內(nèi)區(qū)塊 |
| strike | 中劃線 |
| strong | 粗體強調(diào) |
| sub | 下標(biāo) |
| sup | 上標(biāo) |
| textarea | 多行文本輸入框 |
| tt | 電傳文本 |
| u | 下劃線 |
| var | 定義變量 |
-
塊級元素和行內(nèi)元素的區(qū)別
（1）塊級元素占據(jù)一行的空間厕鹃，行內(nèi)元素僅占據(jù)行內(nèi)自己的一小部分
（2）塊級元素可包含塊級元素和行內(nèi)元素兢仰，行內(nèi)元素僅包含文本和行內(nèi)元素
（3）設(shè)置寬高（width height）對塊級元素有效，對行內(nèi)元素不生效剂碴，行內(nèi)元素高度可通過inline-height設(shè)置
舉例
（4）對塊級元素設(shè)置margin和padding上下左右都有效旨别，對行內(nèi)元素設(shè)置margin和padding只對左右生效
舉例
（5）塊級元素display=block，行內(nèi)元素display=inline
2.什么是 CSS 繼承? 哪些屬性能繼承汗茄，哪些不能？
CSS繼承
子元素沒有指定值的情況繼承父元素的屬性铭若。CSS中可繼承的屬性
1洪碳、字體系列屬性
font：組合字體
font-family：規(guī)定元素的字體系列
font-weight：設(shè)置字體的粗細(xì)
font-size：設(shè)置字體的尺寸
font-style：定義字體的風(fēng)格
font-variant：設(shè)置小型大寫字母的字體顯示文本递览，這意味著所有的小寫字母均會被轉(zhuǎn)換為大寫，但是所有使用小型大寫字體的字母與其余文本相比瞳腌，其字體尺寸更小绞铃。
font-stretch：對當(dāng)前的 font-family 進(jìn)行伸縮變形。所有主流瀏覽器都不支持嫂侍。
font-size-adjust：為某個元素規(guī)定一個 aspect 值儿捧，這樣就可以保持首選字體的 x-height。
2挑宠、文本系列屬性
text-indent：文本縮進(jìn)
text-align：文本水平對齊
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抄课、頁面樣式屬性：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
- CSS中不可繼承的屬性
1泪电、display：規(guī)定元素應(yīng)該生成的框的類型
2般妙、文本屬性：
vertical-align：垂直文本對齊
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谓松、頁面樣式屬性：size、page-break-before践剂、page-break-after
9鬼譬、聲音樣式屬性：pause-before、pause-after逊脯、pause优质、cue-before、cue-after男窟、cue盆赤、play-during
- 所有元素可以繼承的屬性
1、元素可見性：visibility
2歉眷、光標(biāo)屬性：cursor
- 內(nèi)聯(lián)元素可以繼承的屬性
1牺六、字體系列屬性
2、除text-indent汗捡、text-align之外的文本系列屬性
- 塊級元素可以繼承的屬性
1淑际、text-indent畏纲、text-align
3.如何讓塊級元素水平居中？如何讓行內(nèi)元素水平居中?
- 塊級元素居中：設(shè)置margin= 0 auto可完成
- 行內(nèi)元素居中：設(shè)置text-align= center可完成
4.用 CSS 實現(xiàn)一個三角形
5.單行文本溢出加 ...如何實現(xiàn)?
選中相應(yīng)的文字后春缕，輸入以下代碼可以實現(xiàn)：
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
圖例
6.px, em, rem 有什么區(qū)別
px： 固定單位盗胀，輸入多少px就是多少像素的大小
em: 相對單位，相對于父元素字體大小锄贼，例如票灰，輸入1em，就是父元素的一倍
rem: 相對單位宅荤，相對于根元素(html)字體大小
7.解釋下面代碼的作用?為什么要加引號? 字體里\5b8b\4f53代表什么?
body{
font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
}
- 代碼從左到右設(shè)置字體大小為12px屑迂，行高為字體大小的1.5倍，右邊按優(yōu)先級排列選用的字體樣式
- 字體加引號是表示這幾個單詞在一起表示一個字體冯键，如果沒有引號惹盼，會認(rèn)為是三個不同的字體
- \5b8b\4f53是將漢字變?yōu)閁nicode碼，因為直接打中文字體名會讓一些計算機無法識別惫确，這里指的是宋體
