html – 如何将不同的CSS样式应用于具有相同类名的2个元素?
发布时间:2020-12-14 18:28:16 所属栏目:资源 来源:网络整理
导读:我创建了一个具有不同导航菜单的网站.在2个菜单中,我使用相同的 HTML类元素. 我有一个.css文件,用于在1个菜单中设置该类元素的样式.但是,在另一个菜单中,我想以不同的方式设置元素的样式. 是的,我知道我可以重命名类名,但是为了与我现在在标记结构中所拥有的
我创建了一个具有不同导航菜单的网站.在2个菜单中,我使用相同的
HTML类元素.
我有一个.css文件,用于在1个菜单中设置该类元素的样式.但是,在另一个菜单中,我想以不同的方式设置元素的样式. 是的,我知道我可以重命名类名,但是为了与我现在在标记结构中所拥有的一致,以及类名用于设置多个其他元素的样式,我怎么能够将不同的样式应用于具有相同类名的2个不同元素? 可以使用CSS中的某种if语句来完成吗? 例如,在1.html中: <div class="classname"> Some code </div> 在2.html: <div class="classname"> Some different code </div> 因为我只想在2.html中对这个“one”元素进行不同的设置,我可以只添加一个id属性和class属性,并使用id和class以及某种方式作为选择器吗? 如果可能的话,我再也不想删除类名. 谢谢! 解决方法
我只是添加,通常当有多个菜单时,您可能将它们包装在不同的结构中.举个例子:
<nav class='mainnav'><div class="classname one"> Some code </div></nav> <div class='wrapper'><div class="classname"> Some different code </div></div> 您可以轻松地定位这些: .mainnav>.classone {} .wrapper>.classone {} 或者如果父html有一个类: <div class='ancestor1'><div><div class="classname one"> Some code </div></div></div> <div class='ancestor2'><div><div class="classname one"> Some code </div></div></div> .ancestor1 .classname {} .ancestor2 .classname {} 显然这取决于他们可能在html中的位置. (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |