zoukankan      html  css  js  c++  java
  • 让元素垂直水平居中的方式

        结构:     <div class="box"></div>

      方法一:

        .box{

          300px;

          height:200px;

          position:absolute;

          left:50%;

          top:50%;

          margin-left:-150px;

          margin-top:-100px;

          background:red;

        }

      方式二:

        .box{

          300px;

          height:200px;

          background:red;

          position:absolute;

          left:0;

          top:0;

          right:0;

          bottom:0;

          margin:auto;

        }

      方式三:

        .box{

          300px;

          height:200px;

          background:red;

        }

      js部分:

        $(".box").css({

          position:absolute,

          left:($(window).width()-$(".box").outerWidth())/2,

          top:($(window).height()-$(".box").outerHeight())/2,  

        })

        

     

       .

    第七种

    {
      position: absolute;
      left: 0;
      right:0;
      top: 50%;
      z-index: 1;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
       transform: translateY(-50%);
       text-transform: uppercase;
    }
  • 相关阅读:
    Python3 collections模块的使用
    基于python的分治法和例题
    docker容器间通信 (共用宿主机)
    HTML之form表单ENCTYPE属性解析
    搭建基于码云gitee平台代码自动部署
    centos7下docker搭建nginx+phpfpm环境
    mysql主从配置
    centos7升级自带mariadb
    linux下安装docker
    centos7安装postgreSql11
  • 原文地址:https://www.cnblogs.com/ly-qingqiu/p/10232055.html
Copyright © 2011-2022 走看看