Hey Readers,

Welcome to this amazing blog of ANONYMOUS, where you can find interesting information of technology and gaming, general Knowledge.

In this blog, we can find good data about HTML, which is now basic coding language, and also trending language. So let's get started.

WHAT IS HTML ?

It means HYPER TEXT MARKUP LANGUAGE, Which is used for creating websites, Web applications and some others attractive pages. Hyper text and Markup language is different. Look at this..,

HYPER TEXT

It simply means, A text has link within it, is a HYPER TEXT. It also mean, that whenever you just clicked on any link, it brings you to a new webpage.It connect link between websites and applications.

MARKUP LANGUAGE

Markup Language is one type of basic computer language, which is provide different types of formats and layouts, which become an amazing websites. It can turn any documents into different documents.

Here's an example of HTML language

<!DOCTYPE>

<html>

<head>

<title>My Blog Title</title>

</head>

<body>

<h1>Heading</h1>

<p>Paragraph</p>

</body>

</html>

Explanation of these following aspects

1. <!DOCTYPE> :- It clarify the document type and allow the browser to know about the version of HTML.

2. <html> :- It is the mandatory step of html, without this tag you can't run your code. It contains the metadata of HTML. You must be closed this tag when you completed your code.

3. <head> :- It should be the first element of HTML, which describe the heading of html. It must be closed, when the heading is completed.

4. <title> :- through this tag, you find your website name on top of the page. It must be placed inside the head tag and close immediately.

5. <body> :- Body is that portion of code, where you can write your code. This tag contain the main tag of HTML, and describe content.

6. <h1> :- The text between <h1> describe the heading of your website of particular topic. It plays vital role in HTML. After complete the title, you must end your h1 code.

7. <p> :- It describe the paragraph of any website, without this tag the paragraph is not possible.

ASPECTS OF HTML

1. HTML is a case-sensitive language, It means we can use any lower-case or Uper-case both tags.

2. It can be displayed in any platform, such as linux, windows, Macintosh.. etc. So, it's called independent platform.

3. We can design in any way, any format and layout, and that's why it is also called by MARKUP LANGUAGE.

4. It has massive network, thus uncountable links can be connected with this language.

5. It is very easy to make any kind of interesting websites and presentation.

6. It provide many types of facilities like, Videos, Images and other documents are customize in HTML.

HTML ATTRIBUTION

Attribution means, It provide extra information about any particular element. In many website, people can describe extra details through add different link, and that link is added by ATTRIBUTION.

SYNTAX

<tag name attribution_name= "attr_value">content</tag name>

EXAMPLE :-

<!DOCTYPE html>

<html>

<body>

<title>HTML ATTRIBUTION</title>

</head>

<body>

<h2>ATTRIBUTION</h2>

<p>This is an Example tag</p>

<p style="color:Blue">The style of attribution paragraph tag</p>

</body>

</html>

OUTPUT :-

ATTRIBUTION

This is an example tag

The style of attribution paragraph tag

⧪The href attribute in HTML

It provides the link address, which is specified in that link. It always remain in anchor tag, <a>.

OUTPUT :-

Display of href attribute

Below is the link of anchor tag, click to continue page...

This is a link

⧪The src Attribute

It become source of Image which is required to display on browser. It is required attribute of <image> element.

HTML TAGS

HTML tags can define the format and layout of the content. With the help of these tags, a web browser can distinguish between an HTML content and simple content. This tags are used to create some interesting website's layout and formats.

Each HTML tags have different properties. Many of tags are new and useful for creating amazing website.

➽ Every tag in HTML perform different tasks

➽ It must be enclosed with brackets < >

➽ Almost all tags have their closed tag like, <open> and closed with </open>. But some tags have not their closed tag.

The list of HTML Tags

HTML TEXT TAG

<p>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <address>, <em>, <abbr>, <bdo>, <cite>, <q>, <code>, <del>, <dfn>, <pre>......

HTML LINK TAG

<a> and <base> - Only 2 tags are in HTML for linking.

HTML IMAGE AND OBJECT TAG

<img>, <map>, <area>, <param>......

HTML LIST TAG

<ul>, <ol>, <li>, <dt>, <dl>.....

HTML FORM TAG

form, input, textarea, select, option, button, label, optgroup......many others

HTML TABLE TAG

table, tr, td, thead, tfoot, col, th.......

HTML ELEMENTS

HTML file is made of the elements of HTML. Generally, HTML have a collection of start tag, attributes, end tag and content. All contents are written in body elements.

There are some kinds of elements :-

1. VOID ELEMENT

This element does not contain content and end tag , It is totally empty and that's why it is called VOID element. Not only this but also, it called as UNPAIRED TAG .

Such as, <hr> - horizontal line, <br> - represents a line break. etc...

2. NESTED HTML ELEMENT

Many elements can contain some other element, which can stands for other information. This is called NESTED HTML ELEMENT.

3. BLOCK-LEVEL ELEMENT

This element can break pages into coherent blocks. It structure main part of block. These elements can also contain inline elements. It always start with a new line and takes the full-width of webpage.

There are some block level elements

<address>, <article>, <aside>, <canvas>, <dd>, <div>, <dt>, <fieldset>, <figure>, <footer>, <form> , <main>, <table>, <video>, <h1>-<h6>, <header>.

4. INLINE ELEMENTS

This elements is also used with other elements. It is not start with a new line, It continue in same line. It can take width as per requirements. This elements can differrentiate the part of given text.

Some following elements are INLINE

<a>, <b>, <abbr>, <big>, <br>, <button>, <cite>, <code>, <img> , <label>, <map>, <object>, <script>, <strong>, <textarea>, <time>, <var>, <sub>, <samp>, <q>...

HTML WITH CSS

We can create a website by using HTML code and customize with CSS. With the help of CSS we can make an attractive website. CSS can be added in any other coding language.

➽ CSS provides various kinds of style properties and formats, which make website clear and interesting.

➽ It can be provide some amazing styles, such as, Background color, margin, Border color and many more.

➽ Each properties in CSS has a name, value and semicolon(;).

You can see an Example

<h2 style="color:Blue;">Welcome to Anonymous</h2>

<p style="color:red; font-size: 30px; font-style: italic ;">This is a great Blog to know about technology</p>

</body>

OUTPUT

Welcome to Anonymous

This is a great Blog to know about technology

There are 3 ways to apply CSS

1. EMBEDDED CSS or INTERNAL CSS

In this CSS, the code can be define only <style> tag in <head>section. It is only for single HTML page.

Example

<!DOCTYPE html>

<html>

<head>

<style>

body{background-color:Dark Black; text-align: Center;}

h2{font-style: italic; font-size: 30px;}

p{font-size: 20px;}

</style>

</head>

<body>

<h2>Learning CSS</h2>

</body>

</html>

2. INLINE CSS

In this CSS, you can apply it uniquely in each element. To apply Inline CSS, you need to use style attribute within HTML element. It can be separated by a semicolon(;) .

Example

<h2 style="color:purple; font-style: italic; text-align: center; font-size: 50px;>Learning HTML with ANONYMOUS</h3>

OUTPUT

Learning HTML with ANONYMOUS

3. EXTERNAL CSS

In this CSS, we can use in any way, but only through <link> tag. External CSS contain separate class name, ID name....

This CSS is very helpful, when, we want to apply similar CSS in all the pages. To apply this CSS, we need to follow 2 step;

1. Create the HTML file and then create CSS file, using CSS extension,

2. Link this file to HTML in header section

EXAMPLE

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<h2>Learning External CSS</h2>

<p class="blue">This is a blue paragraph</p>

<p class="green">This is a green color paragraph</p>

</body>

</html>

CSS FILE

body{background-color:red; text-align: center;}

h2{font-style: italic; size: 40px;}

p{font-size: 30px}

.blue{color:blue;}

.green{color:green;}

.red{color:red;}

So Buddies, this is all about HTML language basic. This is important in coding, basic needs. I hope you may find sufficient knowledge about HTML.

If you have any query or suggestion, please contact me through this contact form

Header Ads Widget

Anonymous

HTML