使用Element-UI的NavMenu如何隐藏自带的小箭头-牛翰网

Element-UI的NavMenu隐藏自带的小箭头

这里使用的是水平菜单，用icon作为title

直接套用官网的模版会在icon的右边有一个小箭头，但现在需要隐藏它

直接使用下面的css代码即可

.el-submenu.is-opened>.el-submenu__title .el-submenu__icon-arrow{
	display: none; 
}

.el-submenu>.el-submenu__title .el-submenu__icon-arrow{
	display: none;
}

注意：

在<style>标签里需要把scope删掉

更改element ui中下拉菜单的小箭头的样式

添加样式

【注意添加样式style中不能添加scoped】

 .drop.el-popper[x-placement^=bottom] .popper__arrow {
		border-bottom-color: #1EBEF4 !important;
		left: 50% !important;
	}

更改下方箭头位置

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

本站所有资源来自于网络，仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您(转载者)自己承担！
如有侵犯您的版权，请及时联系3500663466#qq.com(#换@)，我们将第一时间删除本站数据。

THE END

Vue.js 前端开发编程开发
# Element-UI # 隐藏 # NavMenu # 小箭头

目录

Element-UI的NavMenu隐藏自带的小箭头

更改element ui中下拉菜单的小箭头的样式

添加样式

更改下方箭头位置

总结