css改变下拉框的下拉小三角样式

html-css039

css改变下拉框的下拉小三角样式,第1张

select{

width: 90%

padding: 8px 0

font-size: 14px

border: none

outline: none

appearance: none

-webkit-appearance: none

-moz-appearance: none

}

div:after{

content: ""

width: 13px

height: 7px

background: url(../../../images/about/sanjiaoxing2.png) no-repeat center

-webkit-background-size: 100% 100%

background-size: 100% 100%

position: absolute

right: 20px

top: 45%

//给自定义的图标实现点击下来功能

pointer-events: none

}

需要准备的材料分别有:电脑、浏览器、html编辑器。

1、首先,打开html编辑器,新建html文件,例如:index.html。

2、在index.html中的<style>标签中,输入css代码:select { width: 210px}。

3、浏览器运行index.html页面,此时网页下拉列表的大小被调整为了210px。