CSS —— 兼容各个浏览器的select的样式

来源：互联网发布：dota2第一滴血数据编辑：程序博客网时间：2024/05/20 18:44

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>如何让select的样式也漂亮起来</title><style type="text/css"><!--.select * {  margin: 0;  padding: 0;}.select {  border:1px solid #cccccc;  float: left;  display: inline;  }.select div {  border:1px solid #f9f9f9;  float: left;}/* 子选择器，在FF等非IE浏览器中识别 */.select>div {  width:120px;  height: 17px;  overflow:hidden;  } /* 通配选择符，只在IE浏览器中识别 */* html .select div select {  display:block;  float: left;  margin: -2px;}.select div>select {  display:block;  width:124px;  float:none;  margin: -2px;  padding: 0px;}.select:hover {  border:1px solid #666666; //鼠标移上的效果}.select select>option {  text-indent: 2px; //option在FF等非IE浏览器缩进2px}--></style></head><body><div class="select"> <div> <select>  <option>看见效果了吧</option>  <option>看见效果了吧</option>  <option>看见效果了吧</option> </select> </div></div></body></html>