【CSS学习笔记十三】表单

一.输入框

input 
{
	width:100%;
}
/*使用 :focus 选择器可以设置输入框在获取焦点时的样式*/
input:focus
{
	background-color:lightblue;
}

设置指定类型的输入框可以使用以下属性选择器

• input[type = text] ：选取文本输入框
• input[type = password] ： 选择密码的输入框
• input[type = number] ： 选择数字的输入框

二.文本框

注意: 使用 resize 属性来禁用文本框可以重置大小的功能（一般拖动右下脚可以重置大小）。

textarea
{
	width:100%;
	height:250px;
	border:2px solid green;
	border-radius:4px;
	resize:none;
}

三.下拉菜单

select
{
	width:100%;
	padding:12px 20px;
	margin:8px 0;
	border:none;
	border-radius:4px;
	background-color:lightgrey;
}

四.按钮

input[type = submit],input[type = reset],input[type = button]
{
	width:100%;
	padding:12px 20px;
	margin:8px 0;
	border:2px solid green;
	border-radius:4px;
	background-color:grey;
}

实例：

	
		
		
		
	
	
		

			

				First Name
				
				Last Name
							
				国家：
				
					中国
					美国
					英国
				
				想说的话？
				Some text
							
			
		
	

结果：