Question

我想在Drupal 7站点的一个特定页面（节点）上重新设置页面标题（h1）的样式。在特定页面上使用CSS定位单个HTML元素的最佳方法是什么？

显然，我希望所有其他页面上的页面标题不受影响。

我正在使用Bartik的子主题，如果它有任何区别。

Answer 1

通常在大多数主题中，类都会添加到body标签中。除非你使用像mothership这样的主题，你可以强制它去除这些类，这些可以非常方便。甚至母舰也提供了一个设置来启用/禁用用这些类填充body标签。

使用Chrome中的inspect元素或Firefox中的Firebug或IE中的开发人员工具栏，在您想要主题的页面中的<content_type>-<entity-type>-<id>标记中查找代表<body>类的类。例如page-node-12

omega主题的示例输出如下

<body class="html not-front logged-in page-node page-node- page-node-8 node-type-page context-page admin-menu coffee-processed omega-mediaqueries-processed alpha-debug-processed responsive-layout-wide">

Bartic主题的示例正文标记输出

<body class="html not-front logged-in no-sidebars page-node page-node- page-node-33 node-type-team-member admin-menu coffee-processed">

然后找到节点标题的特定选择器，就像说#page-title一样，或者如果它没有id，请找出一些规则来选择它，使其在页面中唯一。例如.page h1.title

现在你可以使用，

body.page-node-12 #page-title {
  /* your css rule */
}

或

body.page-node-12 .page h1.title {
  /* your css rule */
}

在Drupal 7中使用CSS定位单个HTML元素

1 个答案: