[T8] Background-color on Tables
❊ Visual Illusions ❊ ║ A Portfolio ║ Layout Suggestions Open ║ New - Wish On The Same SkyHOME I LAYOUTS I FANFICTIONS I REQUEST SHOP
Background-color on Tables (August 6, 2018)
❊
In this tutorial, I will be going over how to add background colors on tables.
Step 1
Click on the table icon on the editor (it's beside the image and insert horizontal line icons; the 15th icon from the top source line; has a solid gray line and two rows of 3 boxes each). Set your table properties as you wish.
For this tutorial, I will set mine to 3 rows, 2 columns, 1 border size and 300 width.
Like this:
Step 2
Now, find the codes to the layout by clicking 'Source' at the top. It should look something like this:
<table border="1" cellpadding="1" cellspacing="1" style="width:300px;"><tbody>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
Step 3
If you want to make both the top row colored black (because the border is black on default), find the code to the first row and add the code 'background-color:black'.
Note: Every row is divided by the <tr> </tr> tag while each column is marked by a <td> </td> tag.
<table border="1" cellpadding="1" cellspacing="1" style="width:300px;"><tbody>
<tr style="background-color:black;">
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
So once that's added, it should look like this:
Step 4
If you want to make the first column colored black, then use the same background-color code but instead, use it on the columns tag.
<table border="1" cellpadding="1" cellspacing="1" style="width:300px;"><tbody>
<tr>
<td style="background-color:black;"> </td>
<td> </td>
&
Comments