0

在我的网站上，我添加了以下代码，我只打算将其应用于我的帖子，就像这样。

@media screen and (min-width: 767px) {
p {
font-size: 21px;
padding-right: 20%;
padding-bottom: 10px;
padding-left: 20%;
}
}

显然，它适用于网站上的所有页面。在某些页面上很好，但主页/首页在计算机上搞砸了。如果向下滚动，帖子下方的摘录（描述）将应用这些边距。

如何使上述更改仅适用于帖子而不适用于首页/主页？为了清楚起见，我想从主页/首页中删除这些填充。我想把它们放在我的帖子上。

这是人们给我的建议之一，但没有奏效。如果我把这个数字从 20% 减少，什么也没有发生。如果我增加填充，边距会变大，好像最小值设置为 20%。

.home .posts-loop .entry-summary{
  font-size: 21px;
  padding-right: 20%;
  padding-bottom: 10px;
  padding-left: 20%;
}
4

5 回答 5

0

我希望你也分享了你的 HTML。但一般的答案是您选择了 html 文档中的所有 p 元素以具有提到的填充。所以当然它适用于页面上的任何地方。

解决方案 1：如果它们是单独的 html 页面，您可以链接单独的样式表并仅在所需页面中包含填充。

解决方案 2：更具体地使用 css 选择器。例如，如果帖子的包装器 div 的类为.posts，请按以下方式编写您的 css：

.posts p {
  font-size: 21px;
  padding-right: 20%;
  padding-bottom: 10px;
  padding-left: 20%;
}
于 2019-02-20T16:42:17.697 回答
0

我建议在主页上的 p 标签中添加一个类。HTML应该像

<p class="homepagepara">blah blah blah.....</p>

而css会像。

p.homepagepara {
    margin: 0;
    padding:0;
}

创建类后，您可以根据需要为这些页面设置样式。它将仅针对主页段落。希望这可以帮助。如果您有更多问题，请告诉我

于 2019-02-20T16:41:19.947 回答
0

欢迎艾哈迈德。

人们给你的建议不起作用，与类名有关（注意名称前的点： .home | .ports-loop | .entry-summary 。这表明是类）。

在您的第一个示例中，您只使用 p 。这会影响所有 p html 元素。

因此，您的解决方案是在要应用 css 规则的段落中添加一个类：

<p id="xxxx" name="xxxx" class="SomeClass">

然后，在您的 css 代码中，使用 .SomeClass {...} 设置要应用的规则。

此规则应仅应用于设置为 class="SomeClass" 的元素，而不应用于其他元素。

于 2019-02-20T16:41:42.063 回答
0

对于主页/首页，只需提供另一个自定义类名称，然后将填充设置为 0，否则您需要编写“！important”。例如 .cstm_home { padding: 0 !important; } 。我希望它能解决你的问题。

于 2019-02-20T16:35:03.230 回答
0

我看到的一个简单的方法是为主页创建一个不同的样式表。我不确定您是否使用全局样式表，如果是，则应删除将 CSS 链接到此页面的行。

更谨慎的方法是使用另一种类型的选择器而不是段落标签，在您希望以上述方式设置样式的所有段落中放置一个 id，并在您的 CSS 中使用此 id 或任何其他选择器。

干杯! 我希望这有帮助....

于 2019-02-20T16:35:51.767 回答