Learn HTML Basics: Get to know block tags and inline tags in HTML structures

If anyone thinks this writing is patronizing, you are wrong, the posts on this blog are not only for sharing information, but also for some that function as a light note for the author. As a beginner in learning programming languages, there is nothing wrong with making small notes so that they are easy to remember, and I also thought that sharing this article might be useful, especially for fellow beginners.

When learning the html programming language, this is actually just what a blogger demands. as an independent, mastering html is an obligation, even if it’s just the basics, at least it can be used as a provision when you want to edit themes and some other settings.

What is written below about html, everything is pure material that is obtained when you first get to know this programming language. As for what the explanation is, let’s go straight to the main discussion section.

In an html code document, an html structure consists of tag elements and element attributes. If the html structure will be used for a specific purpose such as making a website, blog, etc., then it is incomplete if you don’t have one content elements. Something like this, for example: “a glass of coffee generally consists of coffee grounds and sugar, so if you want to make a coffee drink, tea, coffee with a combination of tea flavors, then all you have to do is add tea, but if you want to make it a coffee drink, milk, coffee with a light brown appearance, milk is added. Coffee powder and sugar are like tag and attribute elements, (yrart) while tea coffee which has a reddish black color is a display.

So if a milk coffee drink is likened to an html structure, then milk is a content element, because basically it is coffee powder + sugar, it’s just that milk has been added if it is displayed on the browser then it will look light brown, so does coffee tea, tea is a content element if it is displayed in the browser, the color will be dark brown”.

Let’s not worry about another example: family (html structure) = father + son + mother then the content is you, because without you it feels incomplete, cieeeeee.

2 Types of Tags in HTML

Basically html itself has 2 types of tags: namely tags with Block type and inline type.

The difference between the two is

Block will create a newline and separate itself from the surrounding tags. Whereas inline doesn’t create a newline and blends with the surrounding tags.

An example of this block of elements is tag paragraph(

), list(

or
), and headings (

s/d

). Block elements will be displayed separately from all the tags before and after it. To be clear, this is an example of a tag

,

, and

in HTML:



Example of html tag with block type:

             
kami sedang brlajar Block Element HTML

    
Di yura46.blogspot.com
    
Tag p dan h1 adalah tag dengan tipe blok

    
keduanya akan dimulai di baris baru
    
      
Tag li jiga merupakan blok elemen
      
dan juga akan berjarak dari tag p sebelumnya
    
  

So it looks like when opened with a browser, it will look like the image below, remember to make sure the file has an .html extension!



The difference between block and inline type tags, this type of tag will blend with the surrounding tags. Also, don’t create a new line.

An example of this inline tag is: , , and .

The following is an example from our previous HTML page, but has been replaced with an inline type tag like , , and :

Example of an html tag of type inline:



  
Sedang ngapelin lisa blackpinkdi yura46.blogspot.com Tag i dan em adalah tag dengan tipe inline   Keduanya tidak dimulai di baris baru
 

Then it looks like the image below in the browser: the browser displays each sentence together with another sentence without a new line.



The difference between the two types of tags is not absolute because it can be changed by CSS. For example, block elements become inline elements, (yrart) inline elements become block elements. However, because HTML is used to structure web pages, structurally that’s the difference between block elements and inline elements.

So that’s roughly the block tag and inline tag in the html structure. May be useful.

Let’s discuss in the comments column

Share :