- 塊級元素與行內(nèi)元素的區(qū)別：
| 塊級元素 | 行內(nèi)元素 |
|---|---|
| 獨占一行，寬度自動填滿父元素 | 占據(jù)大小根據(jù)內(nèi)容改變而改變 |
| 能容納塊級元素和行內(nèi)元素 | 只能容納文本或者行內(nèi)元素 |
| 高度，行高，以及邊距可控制 | 高度，行高，以及上下邊距不可控 |
塊級元素：div,form,h1,hr,ol,ul,li
行內(nèi)元素：p,a,input,span,strong
css繼承是指，作用在父元素上的css樣式，對子元素同樣生效。
不可繼承的有margin，padding，border，width，height
可繼承的有color，font-*，塊級元素水平居中，margin:auto
行內(nèi)元素水平居中，text-align:centercss實現(xiàn)三角形，使用塊級元素
height:0;
winth:0;
border-top:30px
- 單行文本溢出加...
{
white-space: nowrap;//文本不會換行，文本會在在同一行上繼續(xù)，直到遇到 <br> 標(biāo)簽為止
overflow:hidden;
text-overflow:ellipsis;//顯示省略符號來代表被修剪的文本
}
多行文本溢出加...
{
word-break:break-all;//允許在單詞內(nèi)換行
display:-webkit-box;
-webkit-line-clamp:2;//限制在一個塊元素顯示的文本的行數(shù)
-webkit-box-orient:vertical;
overflow:hidden;
}
-webkit-line-clamp 是一個 不規(guī)范的屬性，為了實現(xiàn)該效果，它需要組合其他外來的WebKit屬性：
display: -webkit-box; 必須結(jié)合的屬性 ，將對象作為彈性伸縮盒子模型顯示 。
-webkit-box-orient 必須結(jié)合的屬性 ，設(shè)置或檢索伸縮盒對象的子元素的排列方式
text-overflow，可以用來多行文本的情況下，用省略號“...”隱藏超出范圍的文本 。
px，相對長度單位，相對于屏幕分辨率而言。
em，相對當(dāng)前對象內(nèi)文本的字體尺寸，em會繼承父級元素的大小，父級元素大小當(dāng)前元素大小=瀏覽器顯示大小。
rem，相對html根元素大小，可以做到只調(diào)整根元素字體大小就成比例的調(diào)整所有字體大小。
任意瀏覽器的默認(rèn)字體高都是16px。所有未經(jīng)調(diào)整的瀏覽器都符合: 1em=16px，為了簡化font-size的換算，需要在css中的body選擇器中聲明Font-size=62.5%，這就使em值變?yōu)?16px62.5%=10px, 這樣12px=1.2em, 10px=1em。font:22px/5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
字體大小22px，行高5倍字體大小，字體，\5b8b\4f53宋體，有空格逗號等字符時需要加引號，說明是一種字體
