HTML网页编程的CSS中关于margin-top和margin-bottom的问题

<head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title>无标题文档</... <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
.main{
background:#000;
width:300px;
height:400px;
margin:auto;
}
.up{
border:2px solid #C0F;
padding:5px;
background:#FFF;
margin-left:auto;
margin-right:auto;
margin-top:336px;
height:50px;
width:100px;
}</style>
</head>
<body><div class="main">
<div class="up">向下对齐</div>
</div>
</body>

如图,在DW中显示已经向下对齐,但在浏览器显示中却是

请高手帮忙看下是什么问题?求解答。
展开
 我来答
racher24
推荐于2017-10-13 · TA获得超过548个赞
知道小有建树答主
回答量:1295
采纳率:0%
帮助的人:947万
展开全部
<head>

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

<title>无标题文档</title>

<style type="text/css">

.main{

background:#000;
width:300px;
height:400px;
margin:auto;
text-align:center;
position:relative;

}

.main .up{

border:2px solid #C0F;

padding:5px 5px;
background:#FFF;

position:absolute;
top:336px;
left:100px;

height:50px;
width:100px;

}

</style>
</head>

<body>

<div class="main">

<div class="up">向下对齐</div>

</div>
</body>
追问
我知道父类采用了position后,子类中就可以利用left,right,top,这些来进行定位。 
但是为什么不能用margin-top和margin-bottom来进行垂直方向的定位呢?
本回答被提问者和网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
丹丹爱编程
2012-09-24
知道答主
回答量:53
采纳率:0%
帮助的人:9.2万
展开全部
如果父元素中没有定上外边距margin-top的话,子元素定了上外边距,那么父元素和子元素的上外边距会重合。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
jianan19860
2012-09-20 · TA获得超过661个赞
知道小有建树答主
回答量:750
采纳率:0%
帮助的人:446万
展开全部
我觉得你可以用绝对定位来做比较好控制一点,用margin-top它也有一定的值,而且这个值是相对于父元素的上边距。可以考虑用绝对定位的方式去实现。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
木是妮可
2012-09-20 · 超过45用户采纳过TA的回答
知道小有建树答主
回答量:200
采纳率:0%
帮助的人:121万
展开全部
<head>

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

<title>无标题文档</title>

<style type="text/css">

.main{
background:#000;
width:300px;
height:400px;
margin:0 auto;
text-align:center;
vertical-align:bottom;
position:relative;
}

.up{
border:2px solid #C0F;
text-align:center;
background:#FFF;

height:100px;
width:100px;
position:absolute;
bottom:0px;

}

</style>
</head>

<body>

<div class="main">

<div class="up">向下对齐</div>

</div>
</body>
你看看我这个的
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
BUG集散地
2012-09-20 · TA获得超过1317个赞
知道小有建树答主
回答量:625
采纳率:80%
帮助的人:288万
展开全部
浏览器的问题吧 ,用IE的话应该可以的,我试过了。但是用谷歌的就是你说的那样了..其他浏览器不晓得怎么样..
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(3)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式