标题背景色只给一半高度

最新推荐文章于 2024-07-19 10:36:15 发布

bingot

最新推荐文章于 2024-07-19 10:36:15 发布

阅读量4.5k

点赞数 1

分类专栏： webapp 文章标签： css 背景颜色高度一半

本文链接：https://blog.csdn.net/bingot/article/details/86134094

版权

webapp 专栏收录该内容

6 篇文章 1 订阅

订阅专栏

不多说直接撸代码

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8" />
  <title>无标题文档</title>
  <script type="text/javascript" src="js/jquery-2.1.4.js"></script>
  <script type="text/javascript" src="js/countUp.js"></script>
  <style type="text/css">
	p {
	  display: inline-block;
	  position: relative;
	}
	p::before {
	  content: '';
	  position: absolute;
	  bottom: 0;
	  left: 0;
	  width: 100%;
	  height: 50%;
	  background: rgba(255, 187, 68, 0.2);
	}
  </style>
</head>

<body>
  <p>如何开通银联在线认证支付</p>
</body>
</html>
<script type="text/javascript">

最后效果成这样：
在这里插入图片描述
总结：其实用定位可以做，主要是把背景色设置一个透明度就可以了