HTML Tutorial | Creating tables

Home Forums Tech HTML HTML Tutorial | Creating tables

Tagged: 

This topic contains 0 replies, has 1 voice, and was last updated by  MasterMind 1 month, 3 weeks ago.

Viewing 1 post (of 1 total)
  • Author
    Posts
  • #369

    MasterMind
    Keymaster

    Tables in HTML are defined using the <table> tag .

    The <tr> tag allows you to create a row in the table, and a <td> tag to add a data cell to this row.

    By default, tables are displayed without borders. In order to display the border, you must use the border = “1” attribute.

    Note: in the cells of the tables can be located not only the usual text, but also pictures, links and other tables.

    Example

    <The table border = "1" > <tr> <td> Russian </ td> <td> 141 </ td> </ tr> <tr> <td> US </ td> <td> 309 </ td> </ tr> <tr> <td> China </ td> <td> 1338 </ td> </ tr> <tr> <td> United Kingdom </ td> <td> 61 </ td> </ tr> </ table> 
    

    Table headers

    Using the <th> tag, you can create a table header. The text of the element th is centered and highlighted in bold.

    <table border = '1' > <tr> <th> Heading 1 </ th> <th> Heading 2 </ th> <th> Heading 3 </ th> </ tr> <tr> <td> Cell 1 </ td> <td> Cell 2 </ td> <td> Cell 3 </ td> </ tr> <tr> <td> Cell 4 </ td> <td> Cell 5 </ td> <td> Cell 6 </ td> </ tr> </ table> 
    

     

    Stretching cells

    With the colspan attribute, you can specify how many columns the specified cell should stretch.

    Example

    <The table border = "1" > <tr> <td> cell 1 </ td> <td> cell 2 </ td> </ tr> <tr> <td the colspan = "2" > Cell 3 stretched by 2 column </ td> </ tr> </ table> 
    

    Using the rowspan attribute, you can specify how many lines the specified cell should stretch.

    Example

    <table border = "1" > <tr> <td rowspan = "2" > Cell 1 stretched over two lines </ td> <td> cell 2 </ td> </ tr> <tr> <td> cell 3 </ td> </ tr> </ table> 
    

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.