text-decoration
CSS中的text-decoration 属性规定添加到文本的修饰。
我们知道CSS(Cascading Style Sheets层叠样式表)最要义就在于层叠性,而如果要同时实现几种不同的text-decoration效果,如果是以下代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>同时实现几种不同的text-decoration效果</title>
<style>
p{
text-decoration:overline;
text-decoration:line-through;
}
</style>
</head>
<body>
<p>与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊回以凝视</p>
</body>
</html>
得到的效果图为:
可以看到第二条text-decoration规则层叠掉了第一条,并没有得到我们想要的效果。
那如何同时实现多种不同的text-decoration效果呢?其实只需要把它们声明在同一条规则里面就可以了,如下面代码同时实现了上划线和中划线的效果:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>同时实现几种不同的text-decoration效果</title>
<style>
p{
text-decoration:overline line-through;
}
</style>
</head>
<body>
<p>与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊回以凝视</p>
</body>
</html>
效果图:
同时实现上划线、中划线和下划线:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>同时实现几种不同的text-decoration效果</title>
<style>
p{
text-decoration:overline line-through underline;
}
</style>
</head>
<body>
<p>与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊回以凝视</p>
</body>
</html>
效果图:
相关阅读
利用Animator实现骨骼动画: 1> 确保人物能够正常移动、Camera能够正常跟随 2> 使用WSAD对人物不同运动状态进行切换与连接 3> Le
虽然PID不是什么牛逼的东西,但是真心希望以后刚刚接触这块的人能尽快进入状态。特地分享一些自己如何实现的过程。首先说说增量式P
了解了门,我们就可以做一些实际应用了,计算机的主要目的是计算,而门可以用于计算,所以可以说计算机是由各种不同的门组成。接下来我们
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"