CSS---常用

flex布局:https://www.runoob.com/bootstrap4/bootstrap4-flex.html

http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html

1.超出div的内容隐藏

overflow:hidden

2.只读

readonly

3.图片设置缩放

只要设置宽度或这长度即可

3.给图片剧中

            <el-col :span="4" style="height: 100px;display: flex;justify-content: center;align-items: center;">  //div需要设置宽度
                <img style="height: 50px;border-radius: 50px;margin: 0 auto" src="@/assets/touxiang.jpg" alt="">
            </el-col>

4.设置边框

border:5px solid red;

5.左边自适应,右边固定

<div id="wrap">
  <div id="content" style="height:340px;">自适应区,在前面</div>
  <div id="sidebar" style="height:240px;">固定宽度区</div>
</div>

<style>
#wrap {
    *zoom: 1; position: relative;
  }
  #sidebar {
     300px; position: absolute; right: 0; top: 0;
  }
  #content {
    margin-right: 310px;
  }
</style>

  

原文地址:https://www.cnblogs.com/yanxiaoge/p/11957846.html