任何人都可以帮助我理解为什么我的CSS不能在1个特定的wordpress页面上工作

时间:2015-04-24 23:01:58

标签: html css wordpress

我有一个wordpress页面,除了我添加到它的最新页面之外,它可以正常工作。 Wordpress中的自定义CSS确实有效,直到它突然停止工作并且我已经验证了CSS文件没有错误。

以下是.CSS文件(或者我今天编辑的部分内容):

    .page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 #bigbox {
    width: 100%;
    height: 850px;
    background-color: #222;
}

.page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 h1 {
    margin-top: -40px;
}

.page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 h2 {
    margin-top: -30px;
}

.page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 #scrollline {
    width: 100%;
    height: 350px;
    background-color: #222;
    position: static;
}

.page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 #product {
    width: 23%;
    height: 340px;
    background-color: #333;
    margin-top: 5px;
    margin-left: 17px;
    display: inline-block;
    position: static;
    border: solid 1px #bf4d28;
}

.page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 #productpack {
    width: 48%;
    height: 340px;
    background-color: #333;
    margin-top: 5px;
    margin-left: 17px;
    display: inline-block;
    position: static;
    border: solid 1px #bf4d28;
}

.page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 #name {
    width: 90%;
    height: 40px;
    background-color: #222;
    margin: auto;
    margin-top: 10px;
    text-align: center;
}

.page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 #image {
    width: 200px;
    height: 200px;
    background-color: #222;
    margin: auto;
    margin-top: 10px;
    text-align: center;
}

.page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 #imagepack {
    width: 400px;
    height: 200px;
    background-color: #222;
    margin: auto;
    margin-top: 10px;
    text-align: center;
}

.page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 #downow {
    width: 90%;
    height: 40px;
    background-color: #222;
    margin: auto;
    margin-top: 10px;
    text-align: center;
    font-size: 24px;
    text-align: center;
    color: #bf4d28;
    transition-duration: .5s;
}

.page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 .norm {
    margin-top: -5px;
}

.page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 #boxhead {
    width: 75%;
    height: 50px;
    text-align: center;
    margin: auto;
    margin-top: 10px;
}

对于这四页,它做了同样的事情。当我有三个页面时,它运行正常,但是当我添加第四个并且CSS停止为页面的工作而停止工作时,这一切都变得很糟糕。

链接到该网站,以便您解决问题:http://www.the-prototype92.com/planetary-rings/

我正在使用Google Chrome btw :)

1 个答案:

答案 0 :(得分:1)

如果我不得不猜测我说你混淆了选择器链接。

.page-id-1276,
.page-id-1282,
.page-id-1284,
.page-id-1287 h1 {
    margin-top: -40px;
}

这就是说类.page-id-1276,.page-id-1282和.page-id-1284的余量为-40px。但也要为.page-id-1287中的所有h1标签提供h1 -40px。

我认为你打算这样做:

.page-id-1276 h1,
.page-id-1282 h1,
.page-id-1284 h1,
.page-id-1287 h1 {
    margin-top: -40px;
}

这适用于您提供的所有示例。如果我错了,你确实打算以这种方式选择东西,请告诉我,我会重新审视。