如何让slect下拉图标显示在左边
select 元素是一种表单控件可以在select中列出多选项供选择，在前端用到比力多，可是凡是的下拉图标都是在右侧，若是有特别要求怎么来把图标显示左侧呢？
东西/原料
- 编纂器
- 浏览器
- 图标图片
方式/步调
- 1
起首在编纂器中新成立一个html页面，定名为select.html题目为“若何让slect下拉图标显示在左边”。
- 2
本身做一个下拉的小图标放在该文件目次下的images的文件夹中。
- 3
在selecthtml的body中插手一个select控件，并列出两个选项
- 4
为了能看的更清晰一些，给select控件加一个样式设置宽为200像素，恰当的往页面的中心调整一下。
- 5
为了加本身心猿意马制的图标起首将默认的select选择框样式断根失落将appearance设置为none；
- 6
在样式中插手标的目的下箭头图片的布景 图片，并将图标的位置设置在select的左边
- 7
select的选项的文字压在了图标上如许是很不美不雅的，我们可以将文字标的目的右移动下，将箭头图标完全显示出来
注重事项
- 先把select的默认样式断根失落
- 图标和选项的距离不宜太年夜
- 发表于 2018-12-12 00:00
- 阅读 ( 774 )
- 分类：其他类型
admin
0 篇文章
作家榜 »
-
xiaonan123
189 文章
-
汤依妹儿
97 文章
-
luogf229
46 文章
-
jy02406749
45 文章
-
小凡
34 文章
-
Daisy萌
32 文章
-
我的QQ3117863681
24 文章
-
华志健
23 文章