DEV Community

Kathirvel
Kathirvel

Posted on

Frequently Used HTML Tags <> </>

#html #webdev #beginners

For a BASIC STRUCTURE

<!DOCTYPE html>
<html>
    <head>
        <title>Title</title>
    </head>
    <body>
    </body>
</html>
Enter fullscreen mode Exit fullscreen mode

Text & Headings

<h1> to <h6>  Headings
<p>            Paragraph
<br>           Line break
<hr>           Horizontal rule
<span>         Inline container
<div>          Block container
Enter fullscreen mode Exit fullscreen mode

Links & Images

<a href="url">Link</a>
<img src="img.jpg" alt="text">

LISTS

     <ul>  Unordered list
     <ol>  Ordered list
     <li>  List item
Enter fullscreen mode Exit fullscreen mode

FORMS


<form>
      <input type="text (or)| email (or)| password">
      <textarea></textarea>
      <button>Submit</button>
</form>
Enter fullscreen mode Exit fullscreen mode

Tables


<table>
    <tr> Table row
    <th> Header
    <td> Data
</table>
Enter fullscreen mode Exit fullscreen mode

Semantic Tags


<header>   Page header
<nav>      Navigation
<main>     Main content
<section>  Section
<article>  Article
<aside>    Sidebar
<footer>   Footer
Enter fullscreen mode Exit fullscreen mode

CSS & JS


   <link rel="stylesheet" href="style.css">
   <style> CSS </style>
   <script src="script.js"></script>
Enter fullscreen mode Exit fullscreen mode

Common Attributes


   id      Unique identifier
   class   Reusable style
   src     Source file
   href    Link reference
   alt     Image text
Enter fullscreen mode Exit fullscreen mode

Top comments (2)

Collapse
 
payilagam_135383b867ea296 profile image
Payilagam •

Could you please explain the difference between tags and Semantic tags

Some comments may only be visible to logged-in visitors. Sign in to view all comments.