如何在HTML中创建表格的行和列?
HTML表格允许我们在网页上将数据按行和列进行排列。
我们使用
、 |
---|
元素来设置表头、行和列以及表格数据。 表格行由 |
标签。示例以下是创建表格行和列的示例程序。 立即学习“前端免费学习笔记(深入)”; <!DOCTYPE html><html> <style> table { border:1px solid black; padding: 10px; } th, td{ border:1px solid black; padding: 20px; } </style><body> <h2>Tables in HTML</h2> <table style="width: 100%"> <tr> <th></th> <th></th> <th></th> </tr> <tr> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> </tr> </table></body></html> 示例以下是另一个创建表格行和列的示例程序。 <!DOCTYPE html><html><head> <style> table, th, td { border: 1px solid green; } </style></head><body> <h2>Adding table rows and colomns in HTML</h2> <table> <tr> <th>S.no</th> <th>Name</th> <th>Age</th> <th>Country</th> </tr> <tr> <td>1</td> <td>Kohli</td> <td>34</td> <td>India</td> </tr> <tr> <td>2</td> <td>Rabada</td> <td>29</td> <td>South Africa</td> </tr> <tr> <td>3</td> <td>Starc</td> <td>33</td> <td>Australia</td> </tr> </table></body></html> 示例下面是另一个用于创建表行和列的示例程序。 <!DOCTYPE html><html><head> <style> table, th, td { border: 1px solid green; } </style></head><body> <h2>Adding table rows and colomns in HTML</h2> <table style="width:80%"> <caption>Cricketers...</caption> <tr style="background-color: Mediumseagreen"> <th>S.no</th> <th>Name</th> <th>Age</th> <th>Country</th> </tr> <tr> <td>1</td> <td>Kohli</td> <td>34</td> <td>India</td> </tr> <tr> <td>2</td> <td>Rabada</td> <td>29</td> <td>South Africa</td> </tr> <tr style="background-color: Mediumseagreen"> <td>3</td> <td>Starc</td> <td>33</td> <td>Australia</td> </tr> </table></body></html> |