项目实训——vue中修改router-link的默认样式
发现个神奇的事…<el-menu-item index="1"><router-link to="/">首页</router-link></el-menu-item><el-menu-item index="2"><router-link to="/main">招聘信息</router-link></el-m
·
发现个神奇的事…
<el-menu-item index="1">
<router-link to="/">首页</router-link>
</el-menu-item>
<el-menu-item index="2">
<router-link to="/main">招聘信息</router-link>
</el-menu-item>
.router-link-active {
text-decoration: none;
color: #fff;
}
a {
text-decoration: none;
color: #fff;
}
router-link本质就是a标签,所以这么写能取消router-link 的默认样式
但是!!!!
如果这么写:
.router-link-active {
text-decoration: none;
color: #fff;
}
.router-link {
text-decoration: none;
color: #fff;
}
只能取消第一个el-menu-item的默认样式,不能取消第二个。尝试发现如果router-link里的to有跳到别的组件,如/main,则其默认样式不能被取消。只能采用第一种css的写法取消。
?
更多推荐
已为社区贡献1条内容
所有评论(0)