如何从代码后面添加CSS类到asp.net

时间:2022-11-22 23:02:16

this is really frustrating and have search a dozen sites:

这真的很令人沮丧,搜索了十几个网站:

I have a <asp:table id="questionsTable" runat="server"> to which i dynamically add rows and columns. I am trying to add a predefined Cssclass to these newly created rows and columns, but to no avail.

我有一个

,我在其中动态地添加行和列。我试图向这些新创建的行和列添加一个预定义的Cssclass,但没有效果。

The setup code for the rows and columns:

行和列的设置代码:

TableRow row = new TableRow();
TableCell cell1 = new TableCell();
TableCell cell2 = new TableCell();
TableCell cell3 = new TableCell();
TableCell cell4 = new TableCell();
TableCell cell5 = new TableCell();

I know i can do this:

我知道我能做到:

row.Style.Add("width", "80%");
row.Style.Add("text-align", "left");

cell1.Style.Add("width", "10px");
cell2.Style.Add("width", "auto");
cell3.Style.Add("width", "75px");
cell4.Style.Add("width", "75px");
cell5.Style.Add("width", "75px");

And it works... but it makes the code-behind file messy.

和它的工作原理……但是它使代码隐藏文件变得混乱。

So i've seen this:

所以我看到这个:

row.Attributes.Add("Class", "rowA");

//CSS - in StyleSheet.css
.rowA
{
    width:80%;
    text-align:center;
    background-color:#FCF6CF;
}

But it does not seem to be working for me....

但这似乎并没有为我工作....

But strangely enough if i look at the markup source generated i get this

但奇怪的是,如果我查看生成的标记源代码,就会得到这个

    </tr><tr Class="rowA">

The above is copied from the rendered page - yet the Css is not being applied... I know the css is correct because if i add it manually it applies it correctly.

上面的内容是从呈现的页面复制的——但是Css并没有被应用……我知道css是正确的,因为如果我手动添加它,它会正确地应用它。

EDIT

编辑

To all who assisted in this thank you very much. Unfortunately something went wrong and the link to the external stylesheet got deleted. Kudos to Sven for thinking of that. After a long day such as today i to can make beginner mistakes.

感谢所有在这方面给予帮助的人。不幸的是,出现了问题,并删除了到外部样式表的链接。这一点值得称赞。像今天这样漫长的一天之后,我可以犯初学者的错误。

thank you once again

谢谢你再一次

Kind regards

亲切的问候

Aiden

艾登

3 个解决方案

#1


5  

When the generated html output of the row has the class, then there is the css file not linked in the html file, or you have a typo in the class name.

当行生成的html输出具有类时,html文件中就没有链接css文件,或者类名中有一个排版错误。

#2


7  

Your class attribute should be lowercase (XHTML):

你的类属性应该是小写的(XHTML):

row.Attributes.Add("class", "rowA");

Also make sure your including the CSS file in the page your rendering your table.

还要确保在页面中包含CSS文件,并呈现表格。

#3


1  

There is nothing wrong with your code behind. Its your CSS that is wrong.

您的代码在后面没有问题。是你的CSS出错了。

Refer the W3 docs on tables:

请参阅表上的W3文件:

the horizontal layout of the table does not depend on the contents of the cells; it only depends on the table's width, the width of the columns, and borders or cell spacing.

表的水平布局不依赖于单元格的内容;它只取决于表的宽度、列的宽度以及边框或单元格间距。

if you want the rows to have 80% width, you should set the table width to 80%. Like this:

如果您希望行的宽度为80%,那么应该将表的宽度设置为80%。是这样的:

<asp:table id="questionsTable" runat="server" class="myTable">

.rowA
{
   text-align:center;
   background-color:#FCF6CF;
}

.myTable{
   width:80%;
}

#1


5  

When the generated html output of the row has the class, then there is the css file not linked in the html file, or you have a typo in the class name.

当行生成的html输出具有类时,html文件中就没有链接css文件,或者类名中有一个排版错误。

#2


7  

Your class attribute should be lowercase (XHTML):

你的类属性应该是小写的(XHTML):

row.Attributes.Add("class", "rowA");

Also make sure your including the CSS file in the page your rendering your table.

还要确保在页面中包含CSS文件,并呈现表格。

#3


1  

There is nothing wrong with your code behind. Its your CSS that is wrong.

您的代码在后面没有问题。是你的CSS出错了。

Refer the W3 docs on tables:

请参阅表上的W3文件:

the horizontal layout of the table does not depend on the contents of the cells; it only depends on the table's width, the width of the columns, and borders or cell spacing.

表的水平布局不依赖于单元格的内容;它只取决于表的宽度、列的宽度以及边框或单元格间距。

if you want the rows to have 80% width, you should set the table width to 80%. Like this:

如果您希望行的宽度为80%,那么应该将表的宽度设置为80%。是这样的:

<asp:table id="questionsTable" runat="server" class="myTable">

.rowA
{
   text-align:center;
   background-color:#FCF6CF;
}

.myTable{
   width:80%;
}