如何在密码类型的输入元素中设置文本位置？答案

【问题标题】：How can you set text positon within an input element of type password?如何在密码类型的输入元素中设置文本位置？
【发布时间】：2015-05-07 01:17:56
【问题描述】：

我有一个input type="password" 对象，我需要显示一个过大的密码字体。

我无法让密码点正确居中和间隔。我在下面发布的 jsfiddle 中有一个简化版本。

padding-bottom 不起作用，因为在我的情况下，它只是删除了部分点并且不会向上移动。我也试过line-height 无济于事。

我指的是当我增大尺寸时密码点在输入元素中的位置较低。如果我填充底部，它会删除部分点，但我只需要将它们稍微向上移动。

同样针对其他答案，将输入大小的高度设置为字体大小将不起作用，因为这会使输入太大。我需要使密码点比它们的初始大小大得多，但不要使输入更大。当我更改大小时，它会将点向下推，我需要将它们带回到较小框中的中心，但不使用padding-bottom。

.myPasswordStyle
{
    height: 40px;
    font-size: 50px;
}
<input type="password" class="myPasswordStyle">

【问题讨论】：

【解决方案1】：

你可以去掉 height 属性，让字体大小设置输入的高度：

.myPasswordStyle {
    font-size: 50px;
}

当它是密码字段时，添加一点底部填充会使它看起来更垂直对齐，即

.myPasswordStyle {
    font-size: 50px;        
    padding-bottom:5px;
}

【讨论】：