Vipin ๐Ÿš€ Profile picture
Jul 14 โ€ข 7 tweets โ€ข 2 min read
Difference between tag and element in HTML ๐Ÿš€

Thread ๐Ÿงต
๐Ÿ“ข When we write our html code we use tags and elements multiple times but we never focus on which one is a tag and which is one element, but for interviews perspective, it's one of the important questions I think.

Let's find out the difference between them.
tags vs elements

tags : used to mark up the start and end of an html element. ๐Ÿ‘‡

<p></p>

elements : represents some kind of structure or semantics and generally consists of a start tag, content, and an end tag. ๐Ÿ‘‡

<p>Hi, my name is vipin</p>
tags in HTML ๐Ÿ‘‡

โ€ข Used to storing html elements
โ€ข Every single tag in html has a distinct meaning
โ€ข Example :

<html>, <body> etc.
elements in HTML ๐Ÿ‘‡

โ€ข Used to storing html content
โ€ข HTML elements are any text contained within an html tag.
โ€ข Example :

<h1>Heading</h1>,
<p>paragraph</p>,
<br> etc.

End thread ๐Ÿงต
If this thread helpful for you then

1. Do Retweet the FIRST TWEET.
2. Follow me and turn on the notifications: @personalvipin

Thank you โฃ๏ธ

โ€ข โ€ข โ€ข

Missing some Tweet in this thread? You can try to force a refresh
ใ€€

Keep Current with Vipin ๐Ÿš€

Vipin ๐Ÿš€ Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @personalvipin

Jul 15
Differences between ๐Ÿ‘‡

โ€ข display : inline;
โ€ข display : inline-block;
โ€ข display : inline-flex;
โ€ข display : inline-grid;

in CSS ๐Ÿš€

Thread ๐Ÿงต
๐Ÿ“ข Note : I made this thread at the request of one of my follower.

I hope it's helpful for all of you guys!
display properties in CSS ๐Ÿ‘‡

โ€ข It's used to identify how our html elements display on the webpage.
โ€ข In html the behaviour of display properties depends on elements. It's inline or block(default).
โ€ข But we can reset it using css display properties.
Read 9 tweets
Jul 13
Simple product card using HTML and CSS only ๐Ÿš€

Preview ๐Ÿ‘‡ Image
Source code HTML + CSS ๐Ÿ‘‡ Image
Codepen link ๐Ÿ‘‡

codepen.io/personalvipin/โ€ฆ
Read 5 tweets
Jul 2
Difference between Block and Inline elements in HTML ๐Ÿš€

Thread ๐Ÿงต
When we write any element in html, it has a default display value. It depends on the type of the elements.

ln html we have two types of display value:

โ‘  Block
โ‘ก Inline
Let's understand the difference between Block and Inline elements using an example:
Read 10 tweets
Jun 29
My handwritten notes on flexbox properties in CSS ๐Ÿš€

Thread ๐Ÿงต
๐Ÿ“ข Source : freeCodeCamp

When I learned flexbox properties in CSS, I used the freeCodeCamp website as a source.
Introduction ๐Ÿ‘‡
Read 8 tweets
Jun 28
VS code shortcuts I use when writing my HTML code ย ๐Ÿš€

Thread ๐Ÿงต
1) Ctrl + !

Use to generate HTML structure
2) div.classname

To write div with class name

Example :

div.first ๐Ÿ‘‡

<div class="first"></div>
Read 9 tweets
Jun 21
Want to Master CSS from zero?๐Ÿš€

Here are amazing YouTube video Resources:
Thread ๐Ÿงต Image
๐Ÿ”ท CSS Tutorial - Zero to Hero

๐Ÿ”—
๐Ÿ”ท CSS Full Course for Beginners

๐Ÿ”—
Read 9 tweets

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Don't want to be a Premium member but still want to support us?

Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal

Or Donate anonymously using crypto!

Ethereum

0xfe58350B80634f60Fa6Dc149a72b4DFbc17D341E copy

Bitcoin

3ATGMxNzCUFzxpMCHL5sWSt4DVtS8UqXpi copy

Thank you for your support!

Follow Us on Twitter!

:(