Short Note of Web Programming
Use of Extension
1. Auto Rename Tag – To change the file name
2. Auto Close Tag – For close the tag auto
3. Code Spell Checker – for spelling check in your code
4. Live Server – See the code in live server
5. Code Runner – To run your code easily
6. Prettier – To make your code colorful
7. JavaScript (ES6) – code short
8. Material Icon Theme – to change file icon
9. Open in Browser – For open your code in browser
HTML TAG
<br> = line break tag
<u></u> = Underline Tag
<ins></ins> = Underline Tag
<em></em> = italic
<i></i> = italic
<b></b> = Bold
<strong></strong> = Bold
<del></del> = Delete the line/word
<mark></mark> = highlight the word/line
<p></p> = Paragraph
<small></small> = make the word/line small
<sub></sub> = The 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 H 2O.
<sup></sup> = The 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]
“Lorem” The tag inserts a specified amount of
random text
<q></q> = For Quotation
<blockquote></blockquote> = The tag specifies a section that is quoted
from another source
<address></address> = The tag defines the contact information for the
author/owner of a document or an article
<abbr></abbr> = The tag defines an abbreviation or an acronym, like
"HTML", "CSS", "Mr.", "Dr.", "ASAP", "ATM".
Example: <abbr title="World Health Organization">WHO</abbr>
<bdo></bdo> = The tag is used to override the current text direction
Example: <bdo dir="rtl">This text will go right-to-left</bdo>
<!----> = Is use for Commenting for code
Example:
<!- -Heading Start- ->
<h1><u>Welcome to My World</u></h1>
<h2><em>Shamit Nibras</em> </h2>
<h3><strong>Everyone!!</strong> </h3>
<h4><del><i>What's Up</i></del> </h4>
<h5><mark>What are you Doing</mark></h5>
<!- -Heading End - ->
<a href="link Address"> </a> = The tag defines a hyperlink, which is used
to link from one page to another.
Example:
i. <a href="www.facebook.com">facebook</a><br>
ii. <a href="https://www.w3schools.com" target="_blank">Visit
W3Schools</a>
<img> = Image Tag
Example:
i. <img src="Nibras.jpg">
ii. <img src="Image/download.jpg">
iii. <img src="provide proper link">
<table></table> = table tag
*For style your table use border as attribute*
<tr></tr> = table row
<th></th> = table heading
<td></td> = table data
<ol></ol> = list tag by order
If we use <ol type = “…”>; Give the type which we want to see in our list.
Example: ‘i’, ‘1’, ‘A’, ‘a’.
<li></li> = listing tag
<ul></ul> = unlist tag
If we use <ul type = “…”>; Give the type which we want to see in our list.
Example: ‘circle’, ‘square’.
<iframe></iframe> = The tag specifies an inline frame. An inline frame is
used to embed another document within the current HTML document.
Example:
i. <iframe width="500" height="300" src="https://www.aiub.edu/"
name="NSU"></iframe><br>
<a href="http://www.northsouth.edu/" target="NSU">Click Now</a><br><br>
ii. <iframe width="560" height="315"
src="https://www.youtube.com/embed/1dF7_wiYUzM" title="YouTube video
player" frameborder="0" allow="accelerometer; autoplay; clipboard-write;
encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen></iframe><br><br>
iii. <iframe src="https://www.facebook.com/plugins/video.php?
height=476&href=https%3A%2F%2Fwww.facebook.com
%2FMattAdlardOfficial%2Fvideos
%2F3037604313198940%2F&show_text=false&width=380&t=0"
width="380" height="476" style="border:none;overflow:hidden"
scrolling="no" frameborder="0" allowfullscreen="true" allow="autoplay;
clipboard-write; encrypted-media; picture-in-picture; web-share"
allowFullScreen="true"></iframe>
iv. <iframe src="https://www.google.com/maps/embed?pb=!1m17!1m12!1m3!
1d3651.7140488173686!2d90.43981691744385!3d23.757574399999992!
2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m2!1m1!
2zMjPCsDQ1JzI3LjMiTiA5MMKwMjYnMzEuMiJF!5e0!3m2!1sbn!2sbd!
4v1677775385573!5m2!1sbn!2sbd" width="400" height="300"
style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-
referrer-when-downgrade"></iframe>
<form></form> = form tag
*attribute “action=’#’”, “method = ‘!!’” here !! means we will use get for
general information & post for confidential information as like password, atm
pin, etc.
*<input> tag don’t have any closing tag.
<marquee> </marquee> = This tag helps text will scroll from right to left