Basics on HTML
What is HTML ?
HTML (Hyper Text Markup Language) is a markup language used to structure and organize the content on a web page. It uses various tags to define the different elements on a page, such as headings, paragraphs, and links.
Simple HTML Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple HTML Page</title>
</head>
<body>
<h1>Welcome to My Page</h1>
<p>This is a simple HTML page.</p>
</body>
</html>
HTML Headings:-
HTML headings are defined with the <h1> to <h6> tags .They are as follow
<!DOCTYPE html>
<html>
<head>
<title>Headings Example</title>
</head>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
</html>
This is heading 1
This is heading 2
This is heading 3
This is heading 4
This is heading 5
This is heading 6
HTML Elements:-
The HTML element is everything from the start tag to the end tag.
Example:-
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
An element need not to have close tag compulsorily .Some elements don't have any close tag .They are called as self closing elements or void elements or empty elements .The famous self closing elements are br, hr, img, input etc.
<br> - br is used to create a line break.
<hr> - It creates a horizontal line.
<img> - It is used to define an image.
<input> - It is used to create an input field.
HTML Formatting Tags:-
Formatting tags are used to format the text like making the text bold, italic,underline etc. Some html formatting tags are as follows:-
(i)<b>-This tag is used to make the text bold.
Example:-
<!DOCTYPE html>
<html>
<body>
<p><b>This text is bold.</b></p>
</body>
</html>
This text is bold.
(ii)<strong>-The tag defines text with strong importance. The content inside is typically displayed in bold.
<!DOCTYPE html>
<html>
<body>
<p><strong>This text is important!</strong></p>
</body>
</html>
This text is important!
(iii)<i>-This tag is used to make the text italic.
<!DOCTYPE html>
<html>
<body>
<p><i>This text is italic.</i></p>
</body>
</html>
This text is italic.
(iv)<em>-This tag defines emphasized text. The content inside is typically displayed in italic.
<!DOCTYPE html>
<html>
<body>
<p><em>This text is emphasized.</em></p>
</body>
</html>
This text is emphasized.
(v)<u>-This tag is used to make the text underlined.
<!DOCTYPE html>
<html>
<body>
<h1>The u element</h1>
<p>This is some <u>mispeled</u> text.</p>
</body>
</html>
This is some mispeled text.
(vi)<sub>-This tag defines subscript text. Subscript text appears half a character below the normal line, and is sometimes rendered in a smaller font. Subscript text can be used for chemical formulas, like H2O.
<!DOCTYPE html>
<html>
<body>
<p>This is <sub>subscripted</sub> text.</p>
</body>
</html>
This is subscripted text.
(vii)<sup>-This tag defines superscript text. Superscript text appears half a character above the normal line, and is sometimes rendered in a smaller font. Superscript text can be used for footnotes, like WWW[1].
<!DOCTYPE html>
<html>
<body>
<p>This is <sup>superscripted</sup> text.</p>
</body>
</html>
This is superscripted text.
(viii)<del>-This tag defines the text that has been deleted from a document. Browsers will usually strike a line through deleted text.
<!DOCTYPE html>
<html>
<body>
<p>My favorite color is <del>blue</del> red.</p>
</body>
</html>
My favorite color is blue red.
(ix)<ins>-This tag defines that a text that has been inserted into a document. Browsers will usually underline inserted text.
<!DOCTYPE html>
<html>
<body>
<p>My favorite color is <del>blue</del> <ins>red</ins>.</p>
</body>
</html>
My favorite color is blue red.
(x)<big>-This tag is used to make the text bigger.
<!DOCTYPE html>
<html>
<body>
<p>This is paragraph text</p>
<big>This is big Tag text</big>
</body>
</html>
This is paragraph text
This is big Tag text
(xi)<small>-This tag is used to make the text smaller.
<!DOCTYPE html>
<html>
<body>
<p>This is some normal text.</p>
<p><small>This is some smaller text.</small></p>
</body>
</html>
This is some normal text.
This is some smaller text.
(xii)<pre>-This tag defines preformatted text. Text in a <pre> element is displayed in a fixed-width font, and the text preserves both spaces and line breaks. The text will be displayed exactly as written in the HTML source code.
<!DOCTYPE html>
<html>
<body>
<pre>
Text in a pre element
is displayed in a fixed-width
font, and it preserves
both spaces and
line breaks
</pre>
</body>
</html>
Text in a pre element
is displayed in a fixed-width
font, and it preserves
both spaces and
line breaks
(xiii)<code>-This tag is used to define a piece of computer code. The content inside is displayed in the browser's default monospace font.
<!DOCTYPE html>
<html>
<body>
<p>The HTML <code>button</code> tag defines a clickable button.</p>
</body>
</html>
The HTML button tag defines a clickable button.
Basics on Git and GitHub:-
Git is an application which is used for version control. Git is a centralizedversion control system.
Git keeps track of all your versions, changes and updates.
Git will contain three phases. They are as follows:-
(i)Working Phase/Working Area
(ii)Staging Phase/Staging Area
(iii)Local Repository
- GitHub is a platform created by Microsoft where developers share, deploy and merge codes.
How to Push codes into GitHub:-
Create an account on GitHub.
Then go to new and create a new repository.
Then open the folder which you want to push into the GitHub.
After that open terminal and there is an option that is new terminal click on that and remember it will be in cmd mode not in powershell.
Then run the following commands:-
(i)git init
(iii)git commit -m "any text"
(iv)git branch -M main
(v)git remote set -url origin https link
(vi)git push -u origin main