css

<style>

.main{

    background: #999999;

    width: 600px;

    height: 400px;

    position: absolute;

    top: 50%;

    left: 50%;

    margin: -200px 0 0 -300px;/*此处的-200px是widthd的一半，-300px是height的一半*/

}

</style>

html

<body>

<div class="main">

</div>

</body>

效果图如下

div 水平垂直居中的更多相关文章

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

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

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

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

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

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

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

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

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

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

  6. scss : div水平垂直居中

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

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

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

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

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

  9. 未知宽高div水平垂直居中3种方法

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> </head&g ...

  10. 如何将一个div水平垂直居中？4种方法做推荐

    方案一: div绝对定位水平垂直居中[margin:auto实现绝对定位元素的居中], 兼容性:,IE7及之前版本不支持 div{ width: 200px; height: 200px; backg ...

随机推荐

  1. [.Net Core] - 使用 NLog 记录日志到 Sql Server

    1. 使用 Nuget 安装 NLog. 2. 在 Sql Server 中创建 NLog 数据表. CREATE TABLE [dbo].[NLogInfo]( ,) NOT NULL, [Date ...

  2. SpringMVC获取参数的几种方式

    前言: 年末了,忙了一年了却发现系统的整理的东西很少,一些基础的东西都未做整理,这里就将它随便整理一下,增加一些印象,当然在网上看到一些好的资料也会整理下来以备后用.今天整理一下springMVC获取 ...

  3. 修改主机名和修改主机映射和ssh免登陆

    1.修改主机名 vim /etc/sysconfig/network NETWORKING=yes HOSTNAME=cc3 2.修改主机映射 vi /etc/hosts 127.0.0.1 loca ...

  4. PAT(B) 1054 求平均值（Java）

    题目链接:1054 求平均值 (20 point(s)) 题目描述 本题的基本要求非常简单:给定 N 个实数,计算它们的平均值.但复杂的是有些输入数据可能是非法的.一个"合法"的输 ...

  5. 静态成员函数和（CPP与C结构体的区别）

    #include <iostream> using namespace std.; //这种写法只是CPP中的struct的用法,但是在C中还是不支持的. //C中的结构体不支持写方法的. ...

  6. Arm-Linux 移植 jpeg库

    背景: jpeg库的使用可以提高显示效率. host平台 :Ubuntu 16.04 arm平台 : S5P6818   jpeg    :v9c arm-gcc :4.8.1 主机准备: 运行以下脚 ...

  7. spring 条件化配置

    步骤一: 实现接口:org.springframework.context.annotation.Condition import org.springframework.context.annota ...

  8. Code First 下自动更新数据库结构（Automatic Migrations）

    示例 Web.config <?xml version="1.0" encoding="utf-8"?> <configuration> ...

  9. vue npm run build 失败

    之前删除过 node-moudel 文件夹,然后 npm install 重新安装,一切OK.打包的时候,报错,找不到caniuse什么的.再删除node-moudel,重新cnpm install ...

  10. 浅谈(IOC)依赖注入与控制反转(DI)

    前言:参考了百度文献和https://www.cnblogs.com/liuqifeng/p/11077592.html以及http://www.cnblogs.com/leoo2sk/archive ...