61,127
社区成员
发帖
与我相关
我的任务
分享请发表友善的回复…
发表回复
shiyuzjhm 2016-10-17
- 打赏
- 举报
自从用了 notepad++之后就再也不喜欢DW了。
vertical-align:center 垂直居中
text-align:center 水平居中
web_emmet 2016-10-14
- 打赏
- 举报
3楼的方法是可行的，在设置上下居中时，必须有一个参照物才能设置图片上下居中。vertical-align是必要的属性。
而5楼的方法也ok，只是在设置定位时，你要给图片的父元素也设置定位，因为，定位时，绝对定位absolute是相对它最近的有定位的父元素进行定位的，定位的方法更好理解，例如：
这是图片的img标签,在设置定位后，margin-left和margin-top各自设定img标签本身width和height负数的一半。
img{width:100px; height:100px; background:#ccc; position:absolute; left:50%; top:50%; margin-left:-50px; margin-top:-50px; }
这是img的父标签，它的定位一般用相对定位relative就好
div{width:200px; height:200px; background:#000; position:relative;}
希望你越来越好！
deepthan 2016-10-12
- 打赏
- 举报
两种方法：
1） 设置
position:absolute; left:50%; top:50%; margin-top:height*50%; margin-left:width*50%;
2) 设置：
position:absolute; top:0; right :0; bottom:0; left:0 ; margin:auto;
deepthan 2016-10-12
- 打赏
- 举报
两种方法：
1） 设置
position:absolute;
left:50%;
布尔凯索LST 2016-10-11
- 打赏
- 举报
咦看错了 我把DW看成DIV了 尴尬
布尔凯索LST 2016-10-11
- 打赏
- 举报
vertical-align center 给图片设置这个 图片垂直居中
给div套text-align：center 水平居中
记得要加个display: table-cell;
Y_official 2016-10-11
- 打赏
- 举报
左右居中用定位 position与margin
上下用span 作对比
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>test2</title>
<style type="text/css">
.box{ width: 200px; height: 200px;
position: relative;
border:10px solid #000;
background: #ccc;}
.box span{ display: inline-block;
height: 100%; width: 0;
vertical-align: middle; }
.box .img_1{ width: 57px; height: 65px;
position: absolute;
top: 50%; left: 50%;
margin-top: -33px;
margin-left: -29px;
vertical-align: middle; }
</style>
</head>
<body>
<div class="box">
<span></span><!-- 与图片做对比 -->
<img class="img_1" src="hr_50.gif" alt="ad" title="ad" />
</div>
</body>
</html>
