Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
0% found this document useful (0 votes)
26 views

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
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
26 views

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
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=”ansarikausar2908@gmail.com”>ansarikausar2908@gmail.com</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