css实现金属质感的文字

<!doctype html>
<html>
 <head>
  <meta charset="UTF-8">
  <title>金属质感的文字</title>
	<style>
		div.a {
			width: 300px;
			text-align: center;
			color: white;
			background: black;
			font-weight: bold;
			font-size: 30px;
			position: relative; 
		}
		a.cover {
			width: 100%;
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
			background: linear-gradient(to bottom,black 0%,transparent 50%,black);
			opacity: 0.5;
		}
	</style>
 </head>
 <body>
	<div class="a">
		金属质感文字
		<a class="cover"></a>
	</div>
 </body>
</html>

欢迎分享本文,转载请保留出处:前端ABC » css实现金属质感的文字

赞 (2)
分享到:更多 ()

发表评论 0