1,设置元素宽度和margin值
div{
width : 90%;
margin : 0px auto
}
2, 定位元素,并设置其左右距离,但,不能设定宽度
div{
position : absolute;
left : 18px;
right : 18px;
}
3,定位元素,设置元素宽度和margin-left为元素的宽度二分一的负值
div{
position : absolute;
width : 100px;
left : 50%;
margin-left : -50px;
}

让Div居中的方法的更多相关文章

  1. 纯css使div垂直居中,div垂直,div居中的方法

    首先编写一个简单的html代码,设置一个父div类名为boxFather,再设置一个子div类名为box1.html代码如下: <div class="boxFather"& ...

  2. Bootstrap Div 居中的方法

    有两个DIV,DIV2被包含在DIV1中.格式如下: <div id="div1"> <div id="div2">         & ...

  3. DIV居中的经典方法

    1. 实现DIV水平居中 设置DIV的宽高,使用margin设置边距0 auto,CSS自动算出左右边距,使得DIV居中. 1 div{ 2 width: 100px; 3 height: 100px ...

  4. div居中方法总结

    在日常开发过程中,我们会经常使用到div居中来处理布局,今天我就把我在开发过程中,遇到的div居中处理方法总结一下,方便日后查看!        1. 水平居中:给div设置一个宽度,然后添加marg ...

  5. 设置div中的div居中显示

    设置div中的div居中显示 方法一. <div class='big'> <div class='small'>box1</div> </div> s ...

  6. css未知宽高的盒子div居中的多种方法

    不知道盒子大小.宽高时,如何让盒子上下左右居中? 应用场景:比如上传图片时,并不知道图片的大小,但要求图片显示在某盒子的正中央. 方法1:让4周的拉力均匀-常用 <!-- Author: Xia ...

  7. 实现DIV居中的几种方法

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. 让几个横向排列的浮动子div居中显示的方法

    div设置成float之后,就无法使子div居中显示了,那么如何让几个横向排列的浮动的div居中显示呢,下面有个不错的方法,希望对大家有所帮助 div设置成float之后,在父div中设置text-a ...

  9. div居中和垂直居中的最简单方法

    div居中方法: 1)对父盒子添加 text-align="center": 2)子盒子添加 margin:0 auto; 例子: body{text-align:center} ...

随机推荐

  1. PageAdmin CMS网站制作教程实例:如何制作一个报名表?

    PageAdmin CMS网站建设实例:如何制作一个报名表? 有时我们根据需求需要制作一些自定义表,该如何去制作呢? 我们以制作一个报名表为例: 登录后台地址,进入后台, 2.在顶部导航中找到系统,并 ...

  2. SecureCRT连接Ubuntu,centos失败,长时间的重新连接,连接不了解决办法

    Ubuntu,centos默认未安装ssh远程加密连接服务.使用命令,安装即可. 0.sudo apt-get install openssh-server openssh-client 1.rpm ...

  3. 基于jeesite+android开发 电子商务系统免费教程

    下载地址: jeesite免费教程 基于jeesite+android开发 电子商务系统免费教程 基于jeesite+android开发 电子商务系统免费教程 这个教程已经录制完很久了,一直没有公开, ...

  4. RPC理解

    RPC,英文名称Remote Procedure Call Protocol,即远程过程通讯协议. 可以设想一种情况,有一个人,叫A,A想要翻开一本书,非常简单,让大脑控制自己两只手,轻易就可以看到书 ...

  5. 下载apache-tomcat-9.0.17-windows-x64及安装以及用途

    首先我们先去这个网站下载http://www.apache.org/,进入Tomcat,点击Tomcat9 下载64-bit Windows_zip 当我们下载好了之后解压,把多余的文件删除掉,也可以 ...

  6. UML入门 之 交互图 -- 时序图 协作图详解

    作者 : 万境绝尘 转载请注明出处 : http://blog.csdn.net/shulianghan/article/details/17927131 动态图概念 : 从静态图中抽取瞬间值的变化描 ...

  7. Java之Socket网络编程实践

    转自:http://my.oschina.net/leejun2005/blog/104955#comments 一.TCP/IP协议 既然是网络编程,涉及几个系统之间的交互,那么首先要考虑的是如何准 ...

  8. (转) DB2 HADR

    转自http://www.ibm.com/developerworks/cn/data/library/techarticles/dm-0508luojunkai/ 原文:http://blog.cs ...

  9. 编译Qt-mingw使用的opencv

    set path=D:\dev\IDE\Qt5.7.0\Tools\mingw530_32\bin;%path% cd build_mingw530_32 cmake -G "MinGW M ...

  10. puppet的使用:安装puppet

    最近项目要使用puppet,趁机赶紧学习下. 在家里的机器中搭建puppet环境,使用两台ubuntu 14.04: 准备工作 时间同步 两台设备先进行时间同步,我把要安装master的机器作为NTP ...