我有多个协同工作的网页。他们中的大多数都具有来自主文件的相同 css。我遇到的问题是一页需要 css 有点不同。这就是我的意思:
硕士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 */
}
页面的 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 或禁用它?
编辑 这就是我所说的(箭头):
最佳答案
我是这样做的:
主头部分:
<head>
<!-- other head stuff -->
<link href="css/master.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder ID="CPH_Css" runat="server" />
</head>
内容页:
<asp:Content ID="Content1" ContentPlaceHolderID="CPH_Css" runat="server">
<link href="css/content.css" rel="stylesheet" type="text/css" />
</asp:Content>
这样您就可以在内容页面中使用您想要的任何细节覆盖 master.css。
关于css - 从母版页中删除网页上的 CSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6064214/