Question

我正在尝试使用样式表来实现对复选框的更改。我知道CSS很好，因为当它是内联时，它就像一个冠军。

internal_users.asp是需要格式化的，但它从i_internal_headers.asp继承（类似于母版页），其中样式是实现的。

代码：

stylesheet:
.checkbox {
margin: 4px 0;
padding: 0;
width:50px;
border:none;
background:none;
}

i_internal_headers.asp
<link rel="stylesheet" type="text/css" href="../css/stylesheet.css">

internal_users.asp
<!-- #include file="include/i_internal_headers.asp" -->
<input type="checkbox" class="styled" value="" />

我也试过了样式表输入[type = checkbox] {}

我还尝试创建一个名为TrialCheckboxStylesheet.css的全新样式表，并将所有css放在那里。仍然没有奏效。是的，我在i_internal_headers

中添加了一个新的链接参考

EDITTED：我目前的代码如下：

.cbClear {
margin: 4px 0;
padding: 0;
width:50px;
border:none;
background:none;

}

<input type="checkbox" class="cbClear" value="" />.

在IE上使用开发者工具时，我发现了这个

#rightcolumn input, #rightcolumn textarea, #rightcolumn select { 
padding: 5px; 
width: 299px; 
font: 100% arial; 
border: 1px solid #D5D5D5; 
background: #FFF; 
color: #47433F;
border-radius: 7px 7px 7px 7px;
-moz-border-radius: 7px 7px 7px 7px;
-webkit-border: 7px 7px 7px 7px;

}

似乎覆盖了复选框的其他CSS。那么，我如何让复选框一个优先于另一个呢？

Answer 1

这就是我必须做的事情

#rightcolumn input.cbClear {
margin:4px 0 !important;
padding:0 !important;
width:50px !important;
border:none !important;
background:none !important;

}

在stylesheet.css

中

这使得优先覆盖先前的CSS

感谢Tetsujin no Oni的帮助和快速解答。

Answer 2

我认为你的问题在于css的相对路径。到目前为止，我可以假设您的文件结构类似于以下

root
|
|-include
  |-i_internal_headers.asp
|-css
  |-stylesheet.css
|-internal_users.asp

因此，当您从浏览器调用internal_users.asp文件时，它会在位于根文件夹的父文件夹中的css文件夹中查找stylesheet.css文件。出现此问题的原因是您已在i_internal_headers.asp

中为样式表指定了相对路径

解决此问题会更改绝对路径的相对路径。像这样 -

<link rel="stylesheet" type="text/css" href="/css/stylesheet.css"><!-- remove the two dots in from of /css -->

这告诉服务器样式表位于root/css文件夹下。

CSS，经典ASP，复选框

2 个答案: