1949啦网--小小 痛苦,是因为能力和欲望不匹配造成的

CSS3脚注效果

脚注是向用户提供更多信息的一个最佳途径,也是主体信息的一个有效补充,常见于各种印刷书籍中。不过,既然脚注有这些好处,我们当然要在网页中也加以利用,本文向您介绍了用CSS3实现脚注效果的方法。

<!DOCTYPE html>  <html>  	<head>  		<meta charset="UTF-8">  		<title></title>  <style>  @keyframes ants{100%{background-position:100%;}}  #tt{    width:560px;    height: 30px;  padding-top:1em;  color:tan;    border-top: .2em solid transparent;    border-image: 100% 0 0 linear-gradient(90deg,currentColor 4em,transparent 0);  }    </style>  	</head>  	<body>  <div id="tt">脚注效果:由于使用了currentColor,它会根据color属性的变化而自动适应</div>  	</body>  </html>

原文链接:https://www.qiquanji.com/post/7999.html

本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。

微信扫码关注

更新实时通知

作者:xialibing 分类:网页教程 浏览: