css小技巧-元素分類、字型的樣式、畫三角形、游標樣式
- 行級元素(span,strong,em,a,del)-內聯元素
Feature:內容決定元素所佔位置
不可以通過css改變寬高
display:inline;
2.塊級元素(div,p,ul,li,ol,form,address)-塊元素
Feature:獨佔一行
可以通過css改變寬高
display:block;
3.行級塊元素
Feature:內容決定大下
可以改變寬高
display:inline-block;
這三者之間可以通過修改display的值互相改變。
在css中設定字型的大小隻能設定字型的高!!
font-size: px;//字型大小
font-weight: normal,bold,bolder,lighter;//字型粗細
/* 400 700 strong 細體 */
font-style: italic;//斜體
font-family: ;//字型型別
/* arial cuesivegeorgia verdana helvetia simsun */
color: ;//字型顏色
/* 1.土鱉式(純英文單詞)red,green,transparent(透明色)...
2.顏色程式碼:#f40(淘寶紅)
3.顏色函式 reb(0,255,255)*/
border: 1px solid black;
/* 粗細 展示形式 顏色; */
border-width: 20px;/* 邊框大小 */
border-style: ;/* 邊框樣式 */
/* solid 實心,dotted 點狀虛線,dashed 條狀虛線 */
border-left-color: red;
/* 左邊三角形的顏色 可以設定每一條邊 透明色畫三角形 分開寫的會覆蓋前面的*/
text-align: ;/* 對齊方式 預設left*/
/* content 居中,right 右對齊 */
line-height: ;/* 單行文字所佔的高度 */
/* 單行文字垂直居中:單行文字所佔的高度=容器高度 */
text-indent: 2em;/* 首行縮排 */
text-decoration: line-through;/* 刪除線 */
/* none沒有線,underline下劃線 overline上劃線 */
cursor: ;/* 滑鼠的形式 */
/* pointer小手形式,help問號形式,e-resize左右拖拽,w-resize上下
copy,move */
a:hover{ /* 偽類選擇器 */
background-color: orange;
}
/* 當滑鼠移到a上面之後,會發生什麼變化 */