使用哪个CSS选择器？

对不起模糊标题，我无法用一行描述我的问题。问题是关于页面标题，这是从常见的后台模板，这是使用哪个CSS选择器？

<h2 class='page-title'> {title} </h2>

其中{}标题由应用程序动态生成的产生。所以我会在同一个模板生成的每个网页上都有一个。

我想要做的是，隐藏，从3主页上，却可以让它显示在所有其他页面上使用CSS或Javascript。我愚蠢地尝试h1 {display:none}但这只是隐藏一切，我只想隐藏<h2 class='page-title'>Home</h2>

任何想法如何做到这一点？

哇......在一小时内得到了很多答案！我爱stackoverflow社区。谢谢你们！ – CuriousMind 2011-02-02 20:35:28

要么使用后端代码给您的主页标题的特定ID，或在主页本身上使用的页面的CSS：

h2.page-title { 
    display:none; 
}

2011-02-02 18:33:24 Mohamad

您将需要添加一个样式只是首页，或有一个类，表示您正在浏览的网页：

h2.page-title是选择元素的非常具体的方式，但它会影响所有页面。

.page-title可以工作，如果你知道该类只会发生在h2元素上。

如果你使用的身体，你可以做以下的类：这取决于你想如何具体是

body.frontpage h2.page-title

或body.frontpage .page-title。

我建议尽可能通用以避免特殊性问题。

2011-02-02 18:33:06 zzzzBov

我会给你<html>元素的ID（独特的每一页）：

<html id='{pageid}'> 
... 
<h2 class='page-title'> {title} </h2> 
... 
</html>

如果你有一个CMS然后使用选择

#home .page-title { display: none }

2011-02-02 18:36:22

或类似的东西，倾倒内容到一个单一的模板，那么我认为你最好用javascript做这件事。我不知道一个元素的innerText在css中的选择器。

我通常使用jQuery库 - 我建议是这样的：

$(document).ready(function() { 
    $("h2.page-title:contains('Home')").css('display', 'none'); 
}

2011-02-02 18:37:54 kmfk

没想到我可以这样做，谢谢！ – CuriousMind 2011-02-02 20:03:34

这是最好的，用来动态生成这种非常相同的服务器端语言完成，只需添加一个条件如果页面是'Home'，则不输出任何内容。

如果这不是您的选择，我会建议梅尔的方式，因为它会简单地工作，并且不需要JavaScript。

另外我觉得梅尔的代码应该在你想隐藏的h2之上，并且包裹成<style></style>标签。

2011-02-02 18:47:52 CodeVirtuoso

回答