DEV Community

loading...
Cover image for 10 HTML tags you need to know

10 HTML tags you need to know

pascavld profile image Pasca Vlad Originally published at blog.vlddev.live ・2 min read

If you found value in this thread you will most likely enjoy my tweets too so make sure you follow me on Twitter for more information about web development and how to improve as a developer. This article was first published on my Blog

1. Headings

<h1></h1>
Enter fullscreen mode Exit fullscreen mode

HTML headings are titles or subtitles that you want to display on a webpage.

You can choose from h1 which is the most important, to the h6 which is the least important heading.

2. Paragraph tag

<p></p>
Enter fullscreen mode Exit fullscreen mode

The "p" tag defines a paragraph (some text)

Browsers automatically add a single blank line before and after each "p" element.

3. Anchor tag

<a></a>
Enter fullscreen mode Exit fullscreen mode

The "a" tag defines a hyperlink, which is used to link from one page to another.

The most important attribute of the "a" element is the href attribute, which indicates the link's destination.

4. Unordered lists

<ul></ul>
Enter fullscreen mode Exit fullscreen mode

An unordered list starts with the "ul" tag. Each list item starts with the "li" tag.

The list items will be marked with bullets (small black circles) by default.

5. Ordered list tag

<ol></ol>
Enter fullscreen mode Exit fullscreen mode

An ordered list starts with the "ol" tag. Each list item starts with the "li" tag.

The list items will be marked with numbers by default.

6. Image tag

<img>
Enter fullscreen mode Exit fullscreen mode

The "img" tag is used to add an image in an website.

It' usually used with the "src" attribute, which specifies the path to the image we want to use.

7. Input tag

<input>
Enter fullscreen mode Exit fullscreen mode

The "input" tag specifies an input field where the user can enter data and it's also the most important form element.

It can be displayed in several ways, depending on the type attribute (button, checkbox, submit, etc)

8. Division tag

<div></div>
Enter fullscreen mode Exit fullscreen mode

The "div" tag defines a division or a section in an HTML document.

It is used as a container for HTML elements - which is then styled with CSS or manipulated with JavaScript.

Any sort of content can be put inside the "div" tag!

9. Label tag

<label></label>
Enter fullscreen mode Exit fullscreen mode

The tag defines a label for several input elements.

Inside this tag, we usually put the text we want to display next to the "input".

The for the attribute of "label" to work must be equal to the id attribute of the input.

10. Span tag

<span></span>
Enter fullscreen mode Exit fullscreen mode

The "span" tag is an inline container used to mark up a part of a text, or a part of a document.

It is much like the div element, but "div" is a block-level element and "span" is an inline element.

The end

I hope found this useful and if you did please let me know. If you have any question feel free to DM me on Twitter .

Discussion (0)

Forem Open with the Forem app