Question

以下是我的表单应如何显示的图像：http://i.imgur.com/myZOCqJ.jpg 我把所有的东西都搞定了，除了我不能在某些线条之后让*显示为红色，以及如何在中心水平对齐输入字段和输入名称？

Answer 1

您可以像上面提到的那样使用表格，或者您可以这样做：

            <div>
                <!-- container for one row, ie the 'First Name' label and its text input box -->
                <div class="row">
                    <!-- the label (ie 'First Name') has its own div and the Name text box has its own div. Doing this makes it possible to left align the labels properly and align the text boxes properly -->
                    <div class="left-side"><p>First Name:</p></div>
                    <div class="right-side"><p><input type="text" class="textbox"/></p></div>
                </div>
                <div class="row">
                    <div class="left-side"><p>Last Name:<p></div>
                    <div class="right-side"><p><input type="email"  class="textbox"/></p></div>
                </div>
                <div class="row">
                    <div class="left-side"><p>Student ID:<p></div>
                    <div class="right-side"><p><input type="text"  class="textbox"/></p></div>
                </div>
            </div>

以及整个表格等等。

然后在你的css中设置left-side类，其宽度为

text-align: right;

并为right-side类设置了一些宽度和

text-align:left;

对于每个文本框后面的红色*，请尝试将此代码放在每个文本输入框之后：

<span class="redStar">*<span>

并添加以下css类：

.redStar {
    color: red;
}

如何在css中对齐输入字段？

1 个答案: