web前端基础6

表格样式注意事项：

不要给table,th,td以外的表格标签加样式；

table{border-collapse:collapse} 去掉表格之间的单元格间隙。

单元格默认平分table的宽度；

th里面的内容上下居中显示，文字加粗；

td的内容默认上下居中，文字居左显示；

table决定整个表格的宽度；

table里面单元格的宽度会转换为百分比；

表格里面的每一列必须有宽度；

colspan 属性规定单元格可横跨的列数；

<td colspan=2></td>

rolspan 属性规定单元格可横跨的行数；

<td rolspan=2></td>

<form  action="提交的地址" method="post" target="_black"></form>  表单

<input type="submit"  value="提交"  name="后台接受的数据名字"/> 提交按钮

<input type="text"   name="后台接受的数据名字"/>文本框

<input type="password"   name="后台接受的数据名字"/>密码框

<input type="radio"   name="后台接受的数据名字"/> 男 单选按钮

<input type="radio"   name="gender" id="a"/> <lable  for="a">男</lable>

<input type="radio"   name="gender" id="b"/> <lable  for="b">女</lable>

<input type="checkbox"   name="" />1  复选框  checked表示默认选中 disabled 表示禁止选中

<input type="checkbox"   name="" disabled />2

<input type="checkbox"   name="" checked />3

<input type="file"   name=""  />选择文件 不兼容各大浏览器，不经常使用

<input type="hidden"   name=""  />隐藏按钮

<input type="reset"   name=""  />重置按钮

<select>      下拉选框   selected表示默认选中

<option>1</option>

<option>2</option>

<option  selected>3</option>

<option>4</option>

<option>5</option>

<option>6</option>

</select>

<textarea>  文本域 resize=none  禁止用户调整textarea的窗口大小  overflow:auto;隐藏textarea的滚动条；

  content                                                outline:none;去掉textarea的焦点线

</textarea>

form与form之间有外边距，所以重置的时候需要去掉外边距

 

表单元素的默认样式重置：

form{margin:0;}

input{margin:0;padding:0;}

select{margin:0;}

textarea{margin:0;padding:0;resize:none;overflow:auto;outline:none;}

a标签轮廓线去除的方法：

1.<a href="#" οnfοcus="this.blur();"></a>

2.<a href="#" hideforcus></a>

表单元素兼容性问题

IE6下背景滚动

解决问题，用一个同样大小的div包住将背景图设置给div，并将input的输入背景置为none；