Question

我不得不将一些PSD-s转换为html，但每个页面都有自己的样式，所以我前进并为每个制作一个。

客户现在要求将它们合并为一个。这可能吗？

感谢。

编辑：他们没有唯一的ID /类。

Answer 1

由于您已将PSD转换为HTML，我假设您仍然可以访问代码？在这种情况下，最好的方法是为每个页面提供一个足够高的唯一标识符（类或ID），以便您可以使用父/子选择器。例如：

第1页：

<body id="aboutus">

第2页：

<body id="services">

然后，您可以通过CSS定位同一CSS文件中每个页面上的元素（特异性法则将生效：https://www.smashingmagazine.com/2007/07/css-specificity-things-you-should-know/）：

#aboutus h1 {
    color: red;
}

#services h1 {
    color: green;
}

选项2（Darren Sweeney的信用）：

除了向上面提到的body元素添加id / class之外，您还可以使用CSS预处理语言（如SASS / SCSS）轻松地为每个页面添加样式。例如：

<强> SCSS：

#aboutus {
    h1 {
        color: red;
    }
    p {
        font-size: 10px;
    }
    a {
        text-decoration: underline;
        .active {
            color: #fff;
        }
    }
}
#services {
    h1 {
        color: green;
    }
    p {
        font-size: 15px;
    }
    a {
        text-decoration: underline;
        .active {
            color: #000;
        }
    }
}

将多个CSS文件合并为一个

1 个答案: