目錄
css使用者介面樣式
滑鼠樣式cursor
輪廓 outline
防止拖拽文字域resize
vertical-align 垂直對齊
去除底側空白縫隙
溢位的文字隱藏
text-overflow 文字溢位
精靈圖web字型
字型格式
字型圖示（iconfont)
字型圖示優點
字型圖示使用流程
推薦**：
設定或檢索在物件上移動的滑鼠指標採用何種系統預定義的游標形狀。
cursor : default 小白 | pointer 小手 | move 移動 | text 文字
是繪製於元素周圍的一條線，位於邊框邊緣的外圍，可起到突出元素的作用。
outline : outline-color ||outline-style || outline-width
但是我們都不關心可以設定多少，我們平時都是去掉的。
最直接的寫法是 ： outline: 0; 或者 outline: none;
resize：none 這個單詞可以防止 火狐 谷歌等瀏覽器隨意的拖動 文字域。
vertical-align : baseline |top |middle |bottom 不好用
vertical-align 不影響塊級元素中的內容對齊，它只針對於 行內元素或者行內塊元素，特別是行內塊元素，通常用來控制/表單與文字的對齊。
或者表單等行內塊元素，他的底線會和父級盒子的基線對齊。這樣會造成乙個問題，就是底側會有乙個空白縫隙。
解決的方法就是：
給img vertical-align:middle | top等等。 讓不要和基線對齊
給img 新增 display：block; 轉換為塊級元素就不會存在問題了。
white-space設定或檢索物件內文字顯示方式。通常我們使用於強制一行顯示內容
normal : 預設處理方式
nowrap : 強制在同一行內顯示所有文字，直到文字結束或者遭遇br標籤物件才換行。
text-overflow : clip | ellipsis
設定或檢索是否使用乙個省略標記（...）標示物件內文字的溢位
clip : 不顯示省略標記（...），而是簡單的裁切
ellipsis : 當物件內文字溢位時顯示省略標記（...）
注意一定要首先強制一行內顯示，再次和overflow屬性 搭配使用
css 精靈其實是將網頁中的一些背景影象整合到一張大圖中（精靈圖），
然而，各個網頁元素通常只需要精靈圖中不同位 置的某個小圖，要想精確定位到精靈圖中的某個小圖，
就需要使用css的background-image、background-repeat和background-position屬性進行背景定位，
其中最關鍵的是使用background-position屬性精確地定位。
不同瀏覽器所支援的字型格式是不一樣的，我們有必要了解一下有關字型格式的知識。
1、turetype(.ttf)格式
.ttf字型是windows和mac的最常見的字型，是一種raw格式，
支援這種字型的瀏覽器有ie9+、firefox3.5+、chrome4+、safari3+、opera10+、ios mobile、safari4.2+；
2、opentype(.otf)格式
.otf字型被認為是一種原始的字型格式，其內建在turetype的基礎上，
支援這種字型的瀏覽器有firefox3.5+、chrome4.0+、safari3.1+、opera10.0+、ios mobile、safari4.2+；
3、web open font format(.woff)格式
woff字型是web字型中最佳格式，他是乙個開放的truetype/opentype的壓縮版本，同時也支援元資料報的分離，
支援這種字型的瀏覽器有ie9+、firefox3.5+、chrome6+、safari3.6+、opera11.1+；
4、embedded open type(.eot)格式
.eot字型是ie專用字型，可以從truetype建立此格式字型，
支援這種字型的瀏覽器有ie4+；
5、svg(.svg)格式
.svg字型是基於svg字型渲染的一種格式，
支援這種字型的瀏覽器有chrome4+、safari3.1+、opera10.0+、ios mobile safari3.2+；
是有諸多優點的，但是缺點很明顯，比如不但增加了總檔案的大小，還增加了很多額外的"http請求"，
這都會大大降低網頁的效能的。更重要的是不能很好的進行「縮放」，因為放大和縮小會失真。
可以做出跟一樣可以做的事情,改變透明度、旋轉度，等..
但是本質其實是文字，可以很隨意的改變顏色、產生陰影、透明效果等等...
本身體積更小，但攜帶的資訊並沒有削減。
幾乎支援所有的瀏覽器
移動端裝置必備良藥...
檔案放入到 fonts資料夾裡面
在樣式裡面宣告字型： 告訴別人我們自己定義的字型
@font-face
給盒子使用字型
span
盒子裡面新增結構
span::before
或者
追加新圖示到原來庫裡面
把壓縮包裡面的selection.json 從新上傳
icomoon字型檔
推薦**：
阿里icon font字型檔
fontello
font-awesome
glyphicon halflings
icons8
學前端的第七天（CSS Day05）
css3 變換 移動，縮放，旋轉，拉伸 transform 變換 translate 移動 translate x軸,y軸 注 如果只有乙個值，相當於只移動水平方向 rotate rotate 角度 預設是z軸 rotatex rotatey rotatez scale 縮放 scale x,y 只...
css使用者介面樣式
css 滑鼠樣式cursor 設定或檢索在物件上移動的滑鼠指標採用何種系統預定義的游標形狀。cursor default 小白 pointer 小手 move 移動 text 文字 輪廓 outline 是繪製於元素周圍的一條線，位於邊框邊緣的外圍，可起到突出元素的作用。outline outlin...
CSS之使用者介面樣式
所謂的介面樣式，就是更改一些使用者操作樣式，比如 更改使用者的滑鼠樣式，表單輪廓等。但是比如滾動條的樣式改動受到了很多瀏覽器的抵制，因此我們就放棄了。防止表單域拖拽 設定或檢索在物件上移動的滑鼠指標採用何種系統預定義的游標形狀。cursor default 小白 pointer 小手 move 移動...