Creating a full tag table with HTML

Question

I'm actually a beginner in programming and I tried to write a full table codes like ( the pic below), but can anyone write the full taga to me and if I couldn't do it I will try to mimic the right on.enter image description here

Answer 1

This is a simple html code. Presented in an understandable way in w3schools. https://www.w3schools.com/html/html_tables.asp

Explanation: You need first declarate the table, then header and body.

• tr - row
• th - header cell
• td - simple cell

I used a few attributes in tags.

• border - border
• width - table width
• rowspan - An HTML table with a table cell that spans two rows (https://www.w3schools.com/tags/att_td_rowspan.asp)
• colspan - An HTML table with a table cell that spans two columns (https://www.w3schools.com/tags/att_td_colspan.asp)

And I used the following tags:

• img - the image src the url/path alt the text, which appears when you cannot reach the image (https://www.w3schools.com/tags/tag_img.asp)
• br - break line (https://www.w3schools.com/tags/tag_br.asp)
• hr - thematic break line (https://www.w3schools.com/tags/tag_hr.asp)

The full code:

 <table border="1" width="100%">
        <thead>
            <tr>
                <th>Group</th>
                <th>Avatar</th>
                <th>Name</th>
                <th>Email</th>
                <th>Character</th>
                <th>Profile</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td rowspan="2">Ninja</td>
                <td><img src="resources/red.jpg" alt="red avatar"></td>
                <td>
                    Osama
                    <br>
                    Mohamed
                </td>
                <td>
                    [email protected]
                    <hr>
                    [email protected]
                </td>
                <td>©</td>
                <td><a href="profile_url">profile</a></td>
            </tr>
            <tr>
                <td><img src="resources/blue.jpg" alt="blue avatar"></td>
                <td>
                    Shady
                    <br>
                    Nabil
                </td>
                <td>[email protected]</td>
                <td>™</td>
                <td><a href="profile_url">profile</a></td>
            </tr>
            <tr>
                <td>Monsters</td>
                <td><img src="resources/black.jpg" alt="black avatar"></td>
                <td>
                    Mohamed
                    <br>
                    Ibrahim
                </td>
                <td>[email protected]</td>
                <td>®</td>
                <td><a href="profile_url">profile</a></td>
            </tr>
            <tr>
                <td colspan="5">Total Members</td>
                <td>3</td>
            </tr>
        </tbody>
    </table>