<!DOCTYPE html>
<html> <head>
<meta charset="utf-8">
<title></title>
<style>
body {
padding: 0;
margin: 0;
} /*垂直居中*/
.box {
width: 1200px; /*图片宽*/
height: 650px; /*图片高*/
position: absolute;
left: 50%;
top: 50%;
margin-left: -600px;/* 宽/2 */
margin-top: -325px; /* 高/2 */
}
</style>
</head> <body>
<div class="box">
<img src="img/luomu_02_02.png" />
</div>
</body> </html>

@落雨

http://ae6623.cn

效果:

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

  1. css的div动态水平垂直居中

      div动态水平垂直居中,思路如下: (1)先定位.如果相对于距离最近的父元素,用absolute:如果相对于body,用fixed. (2)然后,top和left都设为50%. (3)要居中的di ...

  2. CSS水平垂直居中总结

    行内元素水平居中 把行内元素包裹在块级父元素中,且父元素中的css设置text-align:center; <!DOCTYPE html> <html> <head> ...

  3. 常见的几种 CSS 水平垂直居中解决办法

    用CSS实现元素的水平居中,比较简单,可以设置text-align center,或者设置 margin-left:auto; margin-right:auto 之类的即可. 主要麻烦的地方还是在垂 ...

  4. css3 flex 详解,可以实现div内容水平垂直居中

    先说一下flex一系列属性: 一.flex-direction: (元素排列方向) ※ flex-direction:row (横向从左到右排列==左对齐) ※ flex-direction:row- ...

  5. div盒子水平垂直居中方法

    文章转载自:div盒子水平垂直居中的方法 - 雪明瑶 这个问题比较老,方法比较多,各有优劣,着情使用. 一.盒子没有固定的宽和高 方案1.Transforms 变形 这是最简单的方法,不仅能实现绝对居 ...

  6. div盒子水平垂直居中的方法推荐

    父盒子是position:relative 方法一:(宽高确定) div绝对定位水平垂直居中[margin 负间距], 方法二: (宽高确定) div绝对定位水平垂直居中[margin:auto实现绝 ...

  7. CSS:div/img水平垂直居中

    div水平垂直居中方法一: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  8. css中:如何让一个图片(不知道宽高,宽高可能比父元素div大),在父元素div内部水平垂直居中,并且不溢出父元素div,且图片不拉伸变形(可等比例缩小)?

    欢迎进入:http://www.jscwwd.com/article/list/%E5%85%A8%E9%83%A8 效果图: 不管父元素的宽高怎么变化,图片都是水平垂直居中的,并且不溢出父元素. 注 ...

  9. css水平垂直居中对齐方式

    1.文字或者内联元素的垂直水平居中对齐 css属性 -- 水平居中:text-aligin:center; 垂直居中: line-height:height; 例子:. html: <div c ...

随机推荐

  1. luoguP4036 [JSOI2008]火星人 平衡树+hash

    这个操作十分的复杂 但是可以拿平衡树维护 直接二分答案然后用$hash$值判断即可 复杂度$O(10000 * log^2 n + n \log n)$ #include <cstdio> ...

  2. BZOJ 2333: [SCOI2011]棘手的操作 可并堆 左偏树 set

    https://www.lydsy.com/JudgeOnline/problem.php?id=2333 需要两个结构分别维护每个连通块的最大值和所有连通块最大值中的最大值,可以用两个可并堆实现,也 ...

  3. [Visual Studio] SOA服务框架搭建

    1.服务框架搭建 2.服务模板创建 3.Nuget引用 4.客户端调用 任务点: 1.分析SOA 2.修改SOA架构名称以及关键字 3.使用Nuget添加引用 4.选择服务模板进行创建 5.尝试调用 ...

  4. "Blessing of Dimisionality: High Dimensional Feature and Its Efficient Compression for Face Verification"学习笔记

    这\(^{[1]}\)是一篇关于如何使用高维度特征在人脸验证中的文章,作者以主要LBP为例子,论述了高维特征和验证性能存在着正相关的关系,即人脸维度越高,验证的准确度就越高.由于那时候没有用DeepL ...

  5. 解决 git push Failed to connect to 127.0.0.1 port 45463: 拒绝连接

    使用Github pull 代码突然报错: Failed to connect to 127.0.0.1 port 43421: Connection refused 使用 lsof 发现端口未被占用 ...

  6. poj 1279 Art Gallery - 求多边形核的面积

    /* poj 1279 Art Gallery - 求多边形核的面积 */ #include<stdio.h> #include<math.h> #include <al ...

  7. 在当前的webview中跳转到新的url 使用WebView组件显示网页

    如果希望点击链接由自己处理,而不是新开Android的系统browser中响应该链接.给WebView加一个事件监听对象(WebViewClient)并重写其中的一些方法:shouldOverride ...

  8. Tasker to answer incoming call by pressing power button

    nowadays, the smartphone is getting bigger in size, eg. samsung galaxy note and note 2, sorta big in ...

  9. ob_start()、ob_end_flush和ob_end_clean()多级缓冲

    ob_start() 和 ob_end_flush() 是一对很好的搭档,可以实现对输出的控制.当成一对出现理解起来就没什么问题,但是当他们两个各自出现次数增加时,就比较难理解了. <?php ...

  10. VS2010发布网站