How to make a table in html and css

Okay everyone Now we will learn how to create a table with html and css. Let's go straight to the first we open the Sublime text application so here we create a Project first we go here we create a folder the table folder finally then we Open using sublime text in the document earlier I was here we create an html file for example here table.html then we create a CSS file for example tablestyles.css let's go straight to the HTML we create a basic HTML tag first okay to create a table in html we use the <table> tag then close it with </table> and for rows use <tr> and the number of columns in each we move <td> 

 

For example the number yes the first column the second column number is for example there is First Name and the third column we use LastName we try to see the results first yes we try to look first to the right okay then we open the table. Well, this is the table from before. Well, why doesn't it appear because we haven't given it properties. We open it again. Let's try it here. Give it border: 1px. This one pixel means flash again. Well, this is the table like this. The table we just made. Okay, let's try it. Style. The table style uses CSS, for example here. But we level the sales table first. Link or selfie should be table style. Then we try it here. For example, the dede. We give the border bottom solid blue. We try the data. Then we try the dpr again. The dpr. Give it a background color. This is the magetan label style. We try it when it's hovered. Okay, that's enough. For example, here in the td, what was made is like this. So for the number of rows, the summary is to create rows using <tr> and to create columns using <td>.

Tutorial video



Conclusion

table.html type:


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Make Table</title>
<link rel="stylesheet" type="text/css" href="tablestyles.css">
</head>
<body>
<table border="1px">
<tr>
<td>No</td>
<td>First Name</td>
<td>Last Name</td>
</tr>
<tr>
<td>1</td>
<td>Erick</td>
<td>John</td>
</tr>
</table>

</body>
</html>

tablestyles.css type:
td{
border-buttom: 1px solid blue;
}
tr:hover{
background-color: magenta;
}

Thank you and see you guys.

0 Response to "How to make a table in html and css"

Posting Komentar