As in the title:
ui-router多视图嵌套，如果保障各个ui-view下的css相互独立.state('companyManage',{
url:'/company',
views:{
'':{
templateUrl:'company/pages/company.html',
controller:'companyCtr'
},
'common_topbar@companyManage':{
templateUrl:'home-page/topbar.html',
},
'details@companyManage':{
templateUrl:'company/pages/company_details.html',
controller:'companyDetailCtr'
}
},
resolve:{
deps:["$ocLazyLoad",function($ocLazyLoad){
return $ocLazyLoad.load(["company/js/companyCtr.js","company/js/companyDetailCtr.js","company/js/fun.js",'company/css/company.css','main/common_topbar.css']);
}]
}
})There is a large css file linked in topbar.html, which has modified the default tag. If I do nothing at present, this css file will affect my other pages. How should I deal with this problem?
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
You actually mean the mutual influence of css.
You can use an html as a module. When writing css, you add a modular class name at the top, such as
In this way, as long as other pages do not have the first-one class, the css will naturally not take effect.
And if your css is not wrapped in a large module, such as reset.css
Then when this css is loaded, it will definitely affect other pages