如何让div处于body居中的状态
<!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居中的状态的更多相关文章
- CSS实现DIV水平自适应居中
DIV水平自适应居中 <!DOCTYPE html> <html lang="cn"> <head> <meta charset=&quo ...
- 如何让div上下左右都居中
在做登陆页面的话,需要login的div 上下左右都居中. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" ...
- 常用布局,div竖直居中
常用两列布局,多列布局和div竖直居中 body { margin:; padding:; } .w200 { width: 200px; } .mar-left200 { margin-left: ...
- div元素上下左右居中
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- 子进程 已安装 post-installation 脚本 返回错误状态 1,dpkg: 处理软件包 python-crypto (--configure)时出错: 该软件包正处于非常不稳定的状态;
这几天在学习redis的时候,装软件总是报错,两个问题都和dpkg有关,上网查阅了些解决办法,发现整体来说执行以下方法均可解决. 虽然每个人需要安装的包不同,但是出现此类问题的不同也只有安装包的名字, ...
- MySQL5.6 大量SQL语句处于Writing to net状态的案例分析
[问题现象] 开发同事反馈有应用在21:00-22:00之间出现大量超时报错. [问题分析] 1. 从DB服务器慢查询指标来看,18:00后有大量的慢查询,累计产生了约9000条慢查询 2. 测试直接 ...
- div设置了居中和宽度,但是显示时宽度占100%
<div id="bigDiv" align="center"> <div id="bottom" style=" ...
- 如何让图片在div里左右居中,上下居中
如何让图片在div里左右居中,上下居中 转载▼ 1.要想让图片左右对齐,我们可以在div里写入"style:text-align:center;"代码来实现. 2.要想使图片居 ...
- DIV的绝对居中
来源:http://www.cnblogs.com/damonlan/archive/2012/04/28/2473525.html 作者:浪迹天涯 很多时候,我们需要在浏览器中让一个div居中进行显 ...
随机推荐
- Linux下c开发 之 线程通信
Linux下c开发 之 线程通信 1.Linux“线程” 进程与线程之间是有区别的,不过Linux内核只提供了轻量进程的支持,未实现线程模型.Linux是一种“多进程单线程”的操作系统.Linux本身 ...
- php 7.2下mcrypt扩展支持附带的问题
按照网上提供的mcrypt扩展编译支持方法,完成了扩展编译,也确实可以正常加密/解密了 但是如果php.ini中配置为: error_reporting = E_ALL display_errors ...
- python基础-logging应用
import logging.config BASE_DIR=os.path.dirname(os.path.dirname(os.path.abspath(__file__)))LOG_PATH=o ...
- windows API 第八篇 _tcsicmp _stricmp _wcsicmp _mbsicmp
这些函数都是比较字符串小写的,忽略大写,出入的字符串都将按照小写比较Perform a lowercase comparison of strings. 函数原型: int _stricmp( con ...
- 【error】vue-style-loader didn't discriminate between server and client
出现这个bug的时候,设置为false
- Ionic跳转到外网地址
1.安装插件 https://github.com/apache/cordova-plugin-inappbrowser 执行命令:cordova plugin add org.apache.cord ...
- 不同目录cookie共享的问题解决 cookie不同页面访问不到的问题
一般设置cookie的方法是setcookie(key, value, expire),参数分别的意思是建.值.过期时间,这里是大众的默认设置方法,但是忽略了一个问题,setcookie还有path与 ...
- 【DM642学习笔记十】DSP优化记录
1. 处理的数据先EDMA到片内,具有更高的效率! 以YUV2RGB为例: #pragma DATA_SECTION(onchipBuf0_y,".INTPROCBUFF"); # ...
- Python - 集合与元素之集合定义和基本操作方法
集合(set) 定义:由不同元素组成的集合,集合中是一组无序排列可hash的值(不可变的值)例如数字.字符串.元组,可以作为字典的key 定义集合: # 定义集合 s = {1, 2, 3, 3, 3 ...
- KOA 学习(三)
请求(Request) Koa Request 对象是对 node 的 request 进一步抽象和封装,提供了日常 HTTP 服务器开发中一些有用的功能. req.header 请求头对象 requ ...