HTML
HTML stands for Hyper Text Markup Language . it is one of the most widely used markup language on web to develop web pages. it was developed by Tim Berners-Lee . HTML helps in creating a web structure, and provides semantics for text like headings, paragraphs, lists, tables, etc., to create a structured document. HTML is the most dominant language for web pages. HTML is the encoding scheme used to create and format a web document. It features the mechanism to structurally format page. One can define semantics for text such as heading, paragraph, lists, etc. An HTML elements called an HTML tags which are interpreted by the browser to present a layout on screen.
=> how to work with html :-
To work with html we need text editor for type the code. we can use any text editor notepad , notepad++ , sublime, visual studio code . Also we need the browser where we can see our web page.such as google, Microsoft Edge, Internet Explorer.
How to Download Visual Studio Code.
To download Visual Studio Code visit to (https://code.visualstudio.com/download) this site and click on windows10,11 according to your system. It will automatic downloaded.
and then install it on your system.
=> Lest start the HTML code.
1) Open your Visual Studio Code or any text editor.
2) Go to file menu and click on open folder. also you can use shortcut key Ctrl+K Ctrl+O.
3) Then create your separate folder for your HTML files with using CTRL + Shift +N
4) Now select your folder .
5) now click on new file icon.
6) Now save your file with .html/ .html extension.
7) Now type the basic structure of HTML which is define below.
=> Basic structure of html :-
<!DOCTYPE html>
<html>
<head>
<title>
</title>
</head>
<body>
</body>
</html>
=> Tags :-
Tags are container or pre-defined words which are performs some task in our web pages.
there are two types .
1) Opening and closing tag:- These type of tag start and end of html element.
such as:-
<p> this is a paragraph</p>
<h1> this is a heading </h1>
2) Self Closing tag:- These type of tag we use slash sign after the html element.
such as:-
<br/> , <hr/> , <img/> , and more.
=> How to write any text in html :-
We can write any text with using paragraph tag, headings tag .
Paragraph tag :-
You can write your paragraph with using <p> tag with its opening and closing tag .
<p> Write here your paragraph.</p>
 |
| PARAGRAPH TAG EXAMPLE |
 |
Heading tag :-
In html we have six type of headings which is start from <h1> to <h6> with its opening and closing tag, the biggest heading is <h1> and smallest heading is <h6>.
Here is an example of heading tag:-
The output of above example :-
=> How to break line in a paragraph :-
We can break the line in paragraph with using <br/> tag. it is a empty tag . In empty tag we use slash after html element.
=> The <hr/> tag :-
The <hr/> tag will insert a horizontal line in our web page , and we can change the color and size of horizontal line with using html attributes .
=> Attribute in HTML :-
Attributes are text or word which are perform a particular work . We can modify the html elements with various attribute. Each attribute has unique work but we need some tag to use attribute.
such as:-
- bgcolor :- This attribute change the background color of web page.
syntax:-
<body bgcolor="color name">
- color:- This attribute will change the text color we use this attribute inside the <font>tag with its opening and closing tag.
- size attribute:- This attribute will change the size of text.
- face attribute:- This attribute will change a font .
- height attribute:- With using this attribute we can change the height of an image.
- Width attribute:- With using this attribute we can change the width of an image.
- border attribute:- This attribute helps in insert a border in an image.
- align arrtibute:- This attribute change the alignment of any text and image.
syntax:-
<font face="font-familyname" size="30px" color="colorname"></font>
Example of using <font> tag.
The output of above example.👇
=> How to insert an image in your web page:-
To insert an image in our web page with using <img/> tag and use the src attribute inside it .
It is a empty tag.
syntax:-
<img src="url" alt="description"/>
Here
src is an attribute which define the location of an image.
img is an tag which insert an image.
alt is an attribute that is define the short description about an image.
Example:-
Now we can see here image is to large now we can make an image smaller with using height and width attribute.
Now apply both attribute inside an img tag.👇
The output of above example :-
.png)
0 Comments