Question

我正在使用joomla模板，其中有各种样式表文件用于页面布局。我在这里展示了简短的方法：

style1.css

#header ul.menu li a{ background-color: red; }

style2.css

#header ul.menu li a{ color: blue; }

style3.css

ul.menu li a:hover{ background-color: gray; }

style4.css

ul li a:active{ background-color: green; }

style5.css

ul.menu { list-style: none;}
ul.menu li{display: inline;}
ul li a{float: left; display: block;}

重置#header菜单的默认样式的最佳方法是什么？

我可以将css重置为 style1.css ，因为如果需要，可以放置!important：

#header ul.menu{list-style: none;}
#header ul.menu li{display: inline-block;}
#header ul.menu li a{color: black; background-color: none;}
#header ul.menu li a:hover{color: black; background-color: none;}
#header ul.menu li a:active{color: black; background-color: none;}

但是为此，我首先看到该菜单中应用了哪些样式，然后设置我自己的样式。

但是我正在寻找css规则，无论在该菜单中应用哪种样式，我都可以重置为其浏览器默认值。有没有办法做到这一点？

Answer 1

使用javascript的两种方式

更改className（您必须将“#header”替换为“.header”）
更改正在使用的样式表

如何重置为浏览器默认的CSS？

1 个答案: