css3使用心得

div中的文字底部对齐：

<div style="width:100px;height:180px; position:relative;" >   
<span style=" position: absolute;top: 100%;transform: translateY(-100%);">底部居中</span>
</div>

div中的文字居中对齐：

<div style="width:100px;height:180px; position:relative;" >   
<span style=" position: absolute;top: 50%;transform: translateY(-50%);">底部居中</span>
</div>

宽度自动计算：

:root{
 	 --slide-font-div-margin-left: calc(100% - 100px) ;
 }
 .slide-font-div{
   width:var(--slide-font-div-margin-left);
   
 }