我有这个非常简单的表单，但我在使用 css 时遇到了问题。不知何故，这 3 个标签并没有一直扩展到左侧(表格边界)。 html代码
<!doctype html>
<html lang="en">
<head>
<title>Form Validation</title>
<script type="text/javascript" src="../jquery_lib/jquery-1.11.0.min.js"></script>
<link type="text/css" rel="stylesheet" href="stylesheet.css" />
<script type="text/javascript" src="animation.js"></script>
<script type="text/javascript" src="validation.js"></script>
<script>
</script>
</head>
<body>
<!-- Insert your content here -->
<h1>The Form</h1>
<form id="myForm" name="myForm" onsubmit="return validateForm()">
<ul>
<li class="title">Who Are You?</li>
<li class="fields">
<label>*First Name:</label><br/>
<input id="firstName" class="req" type="text" /><br/>
<label>Last Name:</label><br/>
<input id="lastName" type="text" /><br/>
<label>*Email:</label><br/>
<input id="email" class="req" type="text" /><br/>
</li>
<li class="title">Where Are You?</li>
<li class="fields">
<label>City:</label><br/>
<input id="city" type="text" /><br/>
<label>*State:</label><br/>
<input id="state" class="req" type="text" /><br/>
<label>Country</label><br/>
<input id="country" type="text" /><br/>
</li>
<li class="title">What Do You Do?</li>
<li class="fields">
<label>*Occupation:</label><br/>
<input id="occupation" class="req" type="text" /><br/>
<label>Company:</label><br/>
<input id="company" type="text" /><br/>
<label>Location:</label><br/>
<input id="location" type="text" /><br/>
</li>
</ul>
<input id="button" type="submit" value="Submit Form" />
</form>
</body>
</html>
这是CSS
/* form validation styling */
* {
margin: 0 auto;
}
body {
/*background: #ddd;*/
}
h1 {
background: brown;
width: 500px;
/*height: 100px;*/
text-align: center;
padding: 20px 0;
}
#myForm {
width: 500px;
/*text-align: center;*/
border: 1px solid black;
background: #eee;
/*margin: auto 0;*/
}
li.title {
line-height: 2em;
cursor: pointer;
font-weight: bold;
background: #5A893C;
border-top: 1px white solid;
border-bottom: 1px white solid;
height: 40px;
text-align: center;
}
li.fields {
margin: 0;
padding: 5px;
}
li {
list-style: none;
}
#button {
margin: 0px auto 10px 40px;
}
.hide {
display: none;
}
最佳答案
关于html - 为什么标签不使用整个形式，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23729412/