zoukankan      html  css  js  c++  java
  • 图片垂直水平居中

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>图片垂直水平居中</title>
        <style>
        
          .test_div{ 
          width
    :120px;
          height:120px;
          border:1px solid #ccc;
          display
    :table-cell;/*最重要*/
          vertical-align:middle;/*设置水平居中*/
          } .test_div img{
            border
    :none;
            max-width
    :100%;
            max-height:100%;
            display
    :block;
            margin
    :auto;/*设置垂直居中*/
            } </style> </head> <body> <div class="test_div"> <img src="https://ss0.baidu.com/73F1bjeh1BF3odCf/it/u=2262276723,1254933744&fm=85&s=E1D15B8C0C45989C3DBF60400300B0DA" alt=""> </div> </body> </html>

    效果图

  • 相关阅读:
    树状数组&线段树
    8月7日小练
    8月6日小练
    LID&LDS 的另外一种算法
    LCS,LIS,LCIS
    8-11-Exercise
    8-10-Exercise
    线段树
    8-7-Exercise
    8-6-Exercise
  • 原文地址:https://www.cnblogs.com/heyiming/p/7615872.html
Copyright © 2011-2022 走看看