span代碼使用教程

格式: span style="具體代碼">文字</span>

代碼: <span style="font-size: 24px">字體大小控制</span>

效果: 字體大小控制

說明: px 是字體單位,意思是“像素”,24px 指定字體大小爲 24 像素,數值越大,字體越大。

代碼: <span style="color: blue">字體顏色控制</span>

效果: 字體顏色控制

說明: 其他常用顏色名有:redgreenyellowwhiteblackgraycyan,替換 blue 即可。

代碼: <span style="font-style: oblique">斜體</span>

效果: 斜體

代碼: <span style="font-weight: 600">字體加粗</span>

效果: 字體加粗

說明: 允許的值有:100-900 整百數(數值越大,字體月粗)、bold、bolder、lighter。

代碼: <span style="text-decoration: underline">下劃線</span>

效果: 下劃線

代碼: <span style="text-decoration: overline">上劃線</span>

效果: 上劃線

代碼: <span style="text-decoration: line-through">貫穿線</span>

效果: 貫穿線

代碼: <span style="line-height: 400%">400% 的行高</span>

效果: 400% 的行高

說明: 指定的百分數越到,行高越高。

代碼: <span style="background-color: red; color: white">紅色背景,白色文字</span>

效果: 紅色背景,白色文字

代碼: <span style="border: 2px solid blue">帶邊框的文字</span>

效果: 帶邊框的文字

說明: 2px - 邊框寬度,solid - 邊框樣式(常見還有:dotteddasheddouble),blue - 邊框顏色。雙線(double)只有指定邊框爲3 px以上(含)才能看出效果,點線(dotted)與虛線(dashed)效果差不多,只有在大尺寸下才能看清區別。(注:在 Firefox 下 dotted 與 dashed 的區別看的很清晰)

代碼: <span style="cursor: wait">等待鼠標指針</span>

效果: 等待鼠標指針

說明: 常見還有:all-scrollcrosshairhandmovehelpnot-allowedprogress

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章