仅在首页上覆盖正文/html 类 - overriding body/html class only on front page

overriding body/html class only on front page

本文关键字：html 正文覆盖首页 | 更新日期: 2023-09-27

我有一个Wordpress网站在我的索引上引入了一些整页滑块功能.php。要工作，它将 css 设置为

html, body {
  overflow: hidden;
  margin:0;
  padding:0;
}

但我希望我的内部页面溢出：自动;

我设置了两个标题.php文件（一个用于内部页面，一个用于索引.php），带有 header-int.php设置如下

.html

<body <?php body_class('auto'); ?> > ...

.css

.auto { overflow: auto; }

问题是我还需要覆盖 html css 才能自动运行，不确定该怎么做。或者让 html，正文 css 只针对索引.php而不是任何其他页面。

我会在这里重新访问您的头文件。Wordpress提供了许多功能来解决此类问题。我会将以下函数添加到您的头文件中：is_front_page() .更多信息请点击此处：https://codex.wordpress.org/Function_Reference/is_front_page

<?php if(is_front_page()) { ?>
  <body class="homepagebodyclass">
<?php } else { ?>
  <body class="auto">
<?php } ?>

执行上述操作将消除拥有多个头文件的需要......

在您的index.php文件上。您可以使用内联样式。

像这样设置你的 CSS：

html, body {
  overflow: auto;
  margin:0;
  padding:0;
}

现在，在您的index.php文件中，您的身体标签将如下所示：

<body style='overflow: hidden;'>

在

头文件中的 body 标记之前使用以下代码：

if ( is_page_template( 'index.php' ) ) {
    <style>
   html, body {
    overflow: hidden;
    margin:0;
    padding:0;
   }
   </style>

您也可以将其用于头文件中的 body 标签，如下所示：

    if ( is_page_template( 'index.php' ) ) {
        <body style='overflow: hidden;'>
    }