div css水平垂直居中
<!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水平垂直居中的更多相关文章
- css的div动态水平垂直居中
div动态水平垂直居中,思路如下: (1)先定位.如果相对于距离最近的父元素,用absolute:如果相对于body,用fixed. (2)然后,top和left都设为50%. (3)要居中的di ...
- CSS水平垂直居中总结
行内元素水平居中 把行内元素包裹在块级父元素中,且父元素中的css设置text-align:center; <!DOCTYPE html> <html> <head> ...
- 常见的几种 CSS 水平垂直居中解决办法
用CSS实现元素的水平居中,比较简单,可以设置text-align center,或者设置 margin-left:auto; margin-right:auto 之类的即可. 主要麻烦的地方还是在垂 ...
- css3 flex 详解,可以实现div内容水平垂直居中
先说一下flex一系列属性: 一.flex-direction: (元素排列方向) ※ flex-direction:row (横向从左到右排列==左对齐) ※ flex-direction:row- ...
- div盒子水平垂直居中方法
文章转载自:div盒子水平垂直居中的方法 - 雪明瑶 这个问题比较老,方法比较多,各有优劣,着情使用. 一.盒子没有固定的宽和高 方案1.Transforms 变形 这是最简单的方法,不仅能实现绝对居 ...
- div盒子水平垂直居中的方法推荐
父盒子是position:relative 方法一:(宽高确定) div绝对定位水平垂直居中[margin 负间距], 方法二: (宽高确定) div绝对定位水平垂直居中[margin:auto实现绝 ...
- CSS：div/img水平垂直居中
div水平垂直居中方法一: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...
- css中：如何让一个图片（不知道宽高，宽高可能比父元素div大），在父元素div内部水平垂直居中，并且不溢出父元素div，且图片不拉伸变形（可等比例缩小）？
欢迎进入:http://www.jscwwd.com/article/list/%E5%85%A8%E9%83%A8 效果图: 不管父元素的宽高怎么变化,图片都是水平垂直居中的,并且不溢出父元素. 注 ...
- css水平垂直居中对齐方式
1.文字或者内联元素的垂直水平居中对齐 css属性 -- 水平居中:text-aligin:center; 垂直居中: line-height:height; 例子:. html: <div c ...
随机推荐
- 第一个ASP.NET MVC应用程序
首先打开vs2015 文件->新建->项目 选择模版选empty,下面[为下项添加文件夹和核心引用]勾选mvc 点击确定就好
- Codeforces Round #356 (Div. 2) A. Bear and Five Cards 水题
A. Bear and Five Cards 题目连接: http://www.codeforces.com/contest/680/problem/A Description A little be ...
- Codeforces Round #298 (Div. 2) D. Handshakes 构造
D. Handshakes Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/534/problem ...
- java_线程的几种状态
java thread的运行周期中, 有几种状态, 在 java.lang.Thread.State 中有详细定义和说明: NEW 状态是指线程刚创建, 尚未启动 RUNNABLE 状态是线程正在正常 ...
- Linux新内核：提升系统性能 --Linux运维的博客
http://blog.csdn.net/linuxnews/article/details/52864182
- Apple Developer Registration and DUNS Number Not Accepted
Now that I have my Mac and app source code. I’m ready to start working on my first app. The next ste ...
- Inside Portable Class Libraries
Portable Class Libraries were introduced with Visual Studio 2010 SP1 to aid writing libraries that c ...
- VisualSVN Server 修改用户密码
VisualSVN Server是非常方便好用的SVN服务器端软件,但有个问题,你在服务器端创建了用户名密码后,用户无法自己修改密码,据说VisualSVN的客户端可以修改用户密码,但客户端是收费软件 ...
- mac 拷贝文件时报错 8060 解决方案
解决如下: 即某文件夹下出现多重子目录,级数很多,删除多余的子文件夹即可. 至于如何产生的,有人说是xcode升级导致,不过没有见证 .我的不属于这类情况的. (参见:http://macosx.co ...
- android中反射机制
本文介绍Android反射机制实现与原理,在介绍之前,要和Java进行比较,所以先看下Java中的反射相关知识: 一.反射的概念及在Java中的类反射 反射主要是指程序可以访问.检测和修改它本身状态或 ...