Question

我有一个文本输入框，无论出于何种原因，输入框中的文本都会显示在底部

input {
	padding-top: 100px;
	width: 500px;
}

input[type=text] {
	border: 2px solid darkgrey;
	border-radius: 10px;

<input type='text'/>

谢谢。

Answer 1

如果要保持高度或除去padding-top，请用padding-bottom替换padding-top。谢谢

Answer 2

从padding-top: 100px;代码中删除padding-bottom:100px;并替换为css，问题就解决了，因为在文本输入框的底部输入了padding-top。

input {
	padding-bottom: 100px;
	width: 500px;
}

input[type=text] {
	border: 2px solid darkgrey;
	border-radius: 10px;

<input type='text'/>

Answer 3

您的padding-top引起了这种情况。将其设置为较小的值，例如10px。

Answer 4

请从CSS代码中删除padding-top: 100px;。如果要保持高度，请设置height或padding-bottom。

Answer 5

input {
	padding-bottom: 100px;
	width: 500px;
}

input[type=text] {
	border: 2px solid darkgrey;
	border-radius: 10px;

<input type='text'/>

Answer 6

删除<ng-template [ngIf]="($eventsCount | async) > 0"> <a href="" *ngIf="!($isClosing | async)" class="btn--danger" confirm="Are you sure?" (confirmed)="onCloseAll()"> Close All </a> </ng-template>或使用相同的<ng-template [ngIf]="($eventsCount | async) > 0"> <a href="" *ngIf="!($isClosing | async)" class="btn--danger" confirm="Are you sure?" (confirmed)="onCloseAll()"> Close All </a> </ng-template>和padding-top，您还可以使用padding-top属性

padding-bottom

或

height

这些代码以文本为中心。如果您想顶部使用input { padding: 100px 0; width: 500px; }属性

input {
    height: 100px;
    width: 500px;
}

Answer 7

使用padding：15px;而不是padding-top，它是引导程序或任何其他框架中的标准填充，如果您想使用大输入框，请使用textarea，如果要增加高度，则增加行值，或者可以通过CSS调整高度也是

Answer 8

是padding-top造成此问题。如果希望扩大输入字段，请使用height和width代替padding。当然，这取决于您要实现的目标。如果您想增大输入字段并使文本显示在该字段的中间，则可以执行以下操作：

input {
	height: 100px;
	width: 500px;
        text-align: center;
}

input[type=text] {
	border: 2px solid darkgrey;
	border-radius: 10px;
}

<input type='text'/>

阻止文本显示在文本输入框的底部

8 个答案: