CSS⽂字垂直居中⾃适应-代码篇
CSS ⽂字垂直居中⾃适应 - 代码篇
引⾔
<div>内的⽂字能在图⽚缩放的同时，⾃动居中（⾃适应居中），详情看下列代码。
效果图：
解决办法 · 代码⽰下：
/*CSS代码*/
.h3{position: absolute;top:0;left:0;width:100%;height:100%;font-size: 14px;font-weight: bold;text-align: center;background:rgba(0,0,0,.2);margin: 0;} .h3::before{
display: inline-block;
content:"";
height: 100%;
vertical-align: middle;
}
<li class="mui-table-view-cell mui-media mui-col-xs-6">
<div  class="div-a-href">
<div >
<img class="mui-media-object" src="statics/images/demo.jpg">
<h3 class="h3"><span class="mui-badge bg000">⼆⼿车鉴定评估培训</span></h3>
</div>
<div class="chat-link">
<a class="mui-pull-left mui-btn mui-btn-danger" href="">报名流程</a>
<a class="mui-pull-right mui-btn mui-btn-danger mui-btn-outlined" href="">咨询价格</a>        </div>
</div>
</li>
div中的div居中以上就是关于"CSS ⽂字垂直居中⾃适应 - 代码篇" 的全部内容。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。