這里不引用第三方類庫，僅html+css設計。
預期效果如下圖：網站的中英文切換下拉列表。
html下select標簽本身效果不好看，故做更改。測試瀏覽器:Chrome.
更改思路：
1.select極其下拉列表字體設置：利用css相關屬性，見代碼；
2.關於select右邊自帶三角形改為白色：將原屬select三角形設為不顯示，在select外圍包一層DIV，隨后在其DIV旁邊設計一個三角形白色DIV放旁邊就可以了。
優點在於可以不引用第三方庫，缺點是白色三角形點擊沒有反應，只能起到一個指向作用。
這里有個疑問，百度出來的用span標簽在select標簽外圍包上，然后替換上一個三角形圖片，我參考着做了，但是沒法覆蓋在select上面，不知道是哪個地方沒設置好，
這個問題先記錄着。
后續再研究下用bootstrap等方法進行設計。
如下html代碼：
<div class="choseLanguage">
<div class="se">
<select class="selectLanguage">
<option class="optionLangeuage">簡體中文</option>
<option class="optionLangeuage">English</option>
</select>
</div>
<div class="trangle"></div><!--設置三角形白色DIV-->
</div>
如下css代碼
.choseLanguage{
width:80px;
height:32px;
float:left;
text-align:right;
margin-left:40px;
margin-top:12px;
float:left;
font-size:14px;
}
.se{
width:70px;
height:32px;
float:left;
text-align:right;
float:left;
font-size:14px;
}
.trangle{
width: 0;
height: 0;
margin-top:5px;
margin-left:1px;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-top: 8px solid #FFFFFF;
float:left;
}
.selectLanguage{
background-color:#1e4a7e;
font-size:14px;
color:#FFFFFF;
font-weight:bold;
border:0;
border:none;
appearance:none;
-moz-appearance:none;
-webkit-appearance:none;
}
.optionLangeuage{
font-size:14px;
color:#FFFFFF;
font-weight:bold;
}