html - 在中心 css 中对齐内容

标签 html css

如何居中对齐内容?

目前是页眉文本

登录/密码输入字段
没有居中对齐,单独对齐

例子:
“标题 1”
“标题 2”
.....“登录”
.....“密码”
....“按钮”

标题字段:

<body>
    <div class="headerLogo" align="center">
        <img src="images/login.png"><br><br><br>
        <h1 class="form-signin-heading">
            <b>header1header1</b>
        </h1>
        <h3 class="form-signin-heading">
            headerheader2
        </h3>
    </div><br><br><br><br><br>

登录输入字段:

    <div class="container">
    <form class="form-signin" method="Post">
        <input type="text" id="email" class="form-control"  placeholder="email"> 
        <input type="password" id="password" class="form-control" placeholder="pwd"> 
        <label class="checkbox"> 
        <input type="checkbox" value="remember-me">
            Keep Login
        </label>
        <button class="btn btn-lg btn-info btn-block" type="submit">
            <b>로그인</b>
        </button>
        <div class="row">
            <div class="col-md-6">
            <a class="btn btn-lg btn-primary btn-block"><b>Email Join</b></a>
        </div>

        <div class="col-md-6">
            <a class="btn btn-lg btn-primary btn-block"><b>Find Password</b></a>
        </div>
        </div>
        </form>
    </div>
</body><!-- /container -->

最佳答案

仅在浏览器范围内不支持居中占位符文本。对于 safari 和 mozilla(似乎适用于 chrome),您可以使用:

::-webkit-input-placeholder {
    text-align:center;
}
input:-moz-placeholder {
    text-align:center;
}

DEMO

如果您同意用户输入的文本居中也可以使用:

input {
    text-align:center;
}

编辑:我假设您正在使用 Bootstrap 。

关于html - 在中心 css 中对齐内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23233319/

相关文章:

javascript - 浏览器不支持我在 asp.net 中的字体

html - 如何使用 calc 正确设置动态高度?

html - 打开/关闭模态时防止内容移动

html - Eclipse css 内容辅助( Bootstrap )

css - 是否可以使用 CSS calc() 获得负值?

html - 内联元素不会与其他内联图像一起休息

javascript - 类似 ipad 的 html 滚动组件

javascript - ARIA 让读者阅读非重点元素内容

Javascript 特异性(仅响应单击的项目)

python - 如何在解析 html 表时忽略 th 标签?