示例1:

.div1{
width:200px;
height:300px;
border:1px solid #000;
position: relative;
}
.div2{
width: 40px;
height:40px;
background:green;
position: absolute;
margin: auto;
top:;
left:;
right:;
bottom:;
}

示例1 css部分

<div class="div1">
<div class="div2">居中</div>
</div>

示例1 html部分

示例2:

.div3{
width:200px;
height:300px;
border:1px solid #000;
display: table-cell;
vertical-align: middle;
}
.div4{
width: 40px;
margin: 0 auto;
}

示例2 css部分

<div class="div3">
<div class="div4">居中</div>
</div>

示例2 html部分

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

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

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

  2. css实现div水平垂直居中

    中秋快到了,祝大家中秋快乐. 平时大家写bug过程中肯定会遇到让div框水平或者垂直居中,然而有时候能居中,有时候不能居中.我把平时遇到的一些方法写出来,如果对你有用,那便是晴天. 1.text-al ...

  3. CSS实现DIV水平 垂直居中-1

    水平大家都知道,一般固定宽度给个margin:0 auto:就可以了.下面实现水平垂直都居中 HTML <div class="parent"> </div> ...

  4. Css控制div水平垂直居中显示

    <style>#info{height:0px; width:0px;top:50%; left:50%;position:absolute;}#center{background:#FF ...

  5. CSS控制DIV水平垂直居中

    <div style="position:absolute; width: 600px; height: 200px; left: 50%; top: 50%; margin-left ...

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

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

  7. Flexbox制作CSS布局实现水平垂直居中

    Flexbox实现一个div元素在body页面中水平垂直居中: <!DOCTYPE html><html lang="en"><head>  & ...

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

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

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

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

随机推荐

  1. 问题: Type mismatch in key from map: expected org.apache.hadoop.io.Text, recieved org.apache.hadoop.io.LongWritable 解决方案

    在Job中添加相应的输入类型,例如: job.setMapOutputKeyClass(Text.class); job.setMapOutputValueClass(IntWritable.clas ...

  2. 启用DHCP中继代理,实现跨子网服务 - Win 2003 Server

    伴随着局域网规模的逐步扩大,一个网络常常会被划分成多个不同的子网,以便根据不同子网的工作要求来实现个性化的管理要求.考虑到规模较大的局域网一般会使用DHCP服务器来为各个工作站分配IP地址,不过一旦局 ...

  3. Linux下快速搭建DNS服务器

    一.术语解释:TTL Time To Live 缓冲保留时间ORIGIN 属于哪个域@ 代指域IN 开头需要空格SOA 一行记录类型的开始参数:forwarders {} 指向自己无法解析的域名跳转到 ...

  4. icon font

    简而言之,就是: 使用 特殊字符 + (使用@font-face)自定义的字体 来代替图片文件显示图标. 关于@font-face, 参考来自W3CPLUS 的详细解释: css3 @font-fac ...

  5. 武汉科技大学ACM :1008: 小t和小w

    Problem Description 小t最近学了C语言,他想要在女朋友小w面前展示一下自己的能力,小w喜欢如样例所示的图形, 想让小t写一个程序来输出这样的图形,小t拿到后感觉有点困难,小t不想在 ...

  6. CIPAddressCtrl控件

    CIPAddressCtrl m_ipCtrl; 1.获取控件IP值 int GetAddress(byte& byteFirst, byte& byteTwo, byte& ...

  7. linux初识-01简介

    什么是linux: Linux是一个自由的,免费的,源码开发的操作系统Linux的特点: 开放性.多用户,多任务,具有丰富的网络功能 可靠的系统安全 良好的可移植性 良好的用户界面(命令界面和图形界面 ...

  8. python3.5文档

    https://docs.python.org/3.5/tutorial/modules.html#packages

  9. 基于PHP和mysql的自动生成表单

    开发背景:公司要求管理系统能够由管理员在前台页面管理系统表单,能够对表单进行增删改查基本操作,表单的各个字段都可以被修改.删除,可以添加新的字段,并且不影响系统正常运行,前台表单展示要由系统自动处理, ...

  10. 使用 phpMyAdmin无法登录mysql的问题

    今天使用使用phpmyadmin时出现了以下错误: (1)第一次时: 当配置文件config.inc.php里的配置项是: $cfg['Servers'][$i]['host'] = 'localho ...