Adarsh Institute of Computer Technology
Address-Veterinary Dispensary Near Katra, Katra Rewa, Madhya Pradesh 486117
Mobile Number-+919752838131
Wednesday, December 15, 2021
Monday, August 3, 2020
HTML Text Editor- html text editor ऐसे platformहैं जहां पर हम html code को लिखते हैंऔर html
प्रोग्राम को तैयार करते है। Notepad/Notepad++
एक simple text editor है जो beginners
के लिए अच्छा होता है। इनके अतिरिक्त हम अन्य editor जैसे- Edit Plus, NetBeans एवं Visual Studio
Code, Sublime Text 3आदि के द्वारा भी एक html program तैयार कर सकते है। हम यहां पर Notepad का इस्तेमाल
करेंगे।
First HTML Code-
<html>
<head>
<title>
This is First web Page
</title>
</head>
<body>
Good Morning India!
</body>
</html>
Notepad में इस code को लिखने के पश्चात् इसे .html या .htm
extension के साथ save करते है। save करने के बाद इस web file को किसी भी web
browser मे open करके इसके result को देख सकते है।
browser के पेज पर हम देखेंगे कि जो title
हमने <title> tag के अंदर लिखा है वह browser
के title पर दिखाई देगा और जो <body>
tag के अंदर लिखा है वह web pageके body
area पर दिखाई देगा। हम <body> tag के
अंदर जिन भी अन्य टैग का use करेंगे, उनका
result बेब पेज पर display होगा।
Types of Tags-Html में टैग दो प्रकार के होते है-
1.
Container Tag
2.
Empty Tag
Container Tag-ऐसे टैग जो एक opening एवं एक closing tag को रखते है,
container tag कहलाते है।
जैसे- <HTML>……………………………</HTML>
<HEAD>………………………….</HEAD>
<TITLE>…………………………..</TITLE>
</BODY>…………………………</BODY>
<P>………………………………….</P>
<HEADING TAG>………………</HEADING TAG>(H1 TO H6)
<B>……………………………………………….</B>
<I>…………………………………………………</I>
<U>………………………………………………..</U>
<TABLE>………………………………………..</TABLE>
<OL>……………………………………………….</OL>
<UL>……………………………………………….</UL>
<A>………………………………………………….</A>
Etc.
Empty Tag- ऐसे टैग जो closing tag नही रखते, empty tag होते हैं।
जैसे- <img> tag
<br>tag
<input>tag Etc.
Note- html tags, case sensitive नही होते है।
HTML TAGS AND
ATTRIBUTES
पैराग्राफ
टैग(ParagraphTag<p>………..</p>)–
यह
एक container tag हैं। पैराग्राफ के लिए<p> टैग का यूज HTML में किया जाता है।जब हमें बेब पेज
पर contents को पैराग्राफ के रूप में लिखने की आवाश्यकता
होती है , तब हम इस टैग का use करते है।
इसका
प्रारूप निम्नलिखित है –<p> Write Your Paragraph Here
</p>
By default,जब हम किसी पैराग्राफ को बेबपेज पर write करते है तब
यह left alignment के साथ display होता
है, किन्तु इसके alignment को हम <p>टैग के align attribute द्वारा परिवर्तित कर सकते
हैं।
जैसे-<p
align=” alignment”> Your Paragraph </p>
Alignment में हम निम्नलिखित
options का use कर सकते है –
·
Left
·
Right
·
Center
·
Justify
निम्नलिखित
उदाहरण में हम इसे समझतें हैं-
<html>
<head>
<title>
Paragraph
and Heading Tag
</title>
</head>
<body>
This
is a Paragraph
<p>This
is My First Paragraph</p>
<p
align=”center”> This is My Second Paragraph</p>
</body>
</html>
हैडिेंग टैग(Heading
Tag)-हैडिंग टैग भी एक container tag है। इसका उपयोग हैडिंग को write
करने के लिए किया जाता है। html में इसके लिए <h1> से लेकर<h6>तक के टैग यूज किये जाते है।
इनका syntax निम्नलिखित है-
<h1> your Heading Here </h1>
<h2> your Heading Here </h2>
…………………………………………………………………..
…………………………………………………………………..
<h6> your Heading Here </h6>
इसे हम निम्नलिखित उदाहरण द्वारा समझते है-
<html>
<head>
<title>
Heading tags
</title>
</head>
<body>
<h1> This is My First Heading </h1>
<h2> This is My Second Heading </h2>
<h6> This is My Sixth Heading </h6>
<body>
</html>
Inserting Image and Hyperlinks- Html में image को insert
करने के लिए <img> tag
एवं hyperlink को insert करने के लिए <a> tag का use किया जाता है।
<img>-Web Page में इमेज insert करने के लिए <img> tag
का use किया जाता है। यह एक empty tag है क्योकि इसमे कोई closing tag नही लिखा जाता है।
इसका syntax निम्नलिखत है-
<imgsrc=” Image Source” width=”width in pixel”
height=”height in pixel” alt=”alternate text”>
यहां पर <img> tag में src, width, height, alt इसके attribute हैं जो इमेज मे additional properties को add
करते हैं।
Src attribute में हम उस इमेज के source
को लिखते है जहां पर वह locate होती है।
जैसे- src=”C:\Windows\Web\Wallpaper\flower.jpg”
Width एवं height attribute में हम image की width एवं height को pixel
में specify
करते हैं।
Alt attribute में हम एक alternative
text को write करते हैं। कई बार कुछ problem
आ जाने के कारण image हमे बेबपेज पर नही दिखाई
देती ,तब उस समय alt attribute मे लिखा
हुआ text display होता है।
Example-
<html>
<head>
<title>
Inserting
Image
</title>
</head>
<body>
<h1>
Web Image </h1>
<imgsrc="C:\Users\Amit
Tiwari\Desktop\amitimg.jpg" width="500"
height="500" alt="Check
the path and refresh again!">
</body>
</html>
<a>tag-
<a>tag को anchor tag भी कहते हैं। anchor tag के द्वारा हम बेब पर
हाइपरलिंक दे सकते हैं। हाइपरलिंक से तात्पर्य बेब पर लिंक से है अर्थात्
हाइपरलिंक द्वारा बेब पर किसी टेक्स्ट, इमेज व अन्य आब्जेक्ट
पर लिंक उपलब्ध कराई जाती हैं। जब भी हम उस लिंक पर click करते
है, वह लिंक हमे एक नये पेज पर ले जाती है।
इसका syntax निम्नलिखित
है-
<a href=”url”> Text For Hyperlink </a>
Example-
<html>
<head>
<title>
Hyperlinking In Web
</title>
</head>
<body>
<h1> Hyperlink Using anchor tag </h1>
<a href="https:\\www.google.com">Click
Here For Google</a>
<body>
</html>
Table
Layout And Presentation-
html में बेबपेज पर table create करने के लिए <table> tag का use किया जाता है। यह एक container tag है जो table
से related elements को रखता है। टेबल की
शुरूआत <table>तथा अंत </table> tag के साथ होता है।
अन्य टैग की तरह ही <table>
tag मे भी attributes लिखे जा सकते है जो निम्नलिखित
है-
Border, width, cellspacing, cellpadding, bgcolor etc.
HTML में table को
लिखने का syntax निम्नलिखित है-
<table>
Table Data
</table>
Table में table data को
represent करने के लिए निम्नलिखित tags को लिखते है-
·
<tr>tag
·
<th>tag
·
<td>tag
·
<caption>tag
<tr>द्वारा table row, <th>द्वारा table heading, तथा <td>द्वारा table data को specify किया
जाता है। <caption>द्वाराtable caption दिया जा सकता है और <table> tagके बाद ही <caption>को लिखा जाना चाहिए। table heading bydefault, center alignment और bold होती है एवंtable caption भी by default center alignment के साथ प्रदर्शित
होता है।
निम्नलिखत उदाहरण द्वारा हम table creation को समझते है-
<!DOCTYPE html>
<html>
<head>
<title>Student Table</title>
</head>
<body>
<table>
<caption>Student Data</caption>
<tr>
<th>First Name</th>
<th>Last Name</th>
</tr>
<tr>
<td>Amit </td>
<td>Tiwari</td>
</tr>
<tr>
<td>Sagar</td>
<td>Sharma</td>
</tr>
</table>
</body>
</html>
<table>tag में हम इसके attributes
को निम्न प्रकार से लिख सकते है और इनके प्रभाव को बेबपेज पर देख
सकते है।
<table border="1" width="200" bgcolor="pink" cellspacing="5" cellpadding="5">
HTML5 में style attribute का use इस प्रकार से किया जाता है-
<table style="width:100%">,
<table style="background-color: blue;">
Background And Color Controls-
Website पर बेबपेज के background color को सेट करके पेज को
बेहतर look दिया जा सकता है। सामान्यत: बेबपेज का background
color सफेद होता है लेकिन हम इसे अपनी आवाश्यकतानुसार बदल सकते है
और कोई अन्य color सेट कर सकते है।
Web page पर बैकग्राउन्ड के रूप में एक image
को भी सेट किया जा सकता है।
Background color को set करने के लिए हम निम्न syntax को follow करते है-
<body bgcolor=”ColorName/ColorHexValue”>
एवं एक इमेज को बैकग्राउन्ड के रूप मे सेट करने के लिए
निम्न syntax का use करते है-
<body background=”Image Path With Image Name”>
दोनो ही syntax को
निम्नलिखत उदाहरण द्वारा समझ सकते है-
Color Value के साथ- <body
bgcolor=”red”>
Color Hexadecimal Value के साथ-<body
bgcolor=”#FF0000”>
इसी प्रकार एक इमेज को भी सेट कर सकते है-
<body background=”C:\Users\Amit
Tiwari\Desktop\amitimg.jpg”>
नोट-HTML5 bgcolor एवं background attribute को support नही करता है , लेकिन अभी भी सभी ब्राउसर द्वारा ये
attribute सर्पोट किये जा रहे है।
HTML5 में इसके लिए style attribute का use करते है-
<body style="background-color:green">
<body style="background-image: url('
C:\Users\Amit Tiwari\Desktop\amitimg.jpg ');">
एक उदाहरण द्वारा इन्हे समझते है-
<!DOCTYPE html>
<html>
<body style="background-color:yellow">
<h1 style="background-color:Blue">Hello
Rewa</h1>
<p style="background-color:Tomato">
In this Paragraph you will see the color
</p>
</body>
</html
Bgcolor attribute द्वारा पेज के background
color को निम्न प्रकार से सेट कर सकते है-
<!DOCTYPE html>
<html>
<body bgcolor="yellow">
<h1>bgcolor works with body
and table tag</h1>
</body>
</html
Color के लिए style attribute का use करना अधिक सुविधाजनक है और आपकी बेबसाइट के
लिए भी अच्छा है।
Text Color- बेब
पर लिखे गए text के color को style attribute द्वारा सेट कर सकते है।
जैसे-
<!DOCTYPE html>
<html>
<body style="color:blue">
This text will display in blue color
<h1 style="color:red">Hello Rewa!</h1>
<p style="color:green">This is a first
paragraph</p>
</body>
</html
Background And Color Using CSS- एक बेबपेज के background
and color को cssद्वारा आसानी से set किया जा सकता है। वास्तव मे color एवं background
के लिए real time पर html के साथ cssका ही use किया जाता
है।
Cssकी help से हम तीन
प्रकार से background and color को web page पर set कर सकते है-
1. Style attribute द्वाराbackgroundimage के लिए-<body
style="background-image: url('C:/Users/Amit
Tiwari/Desktop/amitimg.jpg');">
Color background के लिए-<body style="background-color:yellow;">
Text color के लिए- <body
style=”color:red”>
<h1 style=”color:blue”>………..</h1>
2. <style>tag के द्वारा
background image के लिए-
<style>
body{
background-image:url('C:/Users/Amit
Tiwari/Desktop/amitimg.jpg');
}
</style>
Color background के लिए-
<style>
body{background-color:red;}
</style>
Text Color के लिए-
<style>
body{color:blue;}
h1{color:pink;}
</style>
3. External Css File(.css) के द्वारा
background image के लिए-
body{background-image:url('C:/Users/Amit
Tiwari/Desktop/amitimg.jpg');}
background and text color के
लिए-
body {background-color: pink;}
h1
{color: blue;}
p {color: red;}
इसे हम एक file के रूप में .css extension के साथ save करते और html file में <link> element द्वारा कुछ इस प्रकार से
लिंक कर लेते है-
<head>
<link
rel="stylesheet" href=".css file">
</head>
एक उदाहरण द्वारा इसे
समझते है- index.html
<!DOCTYPE
html>
<html>
<head>
<link
rel="stylesheet" href="styles.css">
</head>
<body>
<h1>This
is a heading</h1>
<p>This
is a paragraph.</p>
</body>
</html>
Styles.css
body {
background-color:
pink;
}
h1 {
color: blue;
}
p {
color: red;
}
Font In HTML Document-html
में text पर fonts के
लिए <font>tag का use किया जाता
था किन्तु html5 <font>tag को support नही करता है। लेकिन <font>अभी भी ब्राउसर
द्वारा सर्पोट किया जा रहा है। html5 में style
attribute द्वारा font size, font style एवं text
alignment को set किया जाता है। font
size के लिए font-size, fonts के लिए font-family
तथा alignment के लिए text-align
property का use करते है।
इसे हम निम्न उदाहरण द्वारा समझते है-
<!DOCTYPE html>
<html>
<head>
<title>HTML Fonts
</title>
</head>
<body
style="font-size:30px;">
<p>This is a first
paragraph</p>
<p
style="font-family: Verdana;">This is a second paragraph</p>
<p
style="text-align:center;">This is Center Aligned Text.</p>
</body>
</html>
List Types And Its Tag-
html में list का use information’s को प्रदर्शित करने के लिए किया जाता है, यह list
ordered अथवा unordered हो सकती है। html
की helpसे web पर हम
सूचनाओं को प्रदर्शित करने के लिए टैग्स का use करते हैं।
Ordered List को
प्रदर्शित करने के लिए <ol> tag एवं Unordered
List को प्रदर्शित करने के लिए <ul> tag का use किया जाता है। इन tags के
inside लिस्ट आइटम को प्रदर्शित करने के लिए <li>tag
का use किया जाता है। ये सभी container
tag है।
Ordered list को
तैयार करने का syntax निम्नलिखित है-
<ol>
<li>list
item</li>
<li>list
item</li>
………………………………
</ol>
इसे निम्नलिखित उदाहरण द्वारा समझते है-
<!DOCTYPE html>
<html>
<head>
<title>Ordered
List</title>
</head>
<body>
<ol>
<li>Desktop</li>
<li>Laptop</li>
<li>Palmtop</li>
<li>Smartphone</li>
</ol>
</body>
</html>
इसका result कुछ इस
प्रकार से प्राप्त होगा-
1.Desktop
2.Laptop
3.Palmtop
4.Smartphone
प्राप्त result में
1,2,3,4,…. के क्रम मे items की list
display हो रही है। html मे list को 1,2,3..के अतिरिक्त अन्य क्रम मेभी प्रदर्शित किया
जा सकता है,इसके लिए type attribute का
use किया जाता है।
जैसे- <oltype=”value”>
<li>list
item</li>
<li>list
item</li>
………………………………
</ol>
Type attribute ordered list के लिए निम्नलिखित
values को रखता है-
type=”1”, type=”a”, type=”A”, type=”i”, type=”I”
1 list को number मे,
a listको small letter , A list को capital
letter मे तथा iएवं I list को roman number मे display करता
है।
<oltype=”A”>
<li>Desktop</li>
<li>Laptop</li>
<li>Palmtop</li>
<li>Smartphone</li>
</ol>
Nested Ordered List-जब
एक <ol> tag के inside दूसरे <ol>tag को लिखा जाता है तब इसे nested
ordered list कहते है।
जैसे- <ol>
<li>Desktop</li>
<li>Laptop</li>
<li>Palmtop</li>
<li>Smartphone</li>
<ol type=”i”>
<li>Samsung</li>
<li>Vivo</li>
<li>Oppo</li>
</ol>
</ol>
Unordered list को तैयार करने का syntax निम्नलिखित है-
<ul>
<li>list
item</li>
<li>list
item</li>
………………………………
</ul>
इसे निम्नलिखित उदाहरण द्वारा समझते है-
<!DOCTYPE html>
<html>
<head>
<title>Unordered
List</title>
</head>
<body>
<ul>
<li>Electronics</li>
<li>Fruits</li>
<li>Vegetables</li>
<li>Grocery</li>
</ul>
</body>
</html>
इसमे list,bulletsके साथ display होती है जैसे-
·
Electronics
·
Fruits
·
Vegetables
·
Grocery
<ul>tag मे भी type attributeका
use कर सकते है और इसमें निम्नलिखित 4 values को लिख सकते है-
Circle
Square
Disc
None
जैसे- <ultype=”circle”>
<li>Electronics</li>
<li>Fruits</li>
<li>Vegetables</li>
<li>Grocery</li>
</ul>
Nested Unordered List-जब
एक <ul>tag के inside दूसरा <ul>tag लिखा जाता है तब वह nested
unordered list कहलाता है। इसे निम्नलिखित उदाहरण द्वारा समझाया
गया है-
<!DOCTYPE html>
<html>
<head>
<title>Nested Unordered
List</title>
</head>
<body>
<ul
type="circle">
<li>Electronics</li>
<li>Fruits</li>
<ul
type="square">
<li>Mango</li>
<li>Orange</li>
</ul>
<li>Vegetables</li>
<li>Grocery</li>
</ul>
</body>
</html>
Definition List-html में किसी termया wordको परिभाषित करने के लिए definition
list का use किया जाता है। definition
list के लिए <dl>tag, definition term के
लिए <dt>तथा definition description के लिए <dd> tag का use किया
जाता है।
निम्नलिखित उदाहरण में हम इसे समझते
है-
<!DOCTYPE html>
<html>
<head>
<title>HTML Definition
List Example</title><body>
<dl>
<dt>HTML</dt>
<dd>HTML stand for Hyper Text MarkUp Language and
it is widely used to create web page</dd>
<dt>CSS</dt>
<dd>CSS
stands for Cascading Style Sheet and it is used to Style an HTML
Document.</dd>
</dl>
</body>
</html>
Use Frames In HTMl-यदि
बेबपेज को हम sections में divide करना
चाहते है , तब html में frame का use किया जाता है। इसके लिए <frameset>tag
का use किया जाता है। इस टैग का use करके हम एक बेबपेज को कई भागों में बाट सकते है। पेज पर इन divide किये गये sections को ही frame कहते है। ये sections अलग- अलग information’sको रखते है।
Html5 द्वारा frame को support
नही किया जाता है। अभी भी browsers पर इनके
प्रभाव को देखा जा सकता है लेकिन कुछ browsers इसे support
नही करते है।real time पर बेब डेवलपमेंट में frames
का यूज न के बराबर हो रहा है।
बेब पर frames create करने के लिए <frameset>tag
का use किया जाता है और <frameset>tag
के inside<frame>tag को लिखा जाता है। <frameset>tag
दो attributes को रखता है- rows and
cols.
Rows attribute द्वारा बेबपेज को horizontally divide तथा cols
attribute द्वारा पेज को vertically divide किया
जा सकता है। इन attributes की values को
% के साथ लिखा जाता है।
Wild card symbol (*) द्वारा page के remaining part को specify किया
जा सकता है।
जैसे- <frameset rows="50%,50%">
<frameset rows="20%,30%,*">
<frameset cols = “25%,50%,25%”>
<frameset rows="50%,50%" cols="50%,50%">
<frameset>tagमें
इनके अतिरिक्त निम्नलिखित attributes को भी use
मे लिया जा सकता है-
·
frameborder Attribute-इस attribute द्वारा frame मे border show/hide कर सकते है। इसके लिए value
yes/no देते है।
·
border attribute-इस attribute द्वारा frame के border को specify कर सकते
है।
<frame>tagमें निम्नलिखित attributes लिखे जा सकते है-
·
src attribute- इस attribute
द्वारा किसी source file को specify कर सकते है जिसके content को frame में दिखाना चाहते है।
·
name- name attribute द्वारा frame को एक नाम दे सकते है जिसके द्वारा वह
पहचाना जायेगा।
·
noresize-इस attribute
को सेट करने से frame की size को कम या ज्यादा करने से रोका जा सकता है।
कुछ उदाहरण द्वारा इसे समझते है-
नोट- framesमें <body> tag का use नही किया जाता है।
<html>
<frameset rows="50%,50%">
<frame src="index1.html" >
<frame src="index2.html">
</frameset>
</html>
हम row तथा columns को एक
साथ specify कर सकते है।
<html>
<frameset rows="50%,50%"
cols="50%,50%">
<frame src="index1.html">
<frame src="index2.html" >
<frame src="index3.html" >
<frame src="index4.html" >
</frameset>
</html>
हम अन्य attributes को निम्न प्रकार से शामिल कर
सकते है-
<html>
<frameset rows="50%,50%"
cols="50%,50%" border="10">
<frame src="index1.html"
noresize="yes" name="index1">
<frame src="index2.html"
noresize="yes" name="index2">
<frame src="index3.html"
noresize="yes" name="index3">
<frame src="index4.html"
noresize="yes" name="index4">
</frameset>
</html>
Forms
In HTML- webpageपर फार्म का use
यूजर से input लेने के किया जाता है।
जैसे-student registration form, job apply form , railway
registration form etc.
इन forms द्वारा user से
कुछ जानकारियॉ मांगी जाती है और user इसमे अपनी जानकारियां
भरकर registration करता है। html में
बेब पर form create करने के लिए <form>tag का use किया जाता है।
इसका syntax निम्नलिखित है-
<form>
Form elements
</form>
इस syntax में form की
शुरूआत<form>तथा अंत </form> tag से हो रहा है अत: <form>भी एक container
tag है। अन्य टैग की तरह ही <form> tag भी कई attributes को रखता है।
जैसे-
Action-इस attribute के inside वह
urlलिखा जाता है जहां dataभेजा जायेगा।
Method-इस attribute द्वारा यह define किया जाता है कि data किस प्रकार भेजा जायेगा।
इसमें दो method
use की जाती है- Get अथवा Post।
Form में by default get method होती है, इस method में भेजा
गया data ब्राउजर के address bar पर
दिखाई देता है अत: यह security feature नही रखता। जबकि Postmethodमें भेजा गया data browser पर दिखाई नही देता और data
को secure रखता है।
Target- target attribute यह define करता है कि भेजे गये data या result को कहॉ दिखाना है। जैसे new tab पर या उसी page पर।
इसके लिए _blank , _self , _top etc. values रख सकते
है।
ऊपर दिये गए attributes
के अलावा अन्य attributes जैसे enctype
, autocompleteetc. कोभी आवाश्यकतानुसार <form> tag मे लिखा जा सकता है।
<form>tag के inside form
elements को लिखा जाता है। form elements के
रूप में textbox, radio button, checkbox, submit button, labels etc. को रखा जाता है। इन elements को form में add करने के लिए <input> tag का use किया जाता है।
जैसे-
<input type=”text” name=”fname” placeholder=”First
Name”>
<input type=”submit” name=”submit” value=”Submit”>
<input type=”radio” name=”gender”>
<input type=”checkbox” name=”html”> etc.
<input> tag के अतिरिक्त html में कुछ अन्य टैग भी use किये जाते है जैसे-
<textarea> ,<select> , <option>एवं <fieldset> etc.
एक उदाहरण द्वारा इसे समझते है-
<html>
<head>
<title>
HTML Forms
</title>
</head>
<body>
<form action="index.html"
method="post" target="_BLANK">
First Name:<input type="text"
name="fname" placeholder="First Name"></br>
Last Name:<input type="text"
name="lname" placeholder="Last Name"></br>
Choose Your Streams:
<input
type="radio" name="stream">Math
<input
type="radio" name="stream">Biology
<input
type="radio" name="stream">Arts
<input
type="radio" name="stream">Commerce<br></br>
Choose Your Subjects:
<input type="checkbox"
name="math">Math
<input
type="checkbox" name="physics">Physics
<input
type="checkbox" name="chemistry">Chemistry
<input
type="checkbox" name="biology">Biology
<input
type="checkbox" name="history">History
<input type="checkbox" name="accounting">Accounting<br><br>
Select Your City:
<select
name="dropdown">
<option
value="rewa"> Rewa</option>
<option
value="satna"> Satna</option>
<option
value="bhopal"> Bhopal<option>
</select><br></br>
Upload Your Resume:<input type="file"
name="resume"><br></br>
Message:<textarea rows="10"
cols="40" name="message"> Write Your Message
Here</textarea><br><br>
<input type="submit" name="submit"
value="Submit">
</form>
</body>
</html>
<Marquee>tag-
marquee tag का use text, linksतथा images
को screen पर verticallyएवं
horizontally scroll करने के लिए किया जाता है। इसे भी html5
द्वारा support नही किया जाता है। html5
में यह CSS की help से
किया जाता है।
Marquee tag का
syntax निम्नलिखित है-
<marquee>Texts/Links/Images</marquee>
<marquee> tag कई attributes को रखता है,
जैसे-
·
width
·
height
·
direction
·
behavior etc.
width तथा
height attribute द्वारा दिये गये width तथा height तक scroll किया जा
सकता है एवं direction attribute द्वारा directions को specify किया जाता है। directions के लिए up, down, leftऔर right value होतीं है। behavior के लिए slide, scroll तथा alternate values को लिखा जाता है।
<html>
<body>
<marquee height="80%"
direction="up">AmitTech Tutorials</marquee>
<marquee width="50%" direction="left">AmitTech
Tutorials</marquee>
<marquee behavior="alternate">AmitTech
Tutorials</marquee>
<marquee direction="down">
<imgsrc="C:\Users\Amit
Tiwari\Desktop\amitimg.jpg" height="150"
width="150">
</marquee>
<marquee>
<a
href="https://www.google.com/">Click Here For Google</a>
</marquee>
</body>
</html>
<div>tag- <div>tag का use page को sections में divide
करने के लिए किया जाता है। यह टैग एक container tag है जो html tags को रखता है। इसका use बेब लेआउट तैयार करने के लिए किया जाता है और इसका use भी CSS के साथ किया जाता है।
उदाहरण-
<html>
<body>
<h1>Div
In Html</h1>
<div
style="background-color:tomato">
<p> div tag is used to
divide a section in a page</p>
<h1>Div in CSS</h1>
</div>
<p>You can implement
div tag using css very efficently</p>
</body>
</html>
Subscribe to:
Comments (Atom)