如何调整在HTML输入表单 [英] How to align input forms in HTML
问题描述
我是新来的HTML和我想学习如何使用形式。
我有迄今为止最大的问题是调整的形式。这是我目前的HTML文件的例子：
＆LT;形式GT;
名字：＆LT;输入类型=文本名称=第一＆GT;＆LT; BR /＆GT;
姓氏：其中;输入类型=文本名称=最后一个＆GT;＆LT; BR /＆GT;
电子邮件：LT;输入类型=文本名称=电子邮件＆GT;＆LT; BR /＆GT;
＆LT; /形式GT;
这里的问题是，相对于第一和最后一个名称电子邮件后场箱是在间距方面截然不同。什么是适当的方式，使之让他们'阵容'本质？
我想练的好形式和语法......很多人可能做到这一点利用CSS我不知道，我只学会了HTML的最基础的这么远。</ P>
另外一个例子，这使用CSS，我干脆把形式与容器类股利。和指定包含在输入的元素是为容器宽度的100％，而不是对任何一方的元素
＆LT; HTML＆GT;
＆LT; HEAD＆GT;
＆LT;标题物实施例的形式和LT; /标题＆GT;
＆LT;风格类型=文本/ CSS＆GT;
。容器 {
宽度：500px的;
明确：两个;
}
.container输入{
宽度：100％;
明确：两个;
}
＆LT; /风格＆GT;
＆LT; /头＆GT;
＆LT;身体GT;
＆LT; DIV CLASS =容器＆GT;
＆LT;形式GT;
＆LT;标签＆gt;名字＆LT; /标签＆gt;
＆LT;输入类型=文本名称=第一＆GT;＆LT; BR /＆GT;
＆LT;标签＆gt;姓＆LT; /标签＆gt;
＆LT;输入类型=文本名称=最后一个＆GT;＆LT; BR /＆GT;
＆LT;标签＆gt;电子邮件和LT; /标签＆gt;
＆LT;输入类型=文本名称=电子邮件＆GT;＆LT; BR /＆GT;
＆LT; /形式GT;
＆LT; / DIV＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
I'm new to HTML and I'm trying to learn how to use forms.
The biggest issue I am having so far is aligning the forms. Here is an example of my current HTML file:
<form>
First Name:<input type="text" name="first"><br />
Last Name:<input type="text" name="last"><br />
Email:<input type="text" name="email"><br />
</form>
The problem with this is, the field box after 'Email' is drastically different in terms of spacing compared to first, and last name. What is the 'proper' way to make it so that they 'line-up' essentially?
I am trying to practice good form and syntax...a lot of people might do this with CSS I am not sure, I have only learned the very basics of HTML so far.
Another example, this uses CSS, i simply put the form in a div with the container class. And specified that input elements contained within are to be 100% of the container width and not have any elements on either side.
<html>
<head>
<title>Example form</title>
<style type="text/css">
.container {
width: 500px;
clear: both;
}
.container input {
width: 100%;
clear: both;
}
</style>
</head>
<body>
<div class="container">
<form>
<label>First Name</label>
<input type="text" name="first"><br />
<label>Last Name</label>
<input type="text" name="last"><br />
<label>Email</label>
<input type="text" name="email"><br />
</form>
</div>
</body>
</html>
这篇关于如何调整在HTML输入表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
