Scribd
Upload
39 views22 pages

HTML (Tech Gun)

This document provides instructions on various HTML tags and their uses: 1. It explains common tags like <p> for paragraphs, <img> for images, and <a> for links. 2. It describes how the <body> tag is used to define the visible content on a webpage. 3. It also covers lists, tables, headings, and other basic HTML elements as well as attributes like href, src, and title.

Uploaded by

Kausar Ansari
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
39 views22 pages

HTML (Tech Gun)

This document provides instructions on various HTML tags and their uses: 1. It explains common tags like <p> for paragraphs, <img> for images, and <a> for links. 2. It describes how the <body> tag is used to define the visible content on a webpage. 3. It also covers lists, tables, headings, and other basic HTML elements as well as attributes like href, src, and title.

Uploaded by

Kausar Ansari
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 22

1- Koi bhi .

html file bnayenge to web page ban jayega


2- Html mei error nahi ata hai.
3- <p> etc </p> p tag paragraph likhne k lie use hota hai.
4- Html source code dekhne ka tarika= ctrl+u or right click mouse go to view
source code
5- Save offline page = ctrl+s
6- <!DOCTYPE html> ye btata hai ki kish type ka Browser hai
7- <html>
<head>
<title>
This is a html page
</title>
</head>
<body>
Thise is visible part-user
</body>
</html>
8- <body> etc </body> k andar kuch bhi likhenge to vo visible part hoga.
9- <body> <p>isme ek paragraph ho skta hai</p> </body>
10- metadata= data-about-data or this is browser part
11- <head> <title> iske andar title tag bnate hai</title> </head>
12- <title> tag mei jo likhenge upr left corner pr show krega </title>
13- Description tag
14- <body> <p> ish tag paragraph likh sqte hai/images/link dal sqte hai</p>
</body>
15- <!DOCTYPE html> ye btata hai ki kaun sa html version use hua hai
16- Element=jo kuch bhi page pr dikhta hai ek trah ka element hai,element
ya to paragraph/image/video kuch bhi ho sqta hai.
17- Attribute=additional info about attribute matlab image or video k bare
mei jo likha hota hai, Exa- kisi image ka info de sqte hai ki uska height or width
kya hai to ek trah se wo image ka attribute hota hai.
18- Kisi Element ko declare karne k lie usk name ka tag bnate hai Exa-
<tagName>Content</tagName> = element
<tagName attribute1=”value” attribute2”value”>Content</tagName>
= attribute
Exam-
<p width=”100px”> this is p tag</p>
19- Opening tag=<tagName>
20- Closing tag=</TagName>
21- <img src=” “> empty html tag , src means source
22- <br> tag =line break deta hai ya space deta hai
23- empty tag =line bnane k lie use hota hai
24- child element jab bhi bnega space lekr bnega for good
visualization(axcha dikhne k lie)
25- html mei comment kaise likhte hai
Exam <!-- ABCDEFH -->

26- heading tag body k andar likhte hai aur paragraph se bda hota hai
27- <body> <h1> H1 Heading </h1> </body>
28- <hr> tag = page par line bnane k lie use hota hai ya Heading
line=horizontal rule bolte hai
29- <br> tag ,paragraph mei line break krne k lie use hota hai
30- <hr> tag and <br> tag both are single tag
31- <pre> tag space deta hai paragraph ya word k bich mei
without br tag </pre>
32- <b> tag sentence ya word ko bold krne k lie use krte hai <b/>
33- <strong> tag,same as <b> tag but strong tag stronge meaning ko btata
hai </strong>
34- <i> tag(itallice) word ya sentence ko tedha krta hai </i>
35- <em> tag word ya sentence ko tedha karta hai and em tag matlab us
word pr focus karna hota hai </em>
36- <small> tag font ko chhota kr dega </small>
37- <mark> tag jaise highlighter se book mei sentence ya word ko highlight
krte hai waisa hi kr dega </mark>
38- <del> delete tag ,word ko line jaisa mark kr dega ,ki jaisa wo word read kr
liya ho </del>
39- <ins> insert tag kisi bhi word/sentence ko underline kr dega </ins>
40- x<sub>2</sub> = 2 ,x k niche aayega,base ki trah
41- y<sup>2</sup> =2 y k upr aayega ,square ki trah
42- <q> q/quotation tag paragraph/sentence ko double code
mei kr dega </q>
43- <blockquote> tag kisi dusre ka paragraph lega aur left & right side se
space chhodta hai </blockquote>
aur isme jis cite se paragraph lete hai uska cite bhi likhte hai ya link dalte hai

Example <blockquote cite=”http://www.google.com”>etc </blockquote>

44- abbr abbribiation tag title k andar jo likha rhaiga usk bare mei show krne
lgega
45- <abbr title="World Health Organization">WHO</abbr>
46- <address> tag Bareilly,India </address>
47- <cite> tag ka andar kisi author/book ka name likhte hai jo left side mei
niche show krega </cite>
48- Link pr click krk ek webpage se dusre webpage pr jane k lie ankle tag{
<a>etc</a> }ka use krte hai aur link bnane k path dena pdta hai
49- href(attribute) =”isk andar jo bhi likhenge link bn jayega ya isk andar path
diya jata hai” aur wo blue color ka ho jayega
50- < a href=”https://www.google.com”> Read More </a>
51- href,se link bnta hai aur Read More Blue color ka ho jata hai
52- target(attribute) ka use krk ek webpage(link open krk) se NewTab
webpage pr jate hai
53- < a href=”https://www.google.com” target=”_blank”>Read More<a/>
54- _blank new tab bnata hai
55- title(attribute)=”Go to google.com”, title k andar jo likhenge wo hint
show hoga
56- < a href=”https://www.google.com” target=”_blank” title=”Go to
google.com”>Read More<a/>
57- id(attribute)=”local”, webpage pr kisi point pr lekr jayega
58- < a href=”#local” target=”_blank” title=”Go to google.com”>Read
More<a/>
<p id=”local”> etc </p>
59- email link se email k webpage/application pr le jayega

< a href=”[email protected]”>[email protected]</a>

60- webpage pr image lgane k lie < img > tag hota hai, ye single tag hota hai
61- <body> <img src=”image path”> </body>
62- alt attribute kisi bhi image ka name hota hai jo us image k bare mei btata
hai
63- <img src=”image path” alt=”toys”>
64- width(attribute) se image ki size bnate hai
65- <img src=”image path” alt=”toys” width=”100”>
66- height attribute se image ki height bnate hai
67- <img src=”image path” alt=”toys” width=”100” height=”200”>
68- marquee tag kisi sentence/word ko webpage pr move krane k lie use
krte hai
69- <marquee> This is a moving text </marquee>
70- direction(attribute) lekr sentence ya word ko Right or Left se move kra
sqte hai
71- <marquee direction=”Right/Left/Up/Down”> This is a moving text
</marquee>
72- Html list 1-orders 2-unorders ,3-description list
73- Order list bnane k lie <ol> etc</ol> tag hota hai
74- <ol> tag mei <li> tag ka use krte jyada list bane k lei
75- <ol>
<li>Cofee</li>

<li>Tea</li>

<li>Milk</li>
</ol>
76- <ol start=”12”> li tag(start attribute se numbering whi12 se start hogi
</ol>
77- 12 k jgah pr ABCD ya Number likh sqte hai
78- type attribute same as start
79- list k andar list bnane k lie usk andar ek aur <ol>etc</ol> tag bnate hai
80- unoderlist <ul>tag mei bullets bnaya jata hai
<ul> <li> etc </li> </ul>

81- bullets k andar bullets bnane k lie ek aur <ul> tag ka use krte hai
82- <ul style=”list-style-type: none;”> etc </ul> tag se bullet change krte hai
83- Unouderd list k andar order list bna sqte hai <ol> tag ka use krk</ol>
84- Description tag <dt> Milk</dt> k andar <dd> etc</dd> tag use kiya jata
hai jo Milk k bare mei btata hai Hot hai ya cold
85- <table> tag se table bnaya jata hai </table>
86- <table> tag mei row k lie <tr> tag use kiya jata hai </tr> </table>
87- Column bnane k lie <td> tag use krte hai </td>
88- Row bnane k lie <tr> tag ka use krte hai
89- <td> tag, <tr> tag k andar likhte hai
90- border attribute se table ka border bnate hai
<table border="1">
<tr>
<td>Data 1</td>
<td>Data 2</td>
<td>Data 3</td>
</tr>
<tr>
<td>Data 4</td>
<td>Data 5</td>
<td>Data 6</td>
</tr>
<tr>
<td>Data 7</td>
<td>Data 8</td>
<td>Data 9</td>
</tr>
</table>
91- table k upr heading bnane k lie <th> column</th> ,tag ka use krte hai
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
</tr>
92- row mei bhi table bnane k lie <th> tag ka use krenge jo ek <th> tag ,<tad>
tag k upr lgayenge
<tr>
<th>Row 1</th>
<td>Column 2</td>
<td>Column 3</td>
<td>Column 4</td>
</tr>
93- <td> tag k andar imgage(img) ya link(href) or anything lga sqte hai
94- Do column ko combine krne k lie colspan(attribute) ka use krte hai
95- Column combine krne k lie colspan aur row combine krne k lie rowspan
attribute use krte hai
96- <td colspan=”2”> etc </td> ,2=number of column combine
97- <th rowspan=”3” > etc </th> ,3=number of column combine
98- Aur combine row ya column ka program ddelete kr denge
99- <caption> tag ka use Table ka heading bnane k lie krte hai</caption>
100- <thead style=”color: red;> etc </thead> css
101- Nested table,table k andar table
102- Table k andar table bnane k lie <td> tag k andar ek aur new <table> tag
ka pura format bnate hai table k andar border attribute use krte hai
103- <table border=”2”> etc </table>
104- <div></div> and <span> </span> block
105- <div> block se random text new line se start hota hai
106- <span> block se random text space lekr start hota hai
<body>
<div >random text</div>
<div>random text</div>
<span> random text</span>
<span> random text</span>
</body>
107- random text
random text
random text random text
108- <iframe> tag kisi dusre ka web page apne web page mei dikhane k lie use
krte hai </iframe>
109- <body>
<iframe src="https://www.ndtv.com/" height="500"
width="1000"> </iframe>
</body
110- <iframe> tag ka use krk ek se jayada web page apne web page pr la sqte
hai
111- Audio/mp3 lgane k lie <audio> etc </audio> tag ka use krte hai aur audio
tag mei controls(attributes) ka use krte hai
112- Controls se player type ka icon bn jata hai
113- Controls k jgah pr autoplay ka bhi use kr sqte hai
114- <audio> tag k andar <source> tag ka use krte hai aur isk andar src
attribute audio link/path dene k lie use krte hai
115- Audio ka type mpeg hota hai
<body>
<audio controls>
<source src="audio.mp3.mpeg" type="audio/mpeg">
</audio>
</body>
116- Video lgane k lie <video> tag ka use krte hai ,aur <video> tag same work
as(same operation) <audio>tag

<body>
<video controls width="800" height="600">
<source src="video.mp4" type="video/mp4">
</video>
</body>
117- Pdf web page pr lgane k lie three type k tag hote hai hai,1-embded,2-
iframe,3-object tags
118- 1-<embed> tag

<embed src="pdf.pdf" type="application/pdf" width="800"


height="400">

119- 2- <ifram> </iframe> tag isme type mentioned krna zaruri nai
Hota hai

<iframe src="pdf.pdf" width="800" height="400"></iframe>

120- Object tag isme type mentioned krte hai aur isme src k jgah pr data ka
use krte hai

<object data="pdf.pdf" width="500" height="500"></object>

121- embded tag mei closing tag nahi hota hai whenever iframe aur object tag
mei closing tag hota hai
122- apne web page pr you tube video lgane k lie ,us you tube ko share krk
usk bad embded select krk emded ka code copy krk body tag k andar past kr
denge

<iframe width="560" height="315"


src="https://www.youtube.com/embed/BS9Tfg1On1A"
title="YouTube video player" frameborder="0"
allow="accelerometer;
autoplay; clipboard-write; encrypted-media;
gyroscope; picture-in-picture"
allowfullscreen></iframe>

123- apne web page pr google map lgna k lie usk embded code(custom)copy
krk body k andar past kr denge

<body>
<iframe
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d35
10.5840975608357!2d79.45461961503037!3d28.371421082521543!2m3
!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x39a006d9fa85
85a3%3A0x863ee0b9b8a9b249!2sMahatma%20Jyotiba%20Phule%20Rohil
khand%20University!5e0!3m2!1sen!2sin!4v1659611401534!5m2!1sen
!2sin"
width="500" height="500" style="border:0;"
allowfullscreen=""
loading="lazy" referrerpolicy="no-referrer-when-
downgrade"></iframe>
</body>

124- html entities use krk html resorve word ko use kr sqte hai.
125- &name; aur &#number; use krk web page pr dikha sqte hai
Exa-
1- &lt;div&gt;
2- &60;div&#62
126- Html entities ka use krk web page pr mathematical symbols lga sqte hai
<body>
&copy;
</body>
127- Html entities ka use krk web page pr Emozi lga sqte hai

<body >
<!-- &smile; -->

&#128516;
</body>

128- Symbols/Emozi ka name ya uska ek particular number hota hai.


129- Html image map, image pr kisi bhi web cite ka link lgat hai
130- Ek hi image pr do ya do se jyada link lgana image map khlata hai
131- Aur image pr diya hua object pr click krne pr wo open ho jata hai
132- go to google and search image map generator image upload krk image ka
dimension nikal kr html outut code copy krk body tag mei past kr denge

<body>

<img src="workplace.jpg.jfif" usemap="#image_map">


<map name="image_map">
<area alt="google" title="google"
href="https://www.google.com"
coords="89,31 85,26 61,107 6,136 122,163 179,128
200,35 86,27 86,27 86,27 89,32 89,
30 104,74 85,27 85,27 85,27 88,30 61,107 105,74
105,73 "
shape="polygon">
<area alt="yahoo" title="yahoo"
href="https://www.yahoo.com"
coords="190,136 158,158 223,142 192,166 158,160 "
shape="polygon">
<area alt="facebook" title="facebook"
href="https://www.facebook.com"
coords="242,120,21" shape="circle">
</map>

</body>

133- form bnane k <form> tag hota hai</form>


134- user name ka box bnane k lie form k andar <input> tag ka use krte hai

<input type="text">

<form >
<div>
Name:
<input type="text">
</div>
<div>
<br>
<input type="submit">
</div>
</form>

135- Name aur user box bnane k lie <div>tag k andar likhte hai
136- @Forminput

<form>
<div>
Text:
<input type="text">
</div>
</form>

<div>
Submit button:
<input type="submit">
</div>
<div>
Color:
<input type="color">
</div>
<div>
Date:
<input type="date">
</div>
<input type="email">

<div>
Hidden:
<input type="hidden" value="Delhi">
</div>

<div>
Number:
<input type="number">
</div>

<div>
Password:
<input type="password">
</div>

<div>
Reset:
<input type="reset">
</div>
<div>
Time:
<input type="time">
</div>

<div>
URL:
<input type="url">
</div>

<div>
Range:
<input type="range" min="500" max="1500">
</div>

137- Form file upload kaise krein…….

<form>
<input type="File">
</form>

138- Multiple file select krne k lie multiple attribute use krte hai

<form enctype="multipart/form-data">
<input type="File" multiple>
</form>

139- Html input attributes Readonly attributes/dissabaled


attributes/readonly/size attributes/

<form>
<input type="text" value="kausar">
<input type="submit" value="Go">
</form>

140- Size attribute box ki size handle krega

<input type="text" value="kausar" size="50">


<input type="submit" value="Go">

141- Maxlength attribute ye btate hai ki box mei kitna character enter kr sqte
hai(max. 20 character for exam.)

<input type="text" value="kausar" maxlength="20" size="50">


<input type="submit" value="Go">

142- Box mei number enter kaise kraye,minimum 10 aur maximum 20


number enter kr sqte hai

<input type="number" min="10" max="20">


<input type="submit" value="Go">

143- Box mei name hint krwane k lie placeholder attribute ka use krte hai

<input type="text" placeholder="Enter Name">


<input type="submit" value="Go">

144- Required attribute ka use box mei koi word type krne k lie coumpalsarry
krta hai

<input type="text" placeholder="Enter Name" required >


<input type="submit" value="Go">

145- Autofocus attribute se cursor phle se blank hone lgega

<input type="text" autofocus>


<input type="submit" value="Go">
146- TextArea
Isme ek bda sa box ban jata hai jisme kuch bhi likh sqte hai

<form>

<textarea rows="20" cols="30"></textarea>


</form>

Box k niche right side kone mei submit icon lane k lie …..use krte hai
<form>
<textarea rows="20" cols="30" placeholder="Enter
Description"></textarea>
<input type="image" src="submit.png" width="80"
height="40">
</form>

147- Form select,dropdown bnane k lie <select> tag ka use krte hai
<select>etc</select>
Dropdown k andar list bnane k lie <option> tag ka use krte hai

<select size="2">
<option value="audi">audi</option>
<option value="audi">BMW</option>
<option value="audi">tata</option>
<option value="audi">suzuki</option>

</select>

Dropdown k list mei group bnane k lie <optgroup> tag ka use krte hai

<select >
<optgroup label="car">
<option value="audi">audi</option>
<option value="audi">BMW</option>
<option value="audi">tata</option>
<option value="audi">suzuki</option>

</optgroup>
<optgroup label="sports">
<option value="audi">Cricket</option>
<option value="audi">Hockey</option>
<option value="audi">Carrom</option>
<option value="audi">Ludo</option>

</optgroup>
<select>

148- Radio button(matlab gola wala button)


<input type="radio">

Ek se jayada radio button lane k lie ye code kai bar likhte hai aur radio button
sb option select selecet krta

<input type="radio" name="male" value="male">Male


<input type="radio" name="female"
value="female">Female
<input type="radio" name="other"
value="other">Other

Radio button koi ek option select krne k lie name same kr dete hai

<input type="radio" name="gender" value="male">Male


<input type="radio" name="gender" value="female">Female
<input type="radio" name="gender" value="other">Other
<input type="radio" name="emptype" value="manager">manager
<input type="radio" name="emptype"value="developer">developer

149- Checkbox radio tag kit trah hota hai


Checkbox square mei hota hai

<input type="checkbox" name="sports" ">manager


<input type="checkbox" name="sports" ">developer

150- Datalist
Search box niche di gye formats se bnate hai

<form>
Search <input type="text">
<input type="submit" value="search">
</form>

Search box k andar list option show krne k lie option tag ka use krte hai

Search <input type="text" list="search">


<datalist id="search">
<option value="Apple">
<option value="Mango">
<option value="Orange">
<option value="Car">

</datalist>
<input type="submit" value="search">

151- <label > tag

<div>
<label for="fname">First Name</label>
<input type="text" name="first_name" id="fname"><br>
</div>
<div>
<input type="submit">
</div>

<div>
<label for="fname">First Name</label>
<input type="text" name="first_name" id="fname"><br>
<label for="lname">Last Name</label>
<input type="text" name="last_name" id="lname"><br>
</div>

<div>
<label for="address">Address</label>
<input type="text" name="address" id="address"><br>
<label for="Mobile">Mobile no</label>
<input type="text" name="mobile" id="mobile"><br>

</div>

<div>
<input type="submit">
</div>

152- <div> tag k jgah pr <fieldset> tag use kar sqte hai

<fieldset>
<label for="fname">First Name</label>
<input type="text" name="first_name" id="fname">
<label for="lname">Last Name</label>
<input type="text" name="last_name" id="lname">
</fieldset>

<fieldset>
<label for="address">Address</label>
<input type="text" name="address" id="address">
<label for="Mobile">Mobile no</label>
<input type="text" name="mobile" id="mobile">
</fieldset>

<fieldset>
<input type="submit">
</fieldset>

153- <legend>tag use krk basic information aur other information likhte hai
<fieldset>
<legend>Basic Information</legend>
<label for="fname">First Name</label>
<input type="text" name="first_name" id="fname">
<label for="lname">Last Name</label>
<input type="text" name="last_name" id="lname">
</fieldset>

154- SEO tag mei 5 tag use hote


hai(title,description,keywords,canonical,robots)
Seo tag <head> tag k andar likhte hai

<title>Home Page</title>
<meta name="description" content="this is a page about car"/>
<meta name="keywords" content="new,car"/>
<link rel="canonical" href="car.html"/>
<meta name="robots" content=" noindex,nofollow"/>

155- Favicon,wo hota hai google search krenge to left kone mei google ka icon
bna hota hai,favicon ka size mobile aur tablet pr maintain krne k lie favicon
generator(ye google pr search krenge) ka use krte hai

<link rel="icon" href="favicon.png" type="image/png">

All mobile k lie favicon


<title>Home Page</title>
<meta name="description" content="this is a page about car"/>
<meta name="keywords" content="new,car"/>
<link rel="canonical" href="car.html"/>
<meta name="robots" content=" noindex,nofollow"/>
<link rel="apple-touch-icon" sizes="180x180" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-32x32.png">
<link rel="manifest" href="favicon-32x32.png">
<link rel="mask-icon" href="favicon-32x32.png" color="#5bbad5">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">

156- <style> tag ye css mei use hota hai isse webpage/background color krte
hai</style>
Webpage color krne k lie
<style>
body{
background-color: aquamarine;
}
</style>

<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>

157- <script>tag se webpage pr hello alert krte hai alert ka use krk(webpage
pr Hello show hoga

<script>
alert("Hello")
</script>

158- <noscript>tag</noscript>
159- Viewport se laptop ka web page aur mobile ka webpage mei likha hota
hai use same kr sqte hai

<head>

<meta name="viewport" content="width=device-


width,intial-scale=1">
</head>

160- Webpage pr English/Arabic mei likhe sentence ko Left To Right(ltr) ya


Right to Left(rtl)karne k lie dir(direction) attribute ka use krte hai

<html dir="rtl">
161- Search google w3c validator pr jakr html ka error chech krte hai

Thank
You

You might also like