Question

我有多个网页可以协同工作。它们中的大多数都具有来自主文件的相同css。我遇到的问题是一页需要css有点不同。这就是我的意思：

Master's CSS

  .Close
  {
      position: relative;
      top: 0px; /* Different */
      display: block; /* Different */
      margin: auto; /* Different */
  }

.ArrowLeft
{
    background-image: url(arrow_left.png);
    border: 0 none transparent;
    padding: 0 0 0 0;
    position: relative;
    top: 0px;
    height: 37px;
    width: 47px;
    z-index: 10;
    display: none;
    background-color: transparent;
    float: left; /* Different */
}

.ArrowRight
{
    background-image: url(arrow_right.png);
    border: 0 none transparent;
    padding: 0 0 0 0;
    position: relative;
    top: 0px;
    height: 37px;
    width: 47px;
    z-index: 10;
    display: none;
    background-color: transparent;
    float: right; /* Different */
}

Page的CSS

.ArrowLeft
{
    background-image: url(arrow_left.png);
    border: 0 none transparent;
    padding: 0 0 0 0;
    position: absolute;
    height: 24px;
    width: 25px;
    z-index: 10;
    display: none;
}

.ArrowRight
{
    background-image: url(arrow_right.png);
    border: 0 none transparent;
    padding: 0 0 0 0;
    position: absolute;
    left: 258px;
    height: 24px;
    width: 25px;
    z-index: 10;
    display: none;
}

  .Close
  {
      position: relative;
      top: -1px;
      left: 105px;
  }

请注意差异很小（margin: auto，float: left ..等等）我希望这些差异不会发生在我的网页的CSS中。我知道float: none会删除floats，但如何删除不同的display，top和margin属性？我只想更改类名，但所有页面都使用相同的.js文件，因此重命名它们会很长/不需要。

建议？

有没有办法只关闭主css或为这些类禁用它？

编辑以下是我所说的（箭头）：

enter image description here

Answer 1

我这样做：

主人头部分：

<head>
    <!-- other head stuff -->

    <link href="css/master.css" rel="stylesheet" type="text/css" />
    <asp:ContentPlaceHolder ID="CPH_Css" runat="server" />
</head>

ContentPage：

<asp:Content ID="Content1" ContentPlaceHolderID="CPH_Css" runat="server">
    <link href="css/content.css" rel="stylesheet" type="text/css" />
</asp:Content>

这样你就可以在内容页面中用你想要的任何细节覆盖master.css。

从母版页删除网页上的CSS

1 个答案: