1. 程式人生 > >小標題兩側加橫線或背景圖片自適應佈局實現技巧

小標題兩側加橫線或背景圖片自適應佈局實現技巧

<div class="tit-bar">
   <div class="deg">滿意度調查</div>
</div>
.tit-bar .deg {
  width:100%;
  font-size: 16px;
  color: #555;
  margin: 0 auto;
  position: relative;
  text-align: center
}
.tit-bar .deg::before {
  content: "";
  border-top: 1px solid #ccc;
  display: block;
  position: absolute;
  width: 40%;
  top: 10px;
  left: 0
}
.tit-bar .deg::after {
  content: "";
  border-top: 1px solid #ccc;
  display: block;
  position: absolute;
  width: 40%;
  top: 10px;
  right: 0
}
--------------------- 
作者:小太陽sunshine 
來源:CSDN 
原文:https://blog.csdn.net/zfangls/article/details/53443975 
版權宣告:本文為博主原創文章,轉載請附上博文連結!