css技巧

布局.
=Clearfix=

<div class="clearfix">
  <div class="floated">float a</div>
  <div class="floated">float b</div>
  <div class="floated">float c</div>
</div>

.clearfix::after {
   
  content: '';
  display: block;
  clear: both;
}
.floated {
   
  float: left;
}

=多行，单行省略号=

/*单行溢出*/
.one-txt-cut{
   
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
}
/*多行溢出 手机端使用*/
.txt-cut{
   
   overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

=宽高比例=

<div class="constant-width-to-height-ratio"></div>

.constant-width-to-height-ratio {
   
  background: #333;
  width: 50%;
}
.constant-width-to-height-ratio::before {
   
  content: '';
  padding-top</