文章/答案/技术大牛

发布

社区首页 >问答首页 >如何使用css中的边距属性将Div元素放在中心

问如何使用css中的边距属性将Div元素放在中心
EN

Stack Overflow用户

提问于 2014-01-31 17:45:33

回答 2查看 74关注 0票数 0

我想在中间有一个文本框。我尝试使用下面的代码。但它并没有把它放在中心位置。输出的图像也可以在下面找到。请通过指出代码中的错误来帮助我。

<html>

<head>

<style>

#form
{
    margin-top:40%;
    margin-left:40%;
}

</style>


</head>

<body>

<div id="form">

    <form method = "post" action = "test.htm" >
    UserName: <input type="text" name = "username" />   
    </form>
</div>

</body>

</html>

上面代码的输出结果是：

html

css

回答 2

Stack Overflow用户

发布于 2014-01-31 18:02:42

您可以使用下面的css代码使文本框在水平和垂直方向居中。

#form {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
    width: 100px;
    height: 100px;
}

票数 2

Stack Overflow用户

发布于 2014-01-31 17:46:08

这就是你要的。

CSS更改：

div#form form {
    background: none repeat scroll 0 0 #808080;
    display: block;
    height: 100px;
    line-height: 100px;
    margin: 0 auto;
    text-align: center;
    vertical-align: middle;
    width: 100%;
}

希望这能有所帮助。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/21476827

复制

相似问题

问如何使用css中的边距属性将Div元素放在中心
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用css中的边距属性将Div元素放在中心EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用css中的边距属性将Div元素放在中心
EN