html 1 _ how to color particular table cells?

57 Views Asked by At

this is the result i want this is the result i am getting(ignore the image)

This is my code

<html>
    <head>
        <title> Practical 4 </title>
        <meta  charset ="UTf-8">
    </head>
    <body bgcolor ="lightblue">
        <table border="1" bordercolor="black"  cellspacing="1" align ="center">
        <tr>
        <td bordercolor ="red"> ** </td>
        <td bordercolor ="blue"> আমার </td>
        <td bordercolor ="green">দেশের </td>
        <td bordercolor = "red" >**</td>
        </tr>
        <tr>
        <td bordercolor ="red">**</td>
        <td bordercolor ="darkblue" colspan="2" rowspan="2"> <img src="image_to_use.jpg"></td>
        <td bordercolor ="red"> ** </td>
        </tr>
        <tr>
        <td bordercolor ="red" >**</td>
        <td bordercolor ="red" >**</td>
        </tr>
        <tr>
         <td bordercolor ="red"> ** </td> 
         <td bordercolor ="blue">নাম</td>
         <td bordercolor ="green">বাংলাদেশ </td> 
         <td bordercolor ="red">**</td>
         </tr>
        </table>
    </body>
</html> 
    
    
        

it would be very helpful if i could know how to color particular table cells

3

There are 3 best solutions below

3
On

You can color your table cells with access specifier. If you want to apply the same color to multiple cells use 'class'.

**

if you want to apply different color to each cell use 'id';

**

In CSS:

Style based on class

.classname{
    background-color: red;
}

Style based on id

.idname{
    background-color: red;
}
3
On

Instead of HTML attributes, you should use CSS. You can color your cells with for loop in JS.

0
On
<html>
<head>
    <title> Practical 4 </title>
    <meta  charset ="UTf-8">
</head>
<body bgcolor ="lightblue">
    <table border="1" border-color="black"  cellspacing="1" align ="center">
    <tr>
    <td style=" border-color :red;"> ** </td>
    <td style=" border-color :blue;"> আমার </td>
    <td style=" border-color :green;">দেশের </td>
    <td style=" border-color :red ;" >**</td>
    </tr>
    <tr>
    <td style=" border-color :red;" >**</td>
    <td style=" border-color :darkblue ;" colspan="2" rowspan="2"> <img src="image_to_use.jpg"></td>
    <td style=" border-color :red;"> ** </td>
    </tr>
    <tr>
    <td style=" border-color :red ;" >**</td>
    <td style=" border-color :red ;" >**</td>
    </tr>
    <tr>
     <td style=" border-color :red;"> ** </td> 
     <td style=" border-color :blue;">নাম</td>
     <td style=" border-color :green;">বাংলাদেশ </td> 
     <td style=" border-color :red;">**</td>
     </tr>
    </table>
</body>