All HTML Tag and Ex 2023

Website : copa.mrcodings.
com HTML TAG

Email : copatrade2@gmail.com
HTML Heading
<h1> થી <h6>
- વેબ પેજ માાં હેડ ગ
ાં ટેગ દ્વારા ટાઇટલ કે સબ-ટાઇટલને દર્ાાવી ર્કાય છે .
- Example
Code Output
HTML Paragraphs
<p>
- વેબ પેજ માાં પેરેગ્રાફ દર્ાાવવા માટે
- Example
Code Output
Trade: C O P A T r a d e 1|Page
Website : copa.mrcodings.com HTML TAG
HTML Horizontal Rules

<hr>
- વેબ પેજ માાં આ ી લાઇન દર્ાાવવા
- Example
Code Output
HTML Line Break

<br>
- વેબ પેજ માાં લખાણ લખેલ લઈનને બ્રેક કરી લખાણને ત્યાર પછીની લાઇનમાાં લેવા માટે
- Example
Code Output
HTML Formatting
<b>
- Bold text
- લખાણને બોલ્ કરવા એટલે ઘાટાં લખવા
- Example
Code Output
<strong>
- Important text
- લખાણને બોલ્ કરવા અને <b> ટેગ દ્વારા લખેલ બોલ્ લખાણ કરતાાં વધ મહત્વનાં લખાણ છે તેમ
દર્ાાવવા
- Example
Code Output
<i>
- Italic text
- લખાણને ઇટાલલક કરવા એટલેકે લખાણ થો ાં ત્ાાંસાં ડ સ્પ્લે કરવા
- Example
Code Output
<em>
- Emphasized text
- લખાણને ઇટાલલક કરવા અને <i> ટેગ દ્વારા લખેલ ઇટાલલક લખાણ કરતાાં વધ મહત્વનાં લખાણ છે
તેમ દર્ાાવવા
- Example
Code Output
<mark>
- Marked text
- લખાણને પીળા કલરના બેકગ્રાઉન્ કલરમાાં હાઇલાઇટ કરવા.
- Example
Code Output
<small>
- Smaller text
- લખાણની ફૉન્ટ સાઇઝ અન્ય લખાણની ફૉન્ટ સાઇઝ કરતાાં થો ી નાની કરવા.
- Example
Code Output
<del>
- Deleted text
- લખાણની ઉપર લાઇન દોરવા એટલે કે લખાણને સ્પરાઈક થ્ર કરવા
- Example
Code Output
<u>
- Underline
- લખાણની નીચે લાઇન કરવા માટે
- Example
Code Output
<ins>
- Inserted text
- લખાણની નીચે લાઇન આવર્ે પણ આ લખાણ અન્ય લખાણ પછી અલગથી ઉમેરેલ છે તેવાં બ્રાઉઝરને
અને HTML ને જણાવવા
- Example
Code Output
<sub>
- Subscript text
- લખાણને અન્ય લખાણ કરતાાં થો ાં નીચેની બાજ અને નાના અક્ષરે લખવા.
- Example
Code Output
<sup>
- Superscript text
- લખાણને અન્ય લખાણ કરતાાં થો ાં ઉપરની બાજ અને નાના અક્ષરે લખવા.
- Example
Code Output
HTML Links
<a>
- હાઇપર લલન્ક આપવા માટે.
- હાઇપર લલન્ક આપવા માટે <a> ટેગની સાથે તેના href એરીબ્યટનો ઉપયોગ કરવો પ ે છે .
- જે વેબપેજ ઓપન કરવાં હોય તેનો પાથ href એરીબ્યટને આપવો પ ે છે .
- Example
Code Output
- target એરીબ્યટને
→ આ એરીબ્યટ દ્વારા હાઇપર લલન્ક દ્વારા ખૂલતાં વેબપેજ બ્રાઉઝરના કયા ટેબમાાં ઓપન કરવાં છે
તે સેટ કરી ર્કાય છે . target એરીબ્યટની વેલ્યૂ નીચે માાંથી કોઈ એક હોય ર્કે.
▪ _self = બ્રાઉઝરનાં જે ટેબ ખૂલાં છે તેમાાં જ લલન્ક ઓપન થર્ે
▪ _blank = બ્રાઉઝરના નવા ટેબમાાં લલન્ક ઓપન થર્ે
- Example
Code
Output
Website : copa.mrcodings.com HTML EXERCISE
HTML Ex -001-Head Tag
----- X ------
HTML Ex-002-Paragraph Tag
----- X ------
HTML Ex -003-hr Tag
----- X ------
HTML Ex -004-Line Break
HTML Ex -005-bold Tag
<b> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો
----- X ------
HTML Ex -006-Strong Tag
<strong> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો
----- X ------
HTML Ex -007-Italic Tag
<i> અને <strong> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો
----- X ------
HTML Ex -008-Emphasized Tag
<em> અને <strong> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો
----- X ------
HTML Ex -009-mark Tag
<em> અને <mark> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો
----- X ------
HTML Ex -010-small Tag
<small> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો
----- X ------
HTML Ex -011-Deleted Tag
<del> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો
----- X ------
HTML Ex -012-UnderlineTag
<u> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો
----- X ------
HTML Ex -013-Inserted Tag
<ins> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો
----- X ------
HTML Ex -014- Subscript Tag
<sub> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો
----- X ------
HTML Ex -015-Superscript Tag
<sup> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો
----- X ------
HTML Ex -016-LinkTag
વેબપેજ માં નીચે મુજબની િલ ક તૈયાર કરો જે ના પર િ લક કરતાં YouTube ઓપન થાય
લ ક પર લક કયા બાદ
----- X ------
HTML Ex -017-Link Tag
વેબપેજ માં નીચે મુજબની િલ ક તૈયાર કરો જે ના પર િ લક કરતાં તમારી ઇ ટા ામ ોફાઇલ ઓપન થાય
લ ક પર લક કયા બાદ
Trade: C O P A T r a d e 10 | P a g e
----- X ------
HTML Ex -0018-Link Tag
વેબપેજ માં નીચે મુજબની તમામ એ સરસાઇઝ માટે િલ ક તૈયાર કરો જે માં જે તે એ સરસાઇઝ ની િલ ક પર
િ લક કારવાથી અગાઉ એ સરસાઇઝ તૈયાર કરેલ હશે તો ઓપન થશે.
થમ લ ક પર લક કયા બાદ
----- X ------
HTML Images
<img>
- વેબપેજમાાં ઇમેજ મૂકવા માટે.
- વેબ પેજમાાં ઇમેજ મૂકવા માટે <img> ટેગની સાથે src એરીબ્યટનો ઉપયોગ થાય છે .
- કઈ ઇમેજ મૂકવી છે તે ઇમેજ નો પાથ src ને આપવો પ ે છે
- Example
Code Output
- width અને height એરીબ્યટ

→ width એરીબ્યટ દ્વારા વેબ પેજમાાં મકેલ ઇમેજની પહોળાઈ સેટ કરી ર્કાય છે .
→ height એરીબ્યટ દ્વારા વેબ પેજમાાં મકેલ ઇમેજની ઊચાઇ સેટ કરી ર્કાય છે .
→ પહોળાઈ અને ઊચાઇ હમેર્ાાં “px” (લપકસેલ) માાં આપવી
- Example
Code
Output
HTML Ex -019-ImgTag
વેબપેજ માાં નીચે મજબની કોઈપણ ઇમેજ મૂકો
----- X ------
HTML Ex -020-ImgTag
વેબપેજ માાં નીચે મજબની કોઈપણ ઇમેજ મૂકો અને width="225px” અને height = “200px” સેટ
કરો.
HTML Table
<table>
- વેબપેજમાાં ટેબલ ઉમેરવા માટે.
- <table> ટેગ ની સાથે અન્ય બે ટેગ <tr> અને <td> નો ઉપયોગ કરવો પ ે છે .
- ટેબલની બો રા દર્ાાવવા માટે ટેબના border એરીબ્યટનો ઉપયોગ કરવામ આવે છે .
<tr> અને <td>

- વેબપેજમાાં ટેબલની અાંદર નવી રો ઉમેરવા માટે <tr> ટેગને <table> ટેગની અાંદર લખવામાાં આવે
છે .
- ટેબલમાાં ઉમેરલ
ે રો ની અાંદર કૉલમ ઉમેરવા માટે <td> ટેગને <tr> ટેગની અાંદર લખવામાાં આવે છે .
- Example1
Code Output
- Example2
Code Output
HTML Ex -021-Table Tag
વેબપેજ માાં નીચે મજબનાં ટાઈમ ટેબલ તૈયાર કરો
----- X ------
<td> ટેગ માટે colspan Attribute

<td colspan=“n” >
- colspan એરીબ્યટનો ઉપયોગ હાંમેર્ા <td> ટેગમાાં જ કરવામાાં આવે છે
- એક રો માાં કૉલમ મજા કરવા માટે colspan એરીબ્યટનો ઉપયોગ કરવામાાં આવે છે .
- વેલ્યૂ n એટલે એક રો માાં કેટલી કૉલમ મજા કરવી હોય તે સાંખ્યા.
- Example1
Code Output
<td> ટેગ માટે rowspan Attribute
<td rowspan=“n” >

- rowspan એરીબ્યટનો ઉપયોગ હાંમેર્ા <td> ટેગમાાં જ કરવામાાં આવે છે
- એક કૉલમમાાં કૉલમની નીચેની એક કરતાાં વધ રો મજા કરવા માટે rowspan એરીબ્યટનો ઉપયોગ
કરવામાાં આવે છે .
- વેલ્યૂ n એટલે એક કૉલમમાાં કૉલમની નીચેની કેટલી રો મજા કરવી હોય તે સાંખ્યા.
- Example1
Code Output
HTML Form Control
<form> ટેગ
- HTML વેબ પેજ પર ફોમા તૈયાર કરવા માટે <form> ટેગનો ઉપયોગ કરવામાાં આવે છે .
- વેબ પેજ પર ફોમા તૈયાર કરવા માટે અલગ અલગ કાંરોલ આવેલા છે . આ તમામ કાંરોલ માટે અલગ
અલગ ટેગ નક્કી કરેલ છે .
- તમામ ફોમા કાંરોલને <form> ટેગની અાંદર લખવામાાં આવે છે .
- Example
Code
<form> ટેગની અાંદર ઉપયોગમાાં લેવાતા લવલવધ ફોમા કાંરોલ

- <form> ટેગની અાંદર લખવામાાં આવતા લવલવધ ટેગ
<label>
<input>
<select>
<textarea>
<button>
<label>
- લેબલ એટલે કે કોઈપણ ડફલ્ ની આગળ ડફલ્ ર્ા માટે છે તે દર્ાાવતાં લખાણ ઉમેરવા માટે.
- Example (Ex-23 Form Control label)
Cod Output
<input> ટેગ
- ફોમાની અાંદર લવલવધ કાંરોલ ઉમેરવા માટે <input> ટેગનો ઉપયોગ કરવામાાં આવે છે .
- કયા પ્રકારનો કાંરોલ ફોમામાાં ઉમેરવો છે તે મજબ <input> ટેગનાં type એરીબ્યટની વેલ્યૂ લખવામાાં
આવે છે .
- <input> ટેગનાં type એરીબ્યટ અને તેની વેલ્યૂ
- <input type = "text">

- એક લાઇનમાાં લખાણ લખી ર્કાય તેવાં ટેક્સ્પટ બોક્સ ઉમેરવા માટે.
- Example (Ex-24 Form Control input type text)
Code Output
- <input type = "password">

- પાસવ ા ટાઇપ કરતાાં સમયે પાસવ ા જોઈ ન ર્કાય તેવાં ટેક્સ્પટ બોક્સ ઉમેરવા માટે.
- Example (Ex-25 Form Control input type password)
Code Output
- <input type = "submit">

- ફોમામાાં ઉમેરેલ લવલવધ કાંરોલની વેલ્યૂ submit કરવા માટેનાં બટન ઉમેરેવા માટે.
- બટન પર જે લખાણ લખવાં હોય તે લખાણ value એરીબ્યટમાાં લખવામાાં આવે છે .
- Example (Ex-26 Form Control input type submit)
Code Output
- <input type = "reset">

- ફોમાના લવલવધ કાંરોલમાાં દાખલ કરેલ વેલ્યૂ દૂર કરવા માટેનાં બટન ઉમેરેવા માટે.
- Example (Ex-27 Form Control input type reset)
Code Output
- <input type = "radio">

- ફોમામાાં એક કરતાાં વધારે લવકલ્પ આપી કોઈ એક લવકલ્પ પસાંદ કરવા માટે રેડ યો બટન ઉમેરેવા માટે.
- રેડ યો બટનના name એરીબ્યટમાાં કોઈપણ નામ આપવાં અને એક સમૂહમાાં રહેલ તમામ રેડ યો
બટનનાં name એરીબ્યટ એક સરખાં રાખવ.ાં
- Example (Ex-28 Form Control input type radio)
Code
Output
- <input type = "checkbox">

- ફોમામાાં એક કરતાાં વધારે લવકલ્પ આપી ઈચ્છા મજબ લવકલ્પ પસાંદ કરવા માટે ચેકબોક્સ ઉમેરેવા માટે.
- Example (Ex-29 Form Control input type checkbox)
Code
Output
- <input type = "button">

- ફોમામાાં સામાન્ય બટન ઉમેરેવા માટે.
- બટન પર લક્લક કયાા બાદ ર્ાં થવાં જોઈએ તે onclick એરીબ્યટમાાં લખવામાાં આવે છે .
- Example (Ex-30 Form Control input type button)
Code
Output
- <input type = "date">

- ફોમામાાં તારીખ લસલેકટ કરવા માટેનાં કાંરોલ ઉમેરેવા માટે.
- Example (Ex-31 Form Control input type date)
Code
Output
- <input type = "month">

- ફોમામાાં મલહનો લસલેકટ કરવા માટેનાં કાંરોલ ઉમેરેવા માટે.
- Example (Ex-32 Form Control input type month)
Code
Output
- <input type = "email">

- ફોમામાાં ઈમેલ એન્ટર કરવા માટેનાં ટેક્સ્પટ બોક્સ ઉમેરેવા માટે.
- Example (Ex-33 Form Control input type email)
Code
Output
ખોટાં ઈમેલ દાખલ કરતાાં નીચે મજબની એરર ડ સ્પ્લે થર્ે
- <input type = "color">

- ફોમામાાં કલર લસલેકટ કરવા માટેનાં કાંરોલ ઉમેરેવા માટે.
- Example (Ex-34 Form Control input type color)
Code
Output
<select> ટેગ
- ફોમાની અાંદર લવકલ્પ પસાંદ કરવા માટે કાંરોલ પર લક્લક કયાાબાદ નીચેની બાજ લલસ્પટ ખૂલે તે માટેનાં
ડ્રોપ ાઉન ઉમેરવા માટે <select> ટેગનો ઉપયોગ કરવામાાં આવે છે .
- ડ્રોપ ાઉનનાં લલસ્પટ તૈયાર કરવા માટે <select> ટેગની અાંદર <option> ટેગનો ઉપયોગ કરવામાાં
આવે છે
- Example (Ex-35 Form Control select)
Code
Output
ડ્રોપ ાઉન પર લક્લક કયાા બાદ
<textarea> ટેગ
- ફોમાની અાંદર એક કરતાાં વધ લાઇન વાળાં લખાણ મેળવવા માટે <textarea> ટેગનો ઉપયોગ કરવામાાં
આવે છે .
- Example (Ex-36 Form Control textarea)
Code
Output
HTML Ex -037-HTML Form-1
વેબપેજ માાં નીચે ફોમા તૈયાર કરો

All HTML Tag and Ex 2023

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

All HTML Tag and Ex 2023

Uploaded by

Copyright:

Available Formats

Website : copa.mrcodings.

com HTML TAG

HTML Horizontal Rules

HTML Line Break

HTML Ex -001-Head Tag

HTML Ex-002-Paragraph Tag

HTML Ex -003-hr Tag

HTML Ex -005-bold Tag

<b> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો

HTML Ex -007-Italic Tag

HTML Ex -009-mark Tag

HTML Ex -011-Deleted Tag

<del> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો

HTML Ex -013-Inserted Tag

<ins> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો

HTML Ex -015-Superscript Tag

<sup> ટેગનો ઉપયોગ કરી નીચે મુજબનું પેજ તૈયાર કરો

HTML Ex -017-Link Tag

- width અને height એરીબ્યટ

વેબપેજ માાં નીચે મજબની કોઈપણ ઇમેજ મૂકો

<tr> અને <td>

HTML Ex -021-Table Tag

વેબપેજ માાં નીચે મજબનાં ટાઈમ ટેબલ તૈયાર કરો

<td> ટેગ માટે colspan Attribute

<td> ટેગ માટે rowspan Attribute

<td rowspan=“n” >

HTML Form Control

<form> ટેગની અાંદર ઉપયોગમાાં લેવાતા લવલવધ ફોમા કાંરોલ

- <input type = "text">

- <input type = "password">

- <input type = "submit">

- <input type = "reset">

- <input type = "radio">

- <input type = "checkbox">

- <input type = "button">

- <input type = "date">

- <input type = "month">

- <input type = "email">

ખોટાં ઈમેલ દાખલ કરતાાં નીચે મજબની એરર ડ સ્પ્લે થર્ે

- <input type = "color">

ડ્રોપ ાઉન પર લક્લક કયાા બાદ

HTML Ex -037-HTML Form-1

વેબપેજ માાં નીચે ફોમા તૈયાર કરો

HTML Ex -038-HTML Form-2

વેબપેજ માાં નીચે ફોમા તૈયાર કરો

HTML Ex -039-HTML Form-3

વેબપેજ માાં નીચે ફોમા તૈયાર કરો

HTML Ex -040-HTML Form-4

વેબપેજ માાં નીચે ફોમા તૈયાર કરો

HTML Ex -041-HTML Form-5

વેબપેજ માાં નીચે ફોમા તૈયાર કરો

You might also like