原文：https://blog.csdn.net/z_x_qiang/article/details/82765990
1.鼠標(biāo)樣式屬性:
1.1 cursor: default 默認(rèn)的鼠標(biāo)樣式
1.2 cursor:pointer 小手的樣子
1.3 cursor：text 勾選文本的樣式诅岩；
1.4 cursor：move 拖動(dòng)的樣式讳苦；
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
ul li:nth-child(1){
cursor: default;
}
ul li:nth-child(2){
cursor: pointer;
}
ul li:nth-child(3){
cursor: text;
}
ul li:nth-child(4){
cursor: move;
}
</style>
</head>
<body>
<ul>
<li>默認(rèn)</li>
<li>小手</li>
<li>文本</li>
<li>拖動(dòng)</li>
</ul>
</body>
2.輪廓 outline
比如input默認(rèn)有一臉色的輪廓線；
和border（邊框）很像吩谦；
一般情況下都是去掉這種樣式的鸳谜；
input{
outline: 0;/*去除輪廓線*/
}
3.文本區(qū)域 textarea
默認(rèn)是可以拖動(dòng)改變文本域大小的，在實(shí)際開發(fā)中是去掉這個(gè)屬性的式廷；
resize:none;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
textarea{
resize:none
}
</style>
</head>
<body>
<textarea name="" rows="30" cols="10"></textarea>
</body>
</html>
4.垂直對(duì)齊
vertical-align ：垂直對(duì)齊屬性咐扭，但是對(duì)于塊元素是無效的；
有baseline 、top蝗肪、 middle袜爪、bottom 四種對(duì)齊方式；
只有對(duì)行內(nèi)元素和行內(nèi)塊才有效薛闪，必須保證在一行顯示的才行辛馆；
控制文字和圖片垂直關(guān)系；
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
img{
vertical-align: middle;
}
textarea{
vertical-align: middle;
}
</style>
</head>
<body>
<img src="img/dongman.gif" />一個(gè)gif圖片
<hr />
<textarea name="" rows="30" cols="10"></textarea>文本輸入?yún)^(qū)域
</body>
</html>
5.空白縫隙問題：
圖片和表單等行內(nèi)塊元素的底線會(huì)和父盒子的基線對(duì)齊豁延；所以在有些瀏覽器上回有縫隙昙篙；
解決方法：
1.可以顯示轉(zhuǎn)換成塊元素；
2.默認(rèn)是vertical-align:baseline诱咏；但是這種有縫隙苔可，所以該成top midden bottm都可以解決縫隙問題；
6.文字溢出的處理方案：
6.1 自動(dòng)換行
work-break：break-all 允許才分單詞進(jìn)行換行袋狞；
keep-all 必須是帶有連字符才能換行焚辅；
6.2 一行顯示
while-space：nomal 默認(rèn)是這樣；
while-space：nowrap 強(qiáng)制一行顯示苟鸯；
6.3 省略顯示
1.首先要一行顯示同蜻；強(qiáng)制的 while-space：nowrap；
2.隱藏超出的部分 overflow: hidden;
3.設(shè)置省略號(hào) text-overflow: ellipsis;
