首页 > 解决方案 > 如何避免设置页脚样式?

问题描述

我有网站的样式,但不希望它们应用于页脚。我怎样才能做到这一点?

HTML CSS 选择器

@media(max-width: 500px){
#mobileview{
width:100%;
height:211px;
}

p {
    text-align: left;
    text-align: justify;
    font-size:70%;
}
br {
    display: none;
}
h1 {
    text-align: left;
    font-size:190%;

}
a {
    text-align: left;

        float:left;
}
a.animation {
    text-align: center;
        font-size:9px;
        float:center;

}
}

这是我的移动视图的代码之一。

这是我调用页脚时的代码

<div class="row">
  <div class="container2">
   XXX Content
  </div>
</div>
<?php echo $footer; ?>

我如何为页脚排除这些样式?因为它弄乱了我的页脚

标签: htmlcss

解决方案


当元素匹配驻留在特定上下文中时,您不能排除样式(黑名单是不可能的,因为CSS 中没有父选择器

您可以采用的是一种白名单方法,即为您的选择器提供上下文:

main p {
  color: red;
}
<main>
  <p>I'm red</p>
</main>
<footer>
  <p>I'm not red</p>
</footer>

在这个例子中,而不是做

p { color: red; }

请注意我是如何定义上下文的,即p在内部main应受此规则影响

main p { color: red; }

推荐阅读