在后面的代码中访问外部样式表

Question

我有一个无序列表（HTML），我在后面的代码中有条件地改变它的样式

<ul class="steps">
  <li class="" id="step1" runat="server">Step 1</li>
  <li class="step2" id="step2" runat="server">Step 2</li>
  <li class="step3" id="step3" runat="server">Step 3</li>
  <li class="step4" id="step4" runat="server">Step 4</li>
</ul>

在我正在做某事的代码中

step1.Attributes["class"] = "step1";
step2.Attributes["class"] = "step2New";

类似的东西

如果我使用内部样式，那么它工作正常，但是当我将相同的样式表带到外部文件时，它就不能工作

是不是因为我正在使用我不知道的 id 分配属性，请帮助我

css 文件是这样的

ul.steps li 
{
display:block;   
position:relative;
float: left;
color: white;
background: url('Images/steps.png') left -518px no-repeat;
min-height:60px;
height: 4em; 
min-width:202px;
width:20%;
line-height: 4em;
font-weight: bold;
font-size: 130%;
margin-bottom:1em;
text-align:center;
overflow:hidden;
margin-left:-20px;
}
ul.steps li.step1
{
    background-position: left -418px;
}
ul.steps li.step2,ul.steps li.step3New, ul.steps li.step4New,ul.steps li.step4New2
{
    background-position: left -118px;
}
ul.steps li.step2New
{
    background-position: left -218px;
}
ul.steps li.step2New2
{
    background-position: left -318px;
}
ul.steps li.step3, ul.steps li.step4
{
    background-position: left -18px;
}
/*ul.steps li.step3New
{
    background-position: left -118px;
}*/
ul.steps li.step3New2
{
    background-position: left -218px;
}
ul.steps li.step3New3
{
    background-position: left -318px;
}
/*ul.steps li.step4New
{
    background-position: left -118px;
}
ul.steps li.step4New2
{
    background-position: left -118px;
}*/
ul.steps li.step4New3
{
    background-position: left -218px;
}
li
{
list-style-type:none;
display:inline;
}

Answer 1

您是否正确引用了外部 CSS 文件？您需要在 html 的 head 部分放置一个 link 元素，其中 href 属性指向 CSS 文件：

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

Answer 2

使用

 background: url('../Images/steps.png') left -518px no-repeat;