<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>Title</title>
<!--<link rel="stylesheet" href="css/style.css" type="text/css">--> </head>
<body>
<!--在body里添加“style="text-align: center;"这一句没有效果真正起作用的是下面的margin:auto;这一句”-->
<div style="margin-left:auto;margin-right:auto;width:50%;height:30px;background-color: aqua; padding:5%;">
<div style="width:50%;background-color: bisque">
<div style="width:50%;background-color: blueviolet"></div>
</div>
</div>
</body>
</html>

浏览器默认从左往右渲染元素,在没有超出父容器的宽度的前提下  如果子容器的宽度能够被容纳  设置margin-right是没有用的

(这句话来自https://blog.csdn.net/zhangshab/article/details/80344704

如果觉得有帮助的话也请支持下原作者。

如何让div处于body居中的状态的更多相关文章

  1. CSS实现DIV水平自适应居中

    DIV水平自适应居中 <!DOCTYPE html> <html lang="cn"> <head> <meta charset=&quo ...

  2. 如何让div上下左右都居中

    在做登陆页面的话,需要login的div 上下左右都居中. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" ...

  3. 常用布局,div竖直居中

    常用两列布局,多列布局和div竖直居中 body { margin:; padding:; } .w200 { width: 200px; } .mar-left200 { margin-left: ...

  4. div元素上下左右居中

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  5. 子进程 已安装 post-installation 脚本 返回错误状态 1,dpkg: 处理软件包 python-crypto (--configure)时出错: 该软件包正处于非常不稳定的状态;

    这几天在学习redis的时候,装软件总是报错,两个问题都和dpkg有关,上网查阅了些解决办法,发现整体来说执行以下方法均可解决. 虽然每个人需要安装的包不同,但是出现此类问题的不同也只有安装包的名字, ...

  6. MySQL5.6 大量SQL语句处于Writing to net状态的案例分析

    [问题现象] 开发同事反馈有应用在21:00-22:00之间出现大量超时报错. [问题分析] 1. 从DB服务器慢查询指标来看,18:00后有大量的慢查询,累计产生了约9000条慢查询 2. 测试直接 ...

  7. div设置了居中和宽度,但是显示时宽度占100%

    <div id="bigDiv" align="center"> <div id="bottom" style=" ...

  8. 如何让图片在div里左右居中,上下居中

    如何让图片在div里左右居中,上下居中 转载▼   1.要想让图片左右对齐,我们可以在div里写入"style:text-align:center;"代码来实现. 2.要想使图片居 ...

  9. DIV的绝对居中

    来源:http://www.cnblogs.com/damonlan/archive/2012/04/28/2473525.html 作者:浪迹天涯 很多时候,我们需要在浏览器中让一个div居中进行显 ...

随机推荐

  1. for update行级锁的作用

    1.for update叫排它锁,是一种行级锁,一旦用户对某个行施加了行级加锁,则该用户可以查询也可以更新被加锁的数据行,其它用户只能查询但不能更新被加锁的数据行.如果其它用户想更新该表中的数据行,则 ...

  2. [BZOJ2164]采矿【模拟+树链剖分+线段树】

    Online Judge:Bzoj2164 Label:模拟,树链剖分,线段树 题目描述 浩浩荡荡的cg大军发现了一座矿产资源极其丰富的城市,他们打算在这座城市实施新的采矿战略.这个城市可以看成一棵有 ...

  3. Python开发利器Pycharm

    可以新建项目的时候,在下面的小扳手那里创建虚拟化环境.若想安装包,直接file->setting里面找到对应项目,然后添加新的包即可.   视频地址:http://edu.51cto.com/c ...

  4. Apache SOLR and Carrot2集成

    1.环境 下载软件 名称 地址 solr-integration-strategies-gh-pages.zip https://github.com/carrot2/solr-integration ...

  5. C语言复制数组

    直接上代码,分别是栈上开辟内存,堆上开辟内存 #include <stdio.h> #include <stdlib.h> void test01(){ ]; printf(& ...

  6. git异常处理(一)

    请输入提交消息来解释为什么这种合并是必要的 git 在pull或者合并分支的时候有时会遇到这个界面.可以不管(直接下面3,4步),如果要输入解释的话就需要: 1.按键盘字母 i 进入insert模式 ...

  7. IE6下extjs 弹窗不加载内容(无法执行内部js)的解决方案

    //需要导入的文件,这里的路径需要些你自己的路径 <link rel="stylesheet" type="text/css" href="ex ...

  8. hibernate4多对多Use of @OneToMany or @ManyToMany targeting an unmapped class:

    出错之后先查了一下,大家有 @Entity 导错包的,不过我这里没错 import javax.persistence.Entity; 就是这个 还有的是没有注解@Table的,我这里也是没问题的 我 ...

  9. 二叉树遍历问题、时间空间复杂度、淘汰策略算法、lru数据结构、动态规划贪心算法

    二叉树的前序遍历.中序遍历.后序遍历 前序遍历 遍历顺序规则为[根左右] ABCDEFGHK 中序遍历 遍历顺序规则为[左根右] BDCAEHGKF 后序遍历 遍历顺序规则为[左右根] DCBHKGF ...

  10. Vue. 之 报错 Uncaught (in promise)

    Vue. 之 报错 Uncaught (in promise) 在点击同一个URL的时候,会报错如下: 解决方案: 在项目目录下运行 npm i vue-router@3.0 -S 即可.