1.塊級元素和行內元素分別有哪些？動手測試并列出4條以上的特性區別
block-level
div h1 h2 h3 h4 h5 h6 p hr
form ul dl ol pre table
li dd dt tr td th
inline-level
em strong span a br img
button input label select textarea
code script
- 塊級(block-level); 行內(內聯、inline-level)
- 塊級可以包含塊級和行內，行內只能包含文本和行內
- 塊級占據一整行空間，行內占據自身寬度空間
- 寬高設置、內外邊距的差異
8.1.JPG
2.什么是 CSS 繼承? 哪些屬性能繼承，哪些不能？
CSS繼承是子標簽繼承了上級標簽的CSS樣式的屬性。
- 所有元素可繼承：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。
- 不可繼承的：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。
3.如何讓塊級元素水平居中？如何讓行內元素水平居中?
對于塊級元素 設置 margin: 0 auto 可達到居中目的
/* margin: 0 auto; 實際上是下面兩個起作用 */
margin-left: auto;
margin-right: auto;
}```
行內元素居中
```<style>
.box{
text-align: center;
}
</style>```
####4.用 CSS 實現一個三角形
http://js.jirengu.com/zuqabeyiqo/3/edit?html,css
[http://js.jirengu.com/zuqabeyiqo](http://js.jirengu.com/zuqabeyiqo)
####5.單行文本溢出加 ...如何實現?
```.card > h3{
white-space: nowrap;//設置文本內的空白，nowrap文本不會換行，直到遇到<br>標簽為止
overflow: hidden;//設置當內容溢出元素框時發生的事情，內容會被修剪，并且其余內容是不可見的
text-overflow: ellipsis;//設置當文本溢出包含元素時發生的事情，ellipsis顯示省略符號來代表被修剪的文本
}```
####6.px, em, rem 有什么區別。
- px像素（Pixel）是相對長度單位。像素px是相對于顯示器屏幕分辨率而言的。
px特點:
1. IE無法調整那些使用px作為單位的字體大小；
2. 國外的大部分網站能夠調整的原因在于其使用了em或rem作為字體單位；
3. Firefox能夠調整px和em，rem，但是96%以上的中國網民使用IE瀏覽器(或內核)。
- em是相對長度單位。相對于當前對象內文本的字體尺寸。如當前對行內文本的字體尺寸未被人為設置，則相對于瀏覽器的默認字體尺寸。
em特點：
1. em的值并不是固定的；
2. em會繼承父級元素的字體大小。
- rem是[CSS3](http://www.html5cn.org/portal.php?mod=list&catid=16)新增的一個相對單位（root em，根em）。
三者區別如下：
px 在縮放頁面時無法調整那些使用它作為單位的字體、按鈕等的大小；
em 的值并不是固定的，會繼承父級元素的字體大小，代表倍數；
rem 的值并不是固定的，始終是基于根元素 <html> 的，也代表倍數。
####7.解釋下面代碼的作用?為什么要加引號? 字體里\5b8b\4f53代表什么?
```body{
font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
}```
設置字體大小為12px，line-height為1.5，字體選用tahoma，沒有則用arial，再沒有則用Hiragino Sans GB，沒有則用宋體，都沒有則用sans-serif。
因為中間有空格，不加引號會被識別為兩個元素。
字體里\5b8b\4f53代表Unicode碼，譯為宋體。
http://js.jirengu.com/noxuriqiho
.h-button{
display: inline-block;
padding: 8px 10px;
text-decoration: none;
color: #000;
border-radius: 3px;
cursor: pointer;
transition: all .3s;
}
.steal{
background-color: #009688;
color: #fff;
}
.yellow{
background-color:#ffeb3b;
}
.orange{
background-color: #ff9800;
}
.red{
background-color: #f44336;
color: #fff;
}
.green{
background-color: #4CAF50;
color: #fff;
}
.h-button:hover{
box-shadow: 0 10px 10px 3px #AAA;
}
/*當鼠標懸浮到div上方是，給div添加陰影*/