- 塊級元素與行內(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)整所有字體大小。
任意瀏覽器的默認字體高都是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宋體，有空格逗號等字符時需要加引號卷扮，說明是一種字體
