html问题，我想要文本框靠左，文本框中数字靠右怎么实现
<html>
<head>
<title>InsertDept.html</title>
<style type="text/css">
#main {
margin-top: 50px;
}
.style1 {
width: 75px;
height: 24px;
text-align: center;
}
.style2 {
width: 225px;
height: 24px;
}
</style>
</head>
<body>
<div id="main" align="center">
<form name="form1" method="post" action=""
onSubmit="return DataCheck();">
<table width="300" border="1" cellpadding="1" cellspacing="1"
align="center">
<tr>
<td width="300" height="24" align="center" colspan="2">新规部门</td>
</tr>
<tr>
<td class="style1">部门编号</td>
<td class="style2"><input id="deptId" name="deptId tpye="text" >
</td>
</tr>
<tr>
<td class="style1">部门名称</td>
<td class="style2"><input id="deptName" name="deptName"
tpye="text"></td>
</tr>
<tr>
<td class="style1">部门地址</td>
<td class="style2"><input name="deptLoc" type="text"
id="deptLoc"></td>
<tr>
<td width="300" height="24" align="center" colspan="2"><input
type="submit" id="button1" name="button1" value="提交"> <input
type="button" id="button2" name="button2" value="取消"
onclick="history.back();"></td>
</tr>
</table>
</form>
</div>
</body>
</html>
我想要在类选择器中实现着个功能，就是.style1 ，.style2中实现，谢谢 展开
可以使用input的text-align标签实现文本框靠左，文本框中数字靠右。
具体步骤如下：
需要准备的材料分别是：电脑、浏览器、ultraedit。
1、在ue编辑器中新建一个空白的html文件。
2、在ue编辑器中输入以下html代码。
3、编辑完成以后，在ue编辑器中点击保存，格式选择UTF8无BOM。
4、在浏览器中打开此html文件，可以看到最终想要实现的文本框靠左，文本框中数字靠右效果。
扩展资料
一个网页对应多个HTML文件，超文本标记语言文件以.htm（磁盘操作系统DOS限制的外语缩写）为扩展名或.html（外语缩写）为扩展名。可以使用任何能够生成TXT类型源文件的文本编辑器来产生超文本标记语言文件，只用修改文件后缀即可。
标准的超文本标记语言文件都具有一个基本的整体结构，标记一般都是成对出现（部分标记除外例如：<br/>），即超文本标记语言文件的开头与结尾标志和超文本标记语言的头部与实体两大部分。有三个双标记符用于页面整体结构的确认。
标记符<html>，说明该文件是用超文本标记语言（本标签的中文全称）来描述的，它是文件的开头;而</html>，则表示该文件的结尾，它们是超文本标记语言文件的开始标记和结尾标记。
头部内容，标记符< html>：说明该文件是用超文本标记语言来描述的，它是文件的开头，而</html>则表示该文件的结尾，它们是超文本标记语言文件的开始标记和结尾标记。
<head></head>：这2个标记符分别表示头部信息的开始和结尾。头部中包含的标记是页面的标题、序言、说明等内容，它本身不作为内容来显示，但影响网页显示的效果。
头部中最常用的标记符是标题标记符和meta标记符，其中标题标记符用于定义网页的标题，它的内容显示在网页窗口的标题栏中，网页标题可被浏览器用做书签和收藏清单。
可以使用input的text-align标签实现文本框靠左，文本框中数字靠右。
具体步骤如下：
需要准备的材料分别是：电脑、浏览器、ultraedit。
1、在ue编辑器中新建一个空白的html文件。
2、在ue编辑器中输入以下html代码。
3、编辑完成以后，在ue编辑器中点击保存，格式选择UTF8无BOM。
4、在浏览器中打开此html文件，可以看到最终想要实现的文本框靠左，文本框中数字靠右效果。
样式
文本框靠左 需要设置 .style2 text-align: left;
文本框中数字靠右 需要设置 .style3 text-align: right;
代码如下
<!DOCTYPE html>
<html>
<head>
<title>InsertDept.html</title>
<style type="text/css">
#main {
margin-top: 50px;
}
.style1 {
width: 75px;
height: 24px;
text-align: center;
}
.style2 {
width: 225px;
height: 24px;
text-align: left;
}
.style3{
text-align: right;
}
</style>
</head>
<body>
<div id="main" align="center">
<form name="form1" method="post" action=""
onSubmit="return DataCheck();">
<table width="300" border="1" cellpadding="1" cellspacing="1"
align="center">
<tr>
<td width="300" height="24" align="center" colspan="2">新规部门</td>
</tr>
<tr>
<td class="style1">部门编号</td>
<td class="style2"><input class="style3" id="deptId" name="deptId tpye="text" >
</td>
</tr>
<tr>
<td class="style1">部门名称</td>
<td class="style2"><input class="style3" id="deptName" name="deptName"
tpye="text"></td>
</tr>
<tr>
<td class="style1">部门地址</td>
<td class="style2"><input class="style3" name="deptLoc" type="text"
id="deptLoc"></td>
<tr>
<td width="300" height="24" align="center" colspan="2"><input
type="submit" id="button1" name="button1" value="提交"> <input
type="button" id="button2" name="button2" value="取消"
onclick="history.back();"></td>
</tr>
</table>
</form>
</div>
</body>
</html>
.style1 {
width: 75px;
height: 24px;
text-align: left;
}
.style2 {
width: 225px;
height: 24px;
text-align: right;
}
input { float:left; padding-left:20px; }float:left; 让文本框左漂浮，
padding-left:20px; 让文本框中的数字或者文字向右偏20px
|
广告 您可能关注的内容 |
