<!DOCTYPE html>

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

 <title>div元素上下左右居中</title>

 <style type="text/css">

 .divp{ width:300px; height:300px; background:#ccc; margin:0 auto; position:relative;}

 .div1{ width:100px; height:100px; background:pink; margin:auto; position:absolute; top:0px; right:0px; bottom:0px; left:0px;}

 </style>

 </head>

 <body>

 <div class="divp">

 <div class="div1"></div>

 </div>

 </body>

 </html>

div元素上下左右居中的更多相关文章

  1. 使一个div元素上下左右居中

    第一种方法 浮动流自我调节 .box{ widht:200px; height:200px; position:relative; } .box .son{ width:100px; height:1 ...

  2. CSS 控制元素 上下左右居中

    不说废话,直接 搞起..... 首先,我们将题目 <css控制元素上下左右居中> 分析一下哈,我是将其分成了4部分信息: 1.CSS控制: 只用 CSS 来达成目的 2.元素:  不只是d ...

  3. div层上下左右居中

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. css 宽高自适应的div 元素 如何居中 垂直居中

    在我们 编写css 样式的时候经常会遇见一个问题 那就是一个 宽高未知的元素 要让他 垂直居中如何实现这个呢 下面是我常用的两种方法 上代码 下面的是 结构代码 <div class=" ...

  5. div内容上下左右居中

    <!-- 遮罩层 --> <div id="test" > <div style="position:absolute;top:50%;le ...

  6. 多行文字在一个div中上下左右居中

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. css div图片上下左右居中

    <style type="text/css"> div{border:1px solid #ccc;height:500pc;width:500px;text-alig ...

  8. css：子元素div 上下左右居中方法总结

    最近在面试,不停地收到了知识冲击,尤其是对于一些基础的css.html.js问题居多,所以自我也在做反思,今天就css问题,如何让一个子元素div块元素上下左右居中 (以下总结方法,都已得到验证). ...

  9. 用CSS让DIV上下左右居中的方法

    转载自喜欢JS的无名小站 例如 一个父div(w:100%;h:400px)中有一个子div(w:100px;100px;).让其上下左右居中. 方法一(varticle-align) 理念 利用表格 ...

随机推荐

  1. 使用 Cordova+Visual Studio 创建跨平台移动应用（1）

    1简介 本章节是关于Visual Studio Tools for Apache Cordova的,目前此产品只发布了预览版.Visual Studio for Apache Cordova帮助熟悉V ...

  2. 【rman，1】经典案例增量备份

    一.备份策略: 1.星期天晚上      -level 0 backup performed(全备份) 2.星期一晚上      -level 2 backup performed 3.星期二晚上   ...

  3. poj2386 Lake Counting（简单DFS）

    转载请注明出处:viewmode=contents">http://blog.csdn.net/u012860063?viewmode=contents 题目链接:http://poj ...

  4. ubuntu nginx安装及相关linux性能參数优化

    一.安装 下载源代码,解压:tar -xzvf nginx-1.4.7.tar.gz ./configure make && make install 改动默认nginx的监听port ...

  5. JAVA学习 分析Servlet

    一个.什么是Servlet Servlet是一种在server端执行的java编写的程序,是依照Servlet规范编写的一个java类. 二.Servlet的工作过程 如图所看到的:为了实现客户与se ...

  6. POJ3061 Subsequence(二进制前缀和法律+仿真足)

    二分法+前缀和法律 满足子序列长度的条件(0,n)之间,sum[x+i]-sum[i]从i元素开始序列长度x和.前缀和可在O(n)的时间内统计 sum[i]的值.再用二分找出满足条件的最小的子序列长度 ...

  7. hdu 3076 ssworld VS DDD (概率dp)

    ///题意: /// A,B掷骰子,对于每一次点数大者胜,平为和,A先胜了m次A赢,B先胜了n次B赢. ///p1表示a赢,p2表示b赢,p=1-p1-p2表示平局 ///a赢得概率 比一次p1 两次 ...

  8. SQL于union, EXCEPT 和 INTERSECT用法

    这三个放在一起是有道理的,因为它们运行两个或两个以上的结果集,而这些结果对例如设置以下限制: 列的数目和所有查询必须是相同的列顺序.  数据类型必须兼容.  而且它们都是处理于多个结果集中有反复数据的 ...

  9. ssl通关的概念（一个）

    在公司最近的项目涉及多种加密.安全.我一直在这方面缺乏经验.很协议仅仅知道是什么概念.用于传输的加密SSL,也煞费苦心.非常easy一件事,折腾了很长一段时间.IT该行啊,真的是.难者不会,与会者困难 ...

  10. 设计模式--简单工厂VS工厂VS抽象工厂

    前几天我一直在准备大学毕业生,始终绑起来,如今,终于有时间去学习设计模式.我们研究今天的话题是植物三口之家的设计模式的控制--简单工厂VS工厂VS抽象工厂. 经过细心推敲,我们不难得出:工厂模式是简单 ...