1. 塊級元素和行內元素分別有哪些？動手測試并列出4條以上的特性區別

• 塊級元素
  div ul ol li dl dt dd h1~h6 p table fieldset form
• 行內元素
  a img input label select span button
• 區別

1. 塊級元素占據一整行空間，行內元素只占據自身寬度的空間，一行中可以排列多個行內元素。
2. 塊級元素可以包含塊級元素和行內元素，行內元素只能包含行內元素和文本。
3. 塊級元素可以設置寬高，行內元素設置寬高是無效的。
4. 塊級元素上下左右都可以設置margin，而行內元素只有左右設置margin時有效。

2. 什么是 CSS 繼承? 哪些屬性能繼承，哪些不能？

• css繼承就是指子節點繼承父節點的屬性

  • 不可繼承的：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。

• 內聯元素可繼承：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。

• 表格元素可繼承：border-collapse。

3. 如何讓塊級元素水平居中？如何讓行內元素水平居中?

• 塊級元素水平居中

margin: 0 auto;

• 行內元素水平居中

text-align: center;

4. 用 CSS 實現一個三角形

JS Bin三角形

5. 單行文本溢出加 ...如何實現?

E {
    white-sapce: nowarp;     // 不換行
    overflow: hidden;         // 溢出隱藏
    text-overflow: elispsis;  // 用省略號代替隱藏部分文字
}

6. px, em, rem 有什么區別

• px
  固定單位，PX實際上就是像素，用PX設置字體大小時，比較穩定和精確。
• em
  相對單位，相對于父元素字體大小。
• rem
  相對單位，相對于根元素(html)字體大小。

7. 解釋下面代碼的作用?為什么要加引號? 字體里\5b8b\4f53代表什么?

body {
  font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
}

• 解釋：
  body元素的字體高度為12px，行高為字體大小的1.5倍，字體選擇** tahoma，沒有的話選擇arial，依次類推。
  加引號是因為這種字體的名字本來中間就含有空格，加引號是為了讓機器識別 Hiragino Sans GB是一種字體名而不是三個字體名。
  \5b8b\4f53這是使用Unicode編碼的字體名，這個例子中，\5b8b為Unicode的“宋”，\4f53為Unicode**的“體”，所以這個編碼就是指“宋體”。

效果一
效果二
效果三
效果四
效果五