轉自http://writeblog.csdn.net/PostEditPlain.aspx
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br /><html xmlns="http://www.w3.org/1999/xhtml"><br /><head><br /><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><br /><title>如何讓select的樣式也漂亮起來</title><br /><mce:style type="text/css"><!--<br />.select * {<br /> margin: 0;<br /> padding: 0;<br />}<br />.select {<br /> border:1px solid #cccccc;<br /> float: left;<br /> display: inline;<br /> }<br />.select div {<br /> border:1px solid #f9f9f9;<br /> float: left;<br />}<br />/* 子選取器，在FF等非IE瀏覽器中識別 */<br />.select>div {<br /> width:120px;<br /> height: 17px;<br /> overflow:hidden;<br /> }</p><p>/* 通配選擇符，只在IE瀏覽器中識別 */<br />* html .select div select {<br /> display:block;<br /> float: left;<br /> margin: -2px;<br />}<br />.select div>select {<br /> display:block;<br /> width:124px;<br /> float:none;<br /> margin: -2px;<br /> padding: 0px;<br />}<br />.select:hover {<br /> border:1px solid #666666; //滑鼠移上的效果<br />}<br />.select select>option {<br /> text-indent: 2px; //option在FF等非IE瀏覽器縮排2px<br />}<br />--></mce:style><style type="text/css" mce_bogus="1">.select * {<br /> margin: 0;<br /> padding: 0;<br />}<br />.select {<br /> border:1px solid #cccccc;<br /> float: left;<br /> display: inline;<br /> }<br />.select div {<br /> border:1px solid #f9f9f9;<br /> float: left;<br />}<br />/* 子選取器，在FF等非IE瀏覽器中識別 */<br />.select>div {<br /> width:120px;<br /> height: 17px;<br /> overflow:hidden;<br /> }</p><p>/* 通配選擇符，只在IE瀏覽器中識別 */<br />* html .select div select {<br /> display:block;<br /> float: left;<br /> margin: -2px;<br />}<br />.select div>select {<br /> display:block;<br /> width:124px;<br /> float:none;<br /> margin: -2px;<br /> padding: 0px;<br />}<br />.select:hover {<br /> border:1px solid #666666; //滑鼠移上的效果<br />}<br />.select select>option {<br /> text-indent: 2px; //option在FF等非IE瀏覽器縮排2px<br />}</style><br /></head><br /><body><div class="select"><br /> <div><br /> <select><br /> <option>看見效果了吧</option><br /> <option>看見效果了吧</option><br /> <option>看見效果了吧</option><br /> </select><br /> </div><br /></div><br /></body><br /></html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
