How to create content table for long articles with html or css

Discussion in 'Web Design, HTML And CSS' started by AnjaliK, Nov 24, 2017.

Tags:
  1. AnjaliK

    AnjaliK Member

    Joined:
    Aug 25, 2017
    Messages:
    45
    Likes Received:
    3
    Trophy Points:
    8
    Gender:
    Female
    Location:
    India
    Home Page:
    https://bdigitau.com
    Hi guys please help me I want to know how to create a content table for long articles I get a suggestion for some wordpress plugins but I want to do it with html and css, is it possible with it if yes then please guide me for this.
     
    Last edited: Nov 24, 2017
    AnjaliK, Nov 24, 2017
    SHARE #1
  2. persysweb

    persysweb Member

    Joined:
    Aug 1, 2017
    Messages:
    98
    Likes Received:
    18
    Trophy Points:
    8
    Location:
    India
    Home Page:
    httpS://persys.in/
    You will need to use <table>, <tr>, <td> tags for developing the table in HTML or CSS.

    <table> specifies the whole table.
    <tr> is table row.
    <td> is table data.
    <th> is for table heading

    So simple table structure will be as below -

    <table>
    <tr>
    <td>
    </td>
    </tr>
    </table>

    You will get number of tutorials for developing the table. Hope this will help you. :)
     
    persysweb, Nov 25, 2017
    SHARE #2
  3. AnjaliK

    AnjaliK Member

    Joined:
    Aug 25, 2017
    Messages:
    45
    Likes Received:
    3
    Trophy Points:
    8
    Gender:
    Female
    Location:
    India
    Home Page:
    https://bdigitau.com
    but how to provide links if you want to skip some points and want to visit next
     
    AnjaliK, Nov 27, 2017
    SHARE #3
  4. NoahOwen

    NoahOwen New Member

    Joined:
    Jun 26, 2019
    Messages:
    1
    Likes Received:
    0
    Trophy Points:
    1
    Gender:
    Female
    If you have website and you know how to write long form content then install TOC+ that helps your content by displaying heading on top of the content. You can skip few headings from the content which doesn't interest you!
     
    NoahOwen, Jul 10, 2019
    SHARE #4
  5. iamwongchen

    iamwongchen New Member

    Joined:
    Jul 24, 2019
    Messages:
    7
    Likes Received:
    0
    Trophy Points:
    1
    Gender:
    Male
    Occupation:
    Marketing Consultant
    Location:
    Singapore
    You can learn from this code

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    table, th, td { border: 1px solid black; }
    </style>
    </head>
    <body>
    <h2>Bordered Table</h2>
    <p>Use the CSS border property to add a border to the table.</p>
    <table style="width:100%">
    <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
    </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
    </tr>
    <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
    </tr>
    <tr>
    <td>John</td>
    <td>Doe</td>
    <td>80</td>
    </tr>
    </table>
    </body>
    </html>
     
    iamwongchen, Sep 6, 2019
    SHARE #5

Share This Page

  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Accept Learn More...
    Dismiss Notice