div居中的三种方法
方法1：
#div1{
width:200px;
height:200px;
background:green;
position:absolute;
left:0;
top:0;
right:0;
bottom:0;
margin:auto;
}
方法2：
#div1{
width:400px;
height:400px;
background:green;
position:absolute;
left:50%;
top:50%;
margin:-200px 0 0 -200px;
}
方法3：
#div1{
display:table-cell;
text-align:center;
vertical-align:middle;
}//图片的居中方法
div居中的三种方法的更多相关文章
- 实现DIV居中的几种方法
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- div盒子中子元素（子元素可能是盒子， 图片） 中居中的三种方法
- DIV居中的几种方法
1. body{ text-align:center; } 缺点:body内所有内容一并居中 2. .center{ position: fixed; left: 50%; } 缺点:需要设置posi ...
- div居中的几种方式
摘自:https://www.cnblogs.com/ones/p/4362531.html DIV居中的几种方法 1. 1 body{ 2 text-align:center; 3 } 缺点:b ...
- 让一个图片在div中居中（四种方法）
第一种方法: <div class="title"> <div class="flag"></div> <div cl ...
- CSS教程:div垂直居中的N种方法以及多行文本垂直居中的方法
在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...
- div垂直居中的几种方法
CSS教程:div垂直居中的N种方法[转](原文地址:http://www.cnblogs.com/chuncn/archive/2008/10/09/1307321.html) 在说到这个问题的时候 ...
- CSS教程:div垂直居中的N种方法[转]
在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...
- CSS围住浮动元素的三种方法
浮动元素脱离了文档流,其父元素看不到它了,因而不会包围它.浮动会“扩散”到下一个清除浮动的元素处.这会引起不想要的页面布局效果. 清除浮动的方法有三种: 1.父元素overflow:hidden 2. ...
随机推荐
- Web API-如何将Controller的返回值转换成HTTP response消息
https://www.asp.net/web-api/overview/formats-and-model-binding/json-and-xml-serialization https://co ...
- unity3d实现序列帧动画
首先准备一个序列帧图片如下的AngryBird: 场景中随便创建一个物体,这里以Cube为例 将图片拖放到Cube上,这样会在Cube的6各面都有3个bird,为了美观显示一个鸟,我们调整材质的Til ...
- 玩一个：可以显示任何xml树结构的xaml定义
学习中, 玩一玩. 效果如下.Xaml随后. <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentatio ...
- 0R电阻作用
0欧电阻的作用(网上收集整理的) 0欧的电阻大概有以下几个功能: ①做为跳线使用.这样既美观,安装也方便. ②在数字和模拟等混合电路中,往往要求两个地分开,并且单点连接.我们可以用一个0欧的电阻来 ...
- 输入一个整数n，求从1到n这n个整数的十进制表示中1出现的次数
题目:输入一个整数n,求从1到n这n个整数的十进制表示中1出现的次数.例如输入12,从1到12这些整数中包含1 的数字有1,10,11和12,1一共出现了5次. 分析:首先最先想到的是遍历从1到n的每 ...
- bzoj 1412 [ZJOI2009]狼和羊的故事（最小割）
[题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=1412 [题意] 在一个n*m的格子中,将羊和狼隔开的最小代价. [思路] 最小割. 由 ...
- 一个简单的创建圆角图像的UIImage扩展实现
- (UIImage *)roundedCornerImageWithCornerRadius:(CGFloat)cornerRadius { CGFloat w = self.size.width; ...
- 配dump文件
ulimit -c unlimited echo 'ulimit -c unlimited' >>/etc/profile
- React-native 中的触摸响应功能
我们在做APP的时候,与桌面应用系统不同的是触摸响应. web页面对触摸响应的支持和原生的APP有着很大的差异. 基本用法 componentWillMount: function() { this. ...
- 使用CATransition实现页面的“从左向右” “从右向左”的动画
-(void)initView{ UISwipeGestureRecognizer *left_gesture=[[UISwipeGestureRecognizer alloc]initWithTar ...