css怎么修改input框的长度

196 阅读 0 评论 130 点赞

我是靠谱客的博主彩色冬天，这篇文章主要介绍css怎么修改input框的长度，现在分享给大家，希望可以做个参考。

本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。

css修改input框长度的方法

方法1：

利用style属性给input标签添加 width样式。

复制代码<input type="text" /><br /><br />
<input type="text" style="width: 300px" />1
2
<input type="text" /><br /><br />
<input type="text" style="width: 300px" />
登录后复制

方法2：

复制代码<!DOCTYPE html>
<html>
	<head>
		<style>
			.input {width: 100px;}
		</style>
	</head>
	<body>
		<input type="text" /><br /><br />
		<input type="text" class="input" />
	</body>
</html>1
2
3
4
5
6
7
8
9
10
11
12
<!DOCTYPE html>
<html>
	<head>
		<style>
			.input {width: 100px;}
		</style>
	</head>
	<body>
		<input type="text" /><br /><br />
		<input type="text" class="input" />
	</body>
</html>
登录后复制