This next tutorial should be easy. This is the 11th tutorial of the HTML: how to add tables to our website
Let's go to our index.html file.
If you are already on the index.html page, let's go there
Formula to add a table is👇
<table>
<tr>
<td></td>
</tr>
</table>
Pls understand the basics.
When you have
<html>
The one below should be different
Like this👇
</html>
It can't be the same.
Same thing with others.
<body>
</body>
<title> </title>
<head>
</head>
<h1> </h1>
It is only
</br> line breaks
<img> image tag
<hr> horizontal rule
That have only one tag
Pls let's study our code very well. I don't want to see something like this again👇
<html>
<html>
It doesn't make sense
<table>
</table>
Means we have a table here but a table without table row 👇
<tr>
</tr>
Will look empty
And a table row without table data (text or contents) 👇
<td> </td> will still be empty. Until we add text within the space between <td> </td>
Like this👇
<td> Names </td>
Copy this 👇and paste in your code editor
A line above </body> tag
Pls shine your eyes🧐 very well to see the different.
Above this </body> NOT this <body>❌
<table>
<tr>
<td> Names </td>
</tr>
</table>
Copy this 👆🏽
And use it to create more table data
Like this👇
<tr>
<td>John</td>
<td>Juliet</td>
<td>Kenny</td>
</tr>
This should be above the </table>
You can use this sample👇
If you preview your website, you will see something like this👇
Though, truly with the code we have on our text editor, there is a table coz we wrote
<table>
</table>
But we didn't give our table a border size that's why it's invisible
I want you to use the scope of reducing image with the height attribute to add border to your table.
It's very simple; like this 👇
If you preview it now, you will see the table.
And use it to create more table data
Like this👇
<tr>
<td>John</td>
<td>Juliet</td>
<td>Kenny</td>
</tr>
This should be above the </table>
You can use this sample👇
If you preview your website, you will see something like this👇
Though, truly with the code we have on our text editor, there is a table coz we wrote
<table>
</table>
But we didn't give our table a border size that's why it's invisible
I want you to use the scope of reducing image with the height attribute to add border to your table.
It's very simple; like this 👇
If you preview it now, you will see the table.
