关于设置html输入框的款式方面

**

关于设置html输入框的款式方面

**

之前我们学习小组写一个web网络考试系统,我理所应当的被分到网页登录界面和考试界面的设计。

这是我写到一半的代码



			<div class="in">
				<input  type="text" id="1" required  placeholder="请填学号" style="height: 40px;width: 200px">
			</div>
			<br><br>
			<div class="in">
				<input  type="password" id="2" required  placeholder="请填密码" style="height: 40px;width: 200px">
			</div>
    		<br><br>
			<input  type="submit" value="登录" style="height: 40px;width: 200px">
			<br>
			<div class="ta">
			<input type="radio" value="1" name="table" id="table1">
				<label for="table1">记住密码</label>
			</div>			
			<br><br>				
		</form>		`


之前遇到的问题是这个输入框背景颜色和框字的大小,想怎么让它美观点,但想想这是考试系统,简单点就好。
所以背景颜色也没写,就让框变得圆滑。

这是输入的款式代码

input[type="text"],[type="password"]{
	background: ;
	-web-kit-appearance:none;
	-moz-appearance:none;
	font-size: 1.2em;
	display: block;
	outline: 0;
	box-sizing: border-box;
	text-align: center;
	color: #6a6f77;
	border-radius:7px;
	border:1px solid #c7cccf;
}
input[type="submit"]{
	font-size: 1.2em;
	border-radius:7px;
	border:1px solid #c7cccf;
}
.ta{
	font-size: 0.8em;
}

.deng{
	font-size: 40px;
	margin:170px 200px 27px 550px;
	padding: 200px;
	padding: 5px;
}

这次学习也让我知道了整体布局和详细的颜色大小及边框样式的设计要根据你写的主题来设计。

  • 1
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值