怎么用纯css 修改美化select选择框

不过采取这种方式， 不怎么美丽如图：

html：

<div class="styled-select">
 <select>
 <option>Here is the first option</option>
 <option>The second option</option>
 </select>
 </div>

css：

.styled-select {
    width: 240px;
    height: 34px;
    overflow: hidden;
    background: url("http://images.cnblogs.com/cnblogs_com/shishm/201203/20120302110411201.jpg") no-repeat right #ddd;
}

.styled-select select {   
    background: transparent;   
    width: 268px;   
    padding: 5px;   
    font-size: 16px;   
    border: 1px solid #ccc;   
    height: 34px;   
    -webkit-appearance: none; 
}

调试网站：http://jsfiddle.net/shishaomeng/KGrYB/