下拉框样式修改

image.png

image.png

想做到图二的效果,目前只能修改背景色,但是中间那个倒立的三角形怎么改变颜色呢?还有如何让其变成圆角?

image.png .fr-trigger-center好像包含的三角形

孜云 发布于 2020-5-20 16:54 (编辑于 2020-5-20 17:05)
1min目标场景问卷 立即参与
回答问题
悬赏:4 F币 + 添加悬赏
提示:增加悬赏、完善问题、追问等操作,可使您的问题被置顶,并向所有关注者发送通知
共5回答
最佳回答
3
shirokoLv6资深互助
发布于2020-5-20 17:00

用外部引用css样式的话都能改

https://bbs.fanruan.com/wenda/question/30467.html

https://help.finereport.com/doc-view-2287.html


你要改的那个三角形大概是 这个选择器吧:  .fr-trigger-center

改background的图片就好


  • 孜云 孜云(提问者) 那个三角形是图片嘛?不太懂JS...好像三角形是 .fr-trigger-center中的一部分, .fr-trigger-center是中间一条
    2020-05-20 17:04 
  • shiroko shiroko 回复 孜云(提问者) 就是那个小三角,整个图标就是小三角+蓝色背景。你可以试试$(\".fr-trigger-center\").css(\'background\',\'transparent\'),会发现小三角没了
    2020-05-20 20:01 
最佳回答
2
jongwangLv6中级互助
发布于2020-8-22 10:25(编辑于 2020-8-22 11:17)

修改下回答

-----------------------

下拉框样式.cpt

down_new.png

image.png


需要先将图片先放在这个路径,其中pic自己建一下,或者放到其他位置也可以,url那里指向正确即可。



效果:

image.png


样式修改代码,仅供参考,放入到下拉框初始化事件中:

setTimeout(function() {
	$(".fr-trigger-btn-up").css({
		"border-radius": "0 4px 4px 0",
		"background": "white",
		"border": "1px solid #e8ebf1",
		"border-left-style": "none"
	})

	$(".fr-trigger-text.fr-border-box").css({
		"border-radius": "4px 0 0 4px",
		"border": "1px solid #e8ebf1"
	})

	$(".fr-trigger-center").css({
		"border-radius": "4px 0 0 4px",
		"background": "url('../../pic/down_new.png')  50%/80% no-repeat"
	})
}, 10)



图片你回头自己换下,然后对于background属性改一改,改到合适就好了。

最佳回答
0
陶昌菊Lv4见习互助
发布于2020-5-20 16:57

帆软上面改不了,实在要改只能自己用js和css写试试

  • 孜云 孜云(提问者) 找不到那个三角形的选择器,好像都只是改背景,没用涉及改那个三角形的
    2020-05-20 17:13 
最佳回答
0
yikefuLv6初级互助
发布于2020-5-22 13:25

加qq1635077326

我给你解决

最佳回答
0
luojian0323Lv7资深互助
发布于2020-8-22 10:19

这个改不了呀.就是改了.鼠标放上去又变回来了

  • 7关注人数
  • 1900浏览人数
  • 最后回答于:2020-8-22 11:17
    请选择关闭问题的原因
    确定 取消
    返回顶部