我有一个表单，我希望标签与右边对齐。当我说＆＃34;标签＆＃34;时，我指的是表单输入框左侧的文本。我有那些分开的元素。当我输入<td align="right">时，它无效。我需要改变什么？
完整的Html代码：
<h3 align="center"><font size="5">LifeLink PSU Mentor Application</font><br><font size="4">Please fill out all requried fields</font></h3>
<body bgcolor="lightblue">
<style>
table,
th,
td {
/* border: 1px solid black;
border-collapse: collapse;*/
}
th,
td {
padding: 5px;
text-align: left;
}
table#Mentorinfo {
width: 60%;
}
table#header th {
background-color: black;
color: white;
}
.medium-btn {
background-color: #99CCFF;
color: #000000;
width: 70px;
height: 30px;
}
</style>
<form id="Mentorinfo">
<table border="1" id="Mentorinfo" align="center" style="background:white;">
<tr>
<td width="50%" align="right">PSU ID:</td>
<td>
<input type="number" name="PSUID" />
</td>
</tr>
<tr>
<td align="right">First Name:</td>
<td>
<input type="text" name="FirstName" />
</td>
</tr>
<tr>
<td align="right">Last Name:</td>
<td>
<input type="text" name="LastName" />
</td>
</tr>
<tr>
<td align="right">Age:</td>
<td>
<input type="number" name="Age">
</td>
</tr>
<tr>
<td align="right">Phone number:
<br>***-***-****</td>
<td>
<input type="text" name="MenTel" pattern=".*^[2-9]\d{2}-\d{3}-\d{4}$.*" />
</td>
</tr>
<tr>
<td>PSU email:
<br>Example qwe1234@psu.edu</td>
<td>
<input type="text" name="Email" pattern=".*^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$.*" />
</td>
</tr>
<tr>
<td>Semester and year applying for?:
<br>Example: Spring 2015</td>
<td>
<input type="text" name="SemYear" />
</td>
</tr>
<tr>
<td>Major(s):
<br>separate majors with commas</td>
<td>
<input type="text" name="Major" />
</td>
</tr>
<tr>
<td>Which college are you from?:</td>
<td>
<input type="text" name="CollegeName" />
</td>
</tr>
<tr>
<td>Do you want to become a mentor or intern?:</td>
<td>
<input type="radio" name="VolType" value="mentor" />Mentor
<br>
<input type="radio" name="VolType" value="intern" />Intern
</td>
</tr>
<tr>
<td>Are you doing this for major requirements or class credit?:</td>
<td>
<input type="radio" name="ForMentoring" value="Major requirement" />Major requirements
<br>
<input type="radio" name="ForMentoring" value="Class credit" />Class credit
<br>
<input type="radio" name="ForMentoring" value="Neither, just want to help out" />Neither, just want to help out!
</td>
</tr>
<tr>
<td>If for class credit, what class it for?</td>
<td>
<input type="text" name="ClassTitle" />
</td>
</tr>
<tr>
<td>How many hours are you required to complete?</td>
<td>
<input type="text" name="RequiredHours" />
</td>
</tr>
<tr>
<td>Your organization name (if applicable)</td>
<td>
<input type="text" name="Org" />
</td>
</tr>
<tr>
<td>If from an organization, how many hours are required?
<br>(if applicable)</td>
<td>
<input type="text" name="OrgReqHrs" />
</td>
</tr>
<tr>
<td>What skills or experiences can you bring?</td>
<td>
<textarea name="Skills" cols="50" rows="10"></textarea>
</td>
</tr>
<tr>
<td>What extra-curricular activites are you involved in?</td>
<td>
<textarea name="ExtraCurricular" cols="50" rows="10"></textarea>
</td>
</tr>
<tr>
<td>Any additional information you would like share with us?</td>
<td>
<textarea name="AddDetails" cols="50" rows="10"></textarea>
</td>
</tr>
<tr>
<td colspan="2"><b><br><center>Mentor/Volunteer Agreement</center></b>
<ul>
<li>I agree not to dispense any medication (Tylenol, etc) to students</li>
<li>I agree to be responsible about attending. If I cannot fulfill my obligation, i will call in a timely manner.</li>
<li>I agree to avoid activities/places prohibited by the program or in the student's individual permission form. (e.g going to fraternities/sororities, dorm rooms, etc)</li>
<li>I agree to maintain language, attire, conduct, etc., appropriate for working with high school students.</li>
<li>I agree to adhere to professional guidelines regarding confidentiality.</li>
<li>I agree to embrace the spirit and philosophy of the program, e.g developing independence, social relationships, etc.</li>
</ul>
</td>
</tr>
<tr>
<td colspan="2">
<center>
<br>
<input type="checkbox" name="Agreement" value="1">I Aggree to the above terms of mentorship.</center>
<br>
</td>
</tr>
</table>
<center>
<p></p>
<p></p>
<input type="button" value="Submit" class="button medium-btn" onclick="google.script.run
.withSuccessHandler(Success)
.withFailureHandler(Failed)
.processForm(document.forms[0]);" />
<input float="center" type="button" value="Clear" class="button medium-btn" onclick="clear()" />
</center>
</form>
<br>
<br>
<div id="result" align="center"></div>
<p>
</p>
<script>
function Success(firstName) {
var divElement = document.getElementById("result");
divElement.innerHTML = '<font color="green" > Your application was successfully added to the database!</font>';
}
function Failed(FailedReturned) {
var divElement = document.getElementById("result");
divElement.innerHTML = '<font color="red" >' + FailedReturned + '</font>';
}
function clear() {
document.forms[0].reset();
}
</script>
</body>
答案 0 :(得分：2)
从
中删除css属性text-align:left
td {
padding: 5px;
text-align: left;
}
td {
padding: 5px;
}
并单独添加foreach td WORKING DEMO