span代码使用教程

格式： span style="具体代码">文字</span>

代码： <span style="font-size: 24px">字体大小控制</span>

效果： 字体大小控制

说明： px 是字体单位，意思是“像素”，24px 指定字体大小为 24 像素，数值越大，字体越大。

代码： <span style="color: blue">字体颜色控制</span>

效果： 字体颜色控制

说明： 其他常用颜色名有：red、green、yellow、white、black、gray、cyan，替换 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 - 边框样式（常见还有：dotted、dashed、double），blue - 边框颜色。双线（double）只有指定边框为3 px以上（含）才能看出效果，点线（dotted）与虚线（dashed）效果差不多，只有在大尺寸下才能看清区别。（注：在 Firefox 下 dotted 与 dashed 的区别看的很清晰）

代码： <span style="cursor: wait">等待鼠标指针</span>

效果： 等待鼠标指针

说明： 常见还有：all-scroll、crosshair、hand、move、help、not-allowed、progress。