Web前端开发技术项目教程（HTML5 CSS3 JavaScript）（微课版） 课件 5.2.6知识点3：文本修饰属性.pptx

文本修饰属性信息安全技术应用ApplicationofInformationSecurityTechnology《前端技术开发》

文本修饰属性前端技术开发01文本修饰主要包括给文字添加下划线、删除线、上划线的效果。CSS属性text-decoration可以设置文本修饰。语法text-decoration:none|underline|line-through|overline;text-decoration属性的取值

文本修饰属性前端技术开发01文本修饰属性pclass=p1我有下划线/ppclass=p2我有删除线/ppclass=p3我有上划线/ppclass=p4默认没有装饰线/p.p1{text-decoration:underline;}.p2{text-decoration:line-through;}.p3{text-decoration:overline;}.p4{text-decoration:none;}

文本修饰属性前端技术开发01underline、line-through、overline这三个属性可以组合使用pclass=p5组合使用文本修饰属性/p.p5{text-decoration:underlineoverlineline-through;}

文本修饰属性前端技术开发01可以使用text-decoration-color设置文本修饰的线的颜色语法text-decoration-color:red;

文本修饰属性前端技术开发01可以使用text-decoration-style设置文本修饰的线的线型语法text-decoration-style:solid|double|dotted|dashed;

文本修饰属性前端技术开发01pclass=p6red设置下划线颜色和线型:solid/ppclass=p7red设置下划线颜色和线型:double/ppclass=p8red设置下划线颜色和线型:dashed/ppclass=p9red设置下划线颜色和线型:wavy/p.red{text-decoration:underline;text-decoration-color:red;}.p6{text-decoration-style:solid;}.p7{text-decoration-style:double;}.p8{text-decoration-style:dashed;}.p9{text-decoration-style:wavy;}

文本修饰属性前端技术开发01pclass=p10文本修饰简写属性/p.p10{text-decoration:underlinedoubleblue;}text-decoration也可以使用简写的方式设置属性

小结前端技术开发02文本修饰属性text-decoration用于给文字添加下划线、删除线、上划线的效果。underline：添加下划线overline：添加上划线line-through：添加删除线none：默认，没有装饰线。

感谢观看信息安全技术应用ApplicationofInformationSecurityTechnology《前端技术开发》