[英]change background color different text in table html
i have a table in html and i need to change the color of backgrund in the i have a tow diffrent word in this normal or high for normal i need a yello bgcolor for high i need a red bgcolor i need to do this in css or javascript?我有一个 html 表格,我需要更改背景中的背景颜色,我有一个普通或高的两个不同的词,我需要一个黄色的 bgcolor 高我需要一个红色的 bgcolor 我需要在 css 中执行此操作或javascript?
this is my simple code:这是我的简单代码:
<tr>
<td class='tg-yw4l'></td>
<td class='tg-s6z2'></td>
<td class='tg-s6z2'></td>
<td class='tg-baqh' rowspan='2'></td>
<td class='tg-baqh' rowspan='2'>Normal Different</td>
</tr>
I would suggest to create two css classes我建议创建两个 css 类
.red{color:red}
.yellow{color:yellow}
And when creating the table, just wrap the word in a span and add the relevant class并在创建表时,只需将单词包裹在一个跨度中并添加相关类
<span class='red'>High</span>
I can't understand your question exactly, but I do hope that this is helpful.我无法完全理解您的问题,但我确实希望这会有所帮助。 this is a js sample ( In my point of view, generate by serverside is more easier )
这是一个 js 示例(在我看来,由服务器端生成更容易)
HTML HTML
<table>
<tr>
<td class='tg-yw4l'></td>
<td class='tg-s6z2'></td>
<td class='tg-s6z2'></td>
<td class='tg-baqh' rowspan='2'></td>
<td class='tg-baqh bg' rowspan='2'>Normal</td>
</tr>
</table>
CSS CSS
.red{background-color:red}
.yellow{background-color:yellow}
JS JS
$(document).ready( function() {
$('.bg').each( function() {
var $this = $(this);
if( $this.text() == "Normal" ) {
$this.addClass("red");
}
});
});
The easiest way I know how to do this would be to take your class and use a CSS stylesheet.我知道如何做到这一点的最简单方法是参加您的课程并使用 CSS 样式表。 Use something like this at the top of your html page to link the external stylesheet.
在 html 页面顶部使用类似的内容来链接外部样式表。
<link href= "file location" rel="stylesheet" type="text/css">
Then go to the stylesheet you have created and enter the name of your class after a dot and enter something like this然后转到您创建的样式表并在一个点后输入您的类的名称并输入类似这样的内容
.classname
{
background-color:red;
}
This way you can always add more formatting to your classes.通过这种方式,您始终可以为类添加更多格式。 You can also look up the code to all sorts of colors online.
您还可以在线查找各种颜色的代码。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.