我对Wordpress比较陌生,但我相信有一种方法可以做我想做的事情。
我的模板中有一个容器,在主页上我想为这个元素指定稍微不同的填充。
我当前的CSS如下:
#main_content .container {
position: relative;
padding: 120px 0;
}
如果我在主页上,我想将填充降低到80px,否则保持这种方式。
这是我必须在模板中完成的事情,还是有一些花哨的“仅限WordPress”CSS技巧我目前还不知道?
根据我有限的经验,我认为我应该能够指定页面是否is_home
或类似的,并在header.php
主页的文件。大概是吧!important
在我为CSS更改填充后。
我能知道方向吗?我通过搜索找到的结果并不是我想要做的。
最合适的回答,由SO网友:Mayeenul Islam 整理而成
WordPressbody_class($class)
是一种很好的动态加载样式的方法,js用于特定的正文内容。如果您的主题不支持body类,请简单添加:
打开header.php
(或包含<body>
标记)编辑<body>
标记并使其<body <?php body_class(); ?>>
&mdash;您完成了!:)现在,当您在:
Home
第页,您的正文标记将呈现<body class="blog">
Front Page
, 您的主体标记将呈现<body class="home">
日志详细信息页面(single.php
), 您的主体标记将呈现<body class="single">
页面详细信息页面(page.php
), 您的主体标记将呈现<body class="page">
那么,你现在有空了。风格随心所欲。对于外部样式表和主页,您的样式将是(@saifur已经提到):body.home #main_content .container {
position: relative;
padding: 120px 0;
}
对于内部CSS,WordPress中有一个条件检查器,名为is_home()
, 另一个是is_front_page()
. 使用这两个选项,您可以检查“您”是在主页还是在首页,然后可以加载您的内部CSS代码:<?php if( is_home() || is_front_page() ) : ?>
<style id="my-internal-css">
#main_content .container {
position: relative;
padding: 120px 0;
}
</style>
<?php endif; ?>
类似地is_single()
, is_page()
, is_category()
, is_archive()
, is_day()
, ... 等等。。。