通过CSS改变html中的select下拉选项样式

在html中为select添加父div层
命名class为select1

<div class="select1">
		<select id="sel"name="corl">
		<option value="1" >红色</option>
		<option value="2" >紫色</option>
		<option value="3" >黄色</option>
		<option value="4" >蓝色</option>
		<option value="5" >绿色</option>
		</select>
</div>

在CSS中输入

.select1 {
    background: rgba(0,0,0,0.2);/*背景色和透明度，可以设置为url地址的图片*/
    width: 298px;/*宽度*/
    height: 60px;/*高度*/
    margin-top: 50px;/*上边距*/
	margin-left: 150px;
	font-size: 25px;
	border-radius: 10px;
    overflow: hidden;
}

.select1 select{
    background: transparent;/*透明*/
    border: none;
    padding-left: 10px;
    width: 300px;/*比上面设置的略宽*/
    height: 100%;
    border-radius: 10px;
    color: black;
	font-family: "微软雅黑";
}