一、水平居中

需要设置两点：

1  设置DIV 的width属性即宽度。

2  设置div的margin-left和margin-right属性即可

代码：

<div style="width:800px; margin-left:auto; margin-right:auto; color:White; height:400px">DIV居中</div>

二、DIV垂直居中

同样的道理，需要设置两点：

1  设置DIV 的height属性即宽度。

2  设置div的margin-top和margin-bottom属性值为auto即可

如何设置DIV水平、垂直居中的更多相关文章

  1. Div水平垂直居中的三种方法

    百度了很多种方法,很多是不起作用的.下面这些方法是我亲自试过的.希望对大家有帮助! 下面是一波代码水军. <!DOCTYPE html> <html lang="en&qu ...

  2. 如何让div水平垂直居中

    引子 我们经常遇到需要把div中的内容进行水平和垂直居中.所以,这里介绍一种方法,可以使div水平居中和垂直居中. 代码: <!DOCTYPE html> <html lang=&q ...

  3. CSS（九）：设置盒子水平垂直居中

    通过设置下面的样式可以使盒子水平垂直居中: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  4. 【最全】CSS盒子(div)水平垂直居中居然还有这种方式

    最全的CSS盒子(div)水平垂直居中布局,对CSS 布局掌握程度决定你在 Web 开发中的开发页面速度. 相对于屏幕 方法一:利用定位 <div class="box"&g ...

  5. 文字以及div水平垂直居中

    文字以及div水平垂直居中.md <div class=”content”> <div class=”mydiv”> huangyingnin! </div>< ...

  6. 【笔记】让DIV水平垂直居中的两种方法

    今天写的了百度前端学院春季班的任务:定位和居中问题  由于距离上次学习CSS有点久远了,加上以前木有记笔记的习惯,方法忘得只剩下一种,今天通过网上查阅资料总结了以下两种简单的方法让DIV水平垂直居中. ...

  7. DIV水平垂直居中的CSS兼容写法

    DIV水平垂直居中,非IE浏览器可以用CSS3来处理,IE浏览器中分别处理IE6和/IE7.IE8.IE9. 在IE低版本中,虽然大致上没有问题,但还是有一些细微的显示问题. 示例如下: <!D ...

  8. scss : div水平垂直居中

    scss 是一个很好用的css预处理语言,有很多很好的特性. 比如 mixin. 我们可以像使用函数那样使用mixin. 比如写一个div水平垂直居中. 上代码. @mixin absolute_ce ...

  9. 【html】【10】div布局[div水平垂直居中]

    必看参考: http://www.jb51.net/css/28259.html 让div居中对齐缩写形式为: .style{margin:0 auto;} 数字0 表示上下边距是0.可以按照需要设置 ...

随机推荐

  1. YTU 2973: C语言习题5.25--文件操作2

    2973: C语言习题5.25--文件操作2 时间限制: 1 Sec  内存限制: 128 MB 提交: 242  解决: 105 题目描述 文本文件score.dic 中存储了n名学生的信息(班级编 ...

  2. 利用Selenium自动化web测试

    简介: Selenium 是一个没有正式指导手册的开源项目,这让测试人员的问题调查很费时间.本文为基于 Selenium 1.0(发布于 2009 年 6 月)的测试期间的常见问题提供最佳实践. 简介 ...

  3. poj1026 Cipher

    题目意思可概括为给定集合S = {1,..,n}的一个双射关系f, 求经过k次复合之后元素i对应的元素fk(i) (i∈S). 由于函数是双射,一个原像对应唯一一个像,同样一个像有唯一一个原像,考虑整 ...

  4. SQLite不支持的SQL语法总结

    1 TOP 这是一个大家经常问到的问题,例如在SQLSERVER中可以使用如下语句来取得记录集中的前十条记录: SELECT TOP 10 * FROM [index] ORDER BY indexi ...

  5. 配置开发支持高并发TCP连接的Linux应用程序全攻略

    http://blog.chinaunix.net/uid-20733992-id-3447120.html http://blog.chinaunix.net/space.php?uid=16480 ...

  6. ssh 配置自动登录

    假定 机器A 连接至 机器B . 1. 在机器A上,生成RSA秘钥对 ssh-keygen -t rsa 期间passphrase不输入密码.默认生成文件至 ~/.ssh/ -rw------- we ...

  7. 2016年12月9日 星期五 --出埃及记 Exodus 21:4

    2016年12月9日 星期五 --出埃及记 Exodus 21:4 If his master gives him a wife and she bears him sons or daughters ...

  8. 解决maven的“Dynamic Web Module 3.0 requires Java 1.6 or newer.”错误

    需要添加一个插件,在build标签中添加 <plugins> <plugin> <groupId>org.apache.maven.plugins</grou ...

  9. #define用法集锦

    Definition: The #define Directive You can use the #define directive to give a meaningful name to a c ...

  10. 个人对js闭包的理解

      闭包算是前端面试的基础题,但我看了很多关于闭包的文章博客,但感觉很多对于闭包的理想还是有分歧的,现在网上对闭包的理解一般是两种: 有些文章认为闭包必须要返回嵌套函数中里面用到外面函数局部变量的方法 ...