这次给大家带来模仿disabled的样式，模仿disabled样式的注意事项有哪些，下面就是实战案例，一起来看一下。
模仿disabled
外层加 cursor: not-allowed
内层组织点击事件 pointer-events: none
<template> <li v-for="item in navlists" href="javascript:;" class="li i" :class="{ 'activeshow':item.active, 'disabled-li':!item.flag }"> <a href="javascript:;" :class="{disabled:!item.flag}" @click.stop="toolgenav(item)"> <h2>{{item.title}}</h2> <span class="samll-en" :title="item.small">{{item.small}}</span> <span class="samll-en-bg">{{item.small}}</span> </a> </li></template><style scoped>.disabled { pointer-events: none; /cursor: not-allowed!important;/ } .disabled-li { /阻止事件/ cursor: not-allowed !important; }</style>
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
相关阅读：
怎样在js的数组中过滤掉false, null, 0, , undefined, and nan这些值
table tr th 及table tr td 字体太多超出怎样用css解决
怎样设置默认打开360极速模式
以上就是模仿disabled的样式的详细内容。