bangla html

33
| : (HTML) Hyper Text Markup Language. ! , " !# $" % ! &# # (% #।%# ( # & ( " # " *%+ % "#।" য- &&& ( % . "% -% "# %" /0 ", /0 ( 1( " . # " $ (2 ।&#(3 ""+ $#& ( " "4 $#& Driven #& *%+ % "#& গ# (% (5 $ #) "$। Notepad open *%+ ।য% % % "$ - 62 2 " $7$ $ & # Netbeans # Dreamweaver. য- 8 9% % % 62 % " (% (:! # -- ; (Elements) (Tag) <# (Attribute) ; (HTML Elements) (Elements): ;& HTML =#>।% HTML page % ? ( # ;& ! (tag) @ *%+। HTML ;! A #-।&#B " & Web page #- % % " Paragraph text, #,গ( %- &# B elements " ;(Element) % ( গC%। 62 (opening tag) ,; @D % ( # (3 #E (closing tag) 1. <p> - opening paragraph tag 2. Element Content - paragraph words 3. </p> - closing tag % Web page %# + ;(Element) ! F : HTML,head, title # body elements ! #3 B<html> Element...</html> &# HTML 62% HTML (: # (3 less than greater than ( < >) G -% : <html> B " (3 </html> -% #। 5 <html> Welcome to Bangladesh </html>Welcome to Bangladesh Web page -(% #। # & Notepad Web page *%+ % "। - Notepad Open % #। start All Programs > Accessories >Notepad %" Notepad # " H $ # 1.<html> 2.Welcome to Bangladesh 3.</html> # " Notepad I % save J # %" index.html save #& I Double click open # -# Browser open B। # & web Page *%+ <head> element $K; head, $K; &LE M @ -। <head> elements " header -( head elements @ && N -(% ; @ ( % "<title> element <head> ; O <title> ; % (:! title elements opening (<title>)#

Upload: shopnomoy-prantor

Post on 20-Jun-2015

1.103 views

Category:

Documents


19 download

TRANSCRIPT

Page 1: Bangla html

�������� ����� � | �� ���

���� ��: ���� ��� ���

• �������� (HTML) �� ��� ��� Hyper Text Markup Language.� ��� ������ � �!� � � ,��� �"

� �!� �।

• �� # �$���"� ��% ��� �� � �!� � � &#� ��গ ����# �(��% ��#।%�# � �(� ��# &��। • � �(���� �"�� �� �� # �"� *%�+ ���% "��#�।��"� য�- �&�&�& �(��� %��� . �"���% ����� ��

�-�% "��#�

• %�"� ���/�0� "�, ���/0 �(�� �� ��1��(� ���� �"�� . �� # �"�� $����� �� (�2

��।&#�(�3 �"����"+ �$�#& �(��� �"�� "���4 �$�#& Driven �� #&� *%�+ ���% "��#�। �য ����& �গ�# �������� �(��% (��� 5 �������� ��$ ��� ����#�)

��" $। Notepad open ��� *%�+ ���।�য��%� �%� � %� ��" $ �-� � 62 �2� "�� �� ��� �$�7$ ��$�� &���

���#� �য�� Netbeans # Dreamweaver.�� য�- �8��� �� � ���� ���9% ��� %��� %��� ���� 62 ���%

"���। �������� �(��% �য (:!�� ����# �� -���-

• �������� �����; (Elements)

• �������� গ (Tag) • �������� � �<�#� (Attribute)

�������� �����; ����� � (HTML Elements)

�����(Elements): �����;& �� HTML �� ��� ��=�#>�।%� HTML page �� ��%�� �?�� ��(�� #��� ���।

�����;& !�� গ(tag) �� �@ �� *%�+। HTML �����;!�� ���� A�� �#- ��।&#��B� য �"�� ����� &��� Web

page � �#- �� % ��% "�� Paragraph text, ��� # ��,�����গ(� ���� �% �- &# ��B�� elements �� �"���। ��� �����;(Element) ��� �%�� ��( ��� গC%। 62 ��� গ(opening tag) ,�����; �� @���D % ��( �#� �(�3 #E

��� গ(closing tag) ।

1. <p> - opening paragraph tag 2. Element Content - paragraph words 3. </p> - closing tag

��% � Web page �� ��%# �� ��+ ��� �����;(Element) ��� �!�� ���F: HTML,head, title �#� body elements ।

�!�� �#3� ���� ����� �� �� �B। <html> Element...</html> &#� ���� HTML ���� 62�% HTML (�:� ���� �#� �(�3 less than � greater than ( < >) ��G �-�% � । �য��:

<html> । ��� ��B� ���� "� �(�3 </html> গ� �-�% ��#। ���5 <html> Welcome to Bangladesh </html>। Welcome

to Bangladesh �� ���� Web page � �-�(% ��#।��� ��# &��� Notepad � ���� Web page *%�+ ���% "��। ��� ���-� Notepad Open ���% ��#। ����

start ���� All Programs > Accessories >Notepad

%�"� Notepad �#� "� ���H� ��$� ����# 1.<html> 2.Welcome to Bangladesh 3.</html>

���# ���� "� Notepad �� I�� ���� ��% save � �J� ��# %�"� index.html ��� save ��#।

�&� �� I����� Double click ��� open ���# । �-��# �য ���� Browser � open �� �B। ��# &��� �� web Page

*%�+ �� �গ��। <head> element ��� $K��; head, $K��; &L�E ��M��� @�� �- । <head> elements য �"��� header ���-�( ���। head elements ��

��@ �� গ &�&�� N���� �-�(�% � �। ��� ��� �����; �� �@ �� ��( ���% "��। <title> element <head> �����; �� ��O <title> �����; ���% � । �য� (:!�� title elements �� opening (<title>)�#�

Page 2: Bangla html

closing(</title>) tag �� ��@ ��� � % browser �� ��� # �(���� ��&�# �-�(�% � । 1.<html> 2.<head> 3.<title> My WebPage!</title> 4.</head> 5.</html> <body> element body element য web page �� �-�(�% &�� �#3 !�� @�� ���। �য &# �#3 !�� ��� web page � �-��% �� % body element গ �� ��@ ���% � । 1.<html> 2.<head> 3.<title>My WebPage!</title> 4.</head> 5.<body> 6.Hello World! All my content goes here! 7.</body> 8.</html> �� ��$!�� ��" �$ ��" �"P ��� .html extension �-� �&� ��� �য��� N���� ����� �#� ����� *%�+ ��� �� # �"�

�-���।

�������� গ ����� � (HTML Tag Tutorial in Bangla)

���� ��: �I��-M& ���

য�� �"�� �������� $K��; �"� ��% ��� , $� ��% #�� &# &� �"�� গ �-��% "�#�। �� ��� ��# �-�(�% ��#

�য� paragraph �-��% paragraph �� ��%, ��#� �-��% ��#� �� ��%। গ �� �@� �%�� ��( ��B

�. 62 ��� গ(opening tag)

�.@���D % ��((contents)

গ.�(3 ��� গ (closing tag)।

�������� গ �� �@ �� �"�� web page � �"�� "B> �% #%� "Q�% "���। 1.<p>A Paragraph Tag</p>

গ �� #R� �B ��%� �S� �� ���%। ���� ��� �%� !�� গ �-��� ���। 1.<body> Body Tag (acts as a content shell) 2.<p>Paragraph Tag</p> 3.<h2>Heading Tag</h2> 4.<b>Bold Tag</b> 5.<i>Italic Tag</i> 6.</body> Closing �� � � � �� �: ��B� ��B� গ ��B য�-� closing tag �- � �� �� ���। %� ��� �����; @�� ��� �।�& গ � ��� line break tag

�#� % <br/> 2�" ��( �� � । য �#�(3 ��# # #�� �� � । ���5 ��� ��� ��� #- �-� �"� ��� ��% ��� 62 ��� �� � গ � # #�� �� � ।

��� ��B� গ ��B য�-��� �#�(3��# # #�� �� � �য�� ���� গ, ��"� গ। 1.<img src="/../mypic.jpg" /> -- Image Tag 2.<br /> -- Line Break Tag 3.<input type="text" size="12" /> -- Input Field �-(��:

--Line Break--

Page 3: Bangla html

�������� ��<�#� ����� � (HTML Attribute tutorial in Bangla)

���� ��: �I��-M& ���

গ �� &T&�� ��� �� ��<�#� # #�� �� � । @2� য�- ��� ��� ��#� *%�+ ��� %�# attributes # #�� ���

��#� �� �U, �V% C� ���% "��। �� attributes value �-� ��#� �� �U � �V%� �� �-�% "��। 1.<tag attributes ="value" attributes ="value">

1.<table width="150" height="100">

Class # id attribute �� # #�� � ��� %�# ��B� ��W% ��B। Class # id attribute &�&�� �����; I���� ���

�� ��� ��� %�# "-� � �X��� ��-� �� ��� ��B �#�(3 ��� ���/0 ,�&�&�& (�!�� &Y��� "�#�% ����� � �

����� �� �� �B। 1.<p>Paragraph type 1 Italics</p>

2.<p>Paragraph type 2 Bold</p>

�-(�� Paragraph type 1 Italics

Paragraph type 2 Bold

�������� ��� ������� (HTML Name Attribute)

Name attribute � Class # id attribute ��% ��W। Name attribute � � � I� � # �� � ��"� ������;� &�� �-� য । 1.<input type="text" name="TextField" />

�-(��:

�� attribute � TextField �-(���� �#3� �� ��� ��� %�# "-� � �X��� �� ���� �#�( �#-�(javascript , css) �������� � ���� ������� (HTML- Title attributes) �� attribute � ��� �������� �����; �� �(���� �#� �B popup �? য�Z ��� ��� ��# য�Z ��� য�� �� # �"��

. �(������ �"� ��& �� � %�� �B popup �?� �-(�� ���। <h2 title="Hello There!">Titled Heading Tag</h2> �-(�� Titled Heading Tag

�������� �� �� ������� (HTML- align attributes) য�- �"�� ������;� &�X�� �#U� "��#%� � ���% �� %�# % align attribute �-� ���% "���। align �#��W ��# �� য �য�� left, right & center । �$I[ ��&�# left align � ��#���% ���। 1.<h2 align="center">Centered Heading</h2>

Centered Heading 1.<h2 align="left">Left aligned heading</h2>

2.<h2 align="center">Centered Heading</h2>

3.<h2 align="right">Right aligned heading</h2>

Left aligned heading

Centered heading

Right aligned heading Generic attributes: Attribute �-� �� #�"� �� &Y�����# �P��� �� য । ���� ��#�� ��B� ��<�#� �- �� য ���� HTML Tag ��

&�� &��� # #�� �� য । Attribute Options Function align right, left, center &�X� (Horizontally) aligns tags

valign top, middle, bottom ��\(Vertically) aligns tags

bgcolor numeric, hexadecimal, RGB values

Element �� background color ���-(� ���।

backgroundURL Background image �"� element ���-(� ���।

id # #����+� ���-�( ���য + Element �� Name য Cascading Style Sheets (css) &�� # #�� �� � ।

Page 4: Bangla html

class # #����+� ���-�( ���য + Element �� �]�+�#� & য Cascading Style Sheets (css) &�� # #��

�� � ।

width Numeric Value Tables, images, or table cells �� width ���-�( ��� ।

height Numeric Value Tables, images, or table cells �� height ���-�( ��� ।

title # #����+� ���-�( ���য + �"�� elements �� "Pop-up" title ।

�������� " ��I ����� � (HTML Paragraph Tutorial in Bangla)

���� ��: �I��-M& ���

��� ��� ���� ��( ��� �S�^ " ��I গ # #�� �� � । �� ��#� &@�� �#� ��M���।

<p> গ -� �����- (" ��I) ���-(� �� � । �� গ # #�� ��� I�� " ��I ��?� �"�� ���� ������ I� ��� &D�_ � । 1.<p>Avoid losing floppy disks with important schoo l...</p> 2.<p>For instance, let's say you had a HUGE school. ..</p> �-(��: Avoid losing floppy disks with important school/work projects on them. Use the web to keep your content so you can access it from anywhere in the world. It's also a quick way to write reminders or notes to yourself. With simple html skills, (the ones you have gained so far)it is easy. For instance, let's say you had a HUGE school or work project to complete. Off hand, the easiest way to transfer the documents from your house could be a 3.5" floppy disk. However, there is an alternative. Place your documents, photos, essays, or videos onto your web server and access them from anywhere in the world. �������� �� � � �-� �������� (HTML paragraph –justification) � $� $K���; � ��� �য��# ��� ����� justify ��� &#�-�� &�� ��%� �%��� ��# �������� � justify # #��

��� ��� �� ���% "��। 1.<p align="justify">For instance, let's say you had a H UGE school or work...</p> �-(��: For instance, let's say you had a HUGE school or work project to complete. Off hand, the easiest way to transfer the documents from your house could be a 3.5" floppy disk. However, there is an alternative. Place your documents, photos, essays, or videos onto your web server and access them from anywhere in the world. �������� �� � � �-� � � �� (HTML paragraph –centering)

� $� $K���; �� �% " ��I �� ��%�� ��� display window �� ��@ �#U� ���#। 1.<p align="center">For instance, let's say you had a HU GE school or work...</p> �-(��:

For instance, let's say you had a HUGE school or work project to complete. Off hand, the easiest way to transfer the documents from your house could be a 3.5" floppy disk. However, there is an alternative. Place your documents,

photos, essays, or videos onto your web server and access them from anywhere in the world. �������� �� � � �-�� �� � �� (HTML paragraph –align right)

� $� $K���; �� �% " ��I �� ��%�� ��� display window �� $�"�( �#U� ���#। 1.<p align="right">For instance, let's say you had a HUG E school or work...</p> �-(��:

For instance, let's say you had a HUGE school or work project to complete. Off hand, the easiest way to transfer the documents from your house could be a 3.5" floppy disk. However, there is an alternative. Place your documents,

photos, essays, or videos onto your web server and access them from anywhere in the world.

�������� ���$� ����� � (HTML Heading Tutorial in Bangla)

Page 5: Bangla html

���� ��: �I��-M& ���

�������� � ���$� # �(���� &@��% ��� # &#��� ��&�# �-� য । ���$� গ �� ��@ �� �? bold ��&�# �-�(�% � �#� ��� য ���$� �� �\��� �"� ���� � ���। ���$� �\� !�� ` ��% a �� ��@ &+�#b। ���� `

&#��� #c �#� a &#��� �B ���$� 1.<body>

2.<h1>Headings</h1>

3.<h2>are</h2>

4.<h3>great</h3>

5.<h4>for</h4>

6.<h5>titles</h5>

7.<h6>and subtitles</h6>

8.</body>

Headings

are

great for

titles

and subtitles

�S ��� �#3 ���য ��%� ���$� �� ���L ��� �N� option ��B । � ���$� �� built in attribute । ���$� ���� &�

������ ��� �N� �� য । � ��! ��! �� � � � �� ���" ��� �:

��� ���$� �#� paragraph ��&�� # #�� ���% "��। ���� �-��� �- ��। 1.<h1 align="center">Essay Example</h1>

2.<p>Avoid losing floppy disks with important schoo l/work projects...</p>

3.<p>For instance, let's say you had a

4.HUGE school or work project to complete. Off ... </p>

�-(��:

Essay Example Avoid losing floppy disks with important school/work projects on them. Use the web to keep your content so you can access it from anywhere in the world. It's also a quick way to write reminders or notes to yourself. With simple html skills, (the ones you have gained so far by now) it is easy. For instance, let's say you had a HUGE school or work project to complete. Off hand, the easiest way to transfer the documents from your house could be a 3.5" floppy disk. However, there is an alternative. Place your documents, photos, essays, or videos onto your web server and access them from anywhere in the world.

������� ��� �N� ����� �

���� ��: �I��-M& ���

��� ��গ �-���B ��� �N� গ� �� � ��% ��� ��W। ��� �N� গ� �� ��� �(3 ��� �"��� �� ��� ��%

��� 62 ���% &�য ���#। �������� � গ d� ��� �N� ���G% �� � ।���e&I � �$� �য�� Enter �-��

����� ���� ��� য ,�� �� C� �%���। 1.<p> 2.Will Mateson<br /> 3.Box 61<br /> 4.Cleveland, Ohio<br /> 5.</p> �-(��:��� �N� �� &��য ��C� address *%�+ ���% "��। Will Mateson Box 61 Cleveland, Ohio

�#� ��C� &�f �g3� ���% "��। 1.<p>Sincerely,<br /> 2.<br /> 3.<br />

Page 6: Bangla html

4.Kevin Sanders<br /> 5.Vice President</p> �-(��: Sincerely, Kevin Sanders Vice President

��� �� �#3 ��� �� �� �� �য ��� �N� গ �� ��� closing tag �� �� �� ���। HTML horizontal rule: Horizontal rule ��

গ -� ��( �� � ।

গ� # #�� ��� screen �� �"� &�X�� ��� �-(�� ���। line break tag �� �% Horizontal rule tag �� ��� closing

tag ���। 1.<hr> 2.Use 3.<hr><hr> 4.Them 5.<hr> 6.Sparingly 7.<hr> #$�%�:

Use

Them

Sparingly

Horizontal rule ��� �h"�i # ��� ��#��� �#3 &��� ��( ��� �S�^ # #�� �� � । 1.<hr> 2.1. "The Hobbit", JRR Tolkein. 3. 4.2. "The Fellowship of the Ring" JRR Tolkein. �-(��:

1. "The Hobbit", JRR Tolkein. 2. "The Fellowship of the Ring" JRR Tolkein.

�������� ��P ����� � (HTML List Tutorial in Bangla)

���� ��: �I��-M& ���

�%� ����� �������� ��P �#- ��। <ol> tag �-� 62 ��� @�#��� ��P(ordered list), <ul> গ �-� 62 ���

@�#���% �+� ��P(unordered list), <dl> গ �-� 62 ��� &�9���� ��P(definition list)।

<ul> - unordered list; #���

<ol> - ordered list; �\�

<dl> - definition list; ���@�

Page 7: Bangla html

�������� &��� ��� (HTML ordered lists) <ol> গ �-� e��� ��P(ordered list) 62 �� � । <li> গ d� j�# � %��� (list item) �#O ।%��� *%�+�

�� <li> গ �� �"�� opening (<ol>) �#� closing (</ol>) tag �� ��@ ���% � । e��� (ordered) ��� ��� �\�

�য�� `, k, l �% �-। 1.<h4 align="center">Goals</h4>

2.<ol>

3.<li>Find a Job</li>

4.<li>Get Money</li>

5.<li>Move Out</li>

6.</ol>

#$�%�: Goals

1. Find a Job

2. Get Money

3. Move Out

Start attributes �-� ����� ����য + �\� ��% ��P 62 �� য । 1.<h4 align="center">Goals</h4>

2.<ol start="4" >

3.<li>Buy Food</li>

4.<li>Enroll in College</li>

5.<li>Get a Degree</li>

6.</ol>

#$�%�: Goals

4.Buy Food

5.Enroll in College

6.Get a Degree

�������� &��� ��� (HTML ordered lists continued) ��� �� ����� @�#��� ��P(ordered list) �� �B। �!�� &@�� `,k,l �\��� "��#�%� ���� �\� # #R� ��% "��

% #c ��%� # �B ��%�। type attribute # #�� ��� �\� "��#%� � �� � । 1.<ol type="a">

2.<ol type="A">

3.<ol type="i">

4.<ol type="I">

Ordered List Types:

Lower-Case Letters Upper-Case Letters Lower-Case Numerals Upper-Case Numerals

a. Find a Job

b. Get Money

c. Move Out

A. Find a Job

B. Get Money

C. Move Out

i. Find a Job

ii. Get Money

iii. Move Out

I. Find a Job

II. Get Money

III. Move Out

�������� ��� &� ��� (HTML unordered lists)

<ul> গ &��য #��� ��P *%�+ �� � । #��� ��P �#� �%� ��� �য�� `. squares k.discs l.circles । default ��&�#

&@��% full discs # #�� �� � । 1.<h4 align="center">Shopping List</h4>

2.<ul>

3.<li>Milk</li>

4.<li>Toilet Paper</li>

5.<li>Cereal</li>

6.<li>Bread</li>

7.</ul>

#$�%�: Shopping List

• Milk

• Toilet Paper

• Cereal

• Bread

Page 8: Bangla html

��� type attributes # #�� ��� unordered list �� �� � #��� # #�� ���% "��। <ul type="square"> <ul> type="dics"> <ul> type="circle"> type="square" type="disc" type="circle"

� Milk

� Toilet Paper

� Cereal

� Bread

• Milk

• Toilet Paper

• Cereal

• Bread

o Milk

o Toilet Paper

o Cereal

o Bread

�������� �������� ��� (HTML definition lists) Definition list �� # #�� &@��% ���@�� �-��% "�। <dl> tag # #�� ��� Definition list *%�+ �� � । য�� Define

��� 5 &�9� % ���% �� %�� bold ���� �-��� ���%। Definition list tag �� ��@ ��� -�� tag �X��� Z �&!�� ��� `. <dt> k. <dd> ।

<dl> tag: ��P �� 62 �� �� গ # #�� �� � ।

<dt> tag: য�� &�9� %(Define) ���# �� গ # #�� ��� %� �� ��� � ।

<dd> tag: <dt> tag � �য �� ��� �� �B %� &Y��� ���� ����� � । 1.<dl>

2.<dt><b>Fromage</b></dt>

3.<dd>French word for cheese.</dd>

4.<dt><b>Voiture</b></dt>

5.<dd>French word for car.</dd>

6.</dt>

#$�%�: Fromage French word for cheese. Voiture French word for car.

�������� ��� ��$ ����� � (HTML Color code)

���� ��: �I��-M& ���

Color set ��� �%�� "b�% ��B। &@�� ��B� ��� �য�� ���, &-, ��, &#��, �+�। �������� � ��� value

���� &� &�&�� ��-� �� ��� � ।���� `a� ��M��� ����� �� ��� ��। '(� ��)��� � � �:

Black

Gray

Silver

White

Yellow

Lime

Aqua

Fuchsia

Red

Green

Blue

Purple

Maroon

Olive

Navy

Teal

��������-�! �*�+ ,����� � � (HTML- Coloring system: rgb value) ��� �"��-��� ���"- web design �� �� HTML rgb # #���� "��(� �-# � ��� Non-IE browser, HTML rgb

&�"� ��� �। �"�� য�- CSS �(��% �� %��� �"��-� ���% �� �#3 &\�E ��।

Red, Green �#� Blue �� �%�� ����� &��_ ��� rgb । ��% ��� �� m(য�� ��� ��� ��� �) ��% knn(য�� .

���� &Y��� ���)। rgb I���� �� rgb(RED,GREEN,BLUE)।

Red, Green ��! Blue �� � �: bgcolor="rgb(255,255,255)" White

bgcolor="rgb(255,0,0)" Red

bgcolor="rgb(0,255,0)" Green

bgcolor="rgb(0,0,255)" Blue

Page 9: Bangla html

��������-�! �*�+:� - ���� � (HTML- Coloring system: Hexadecimal) ��� ��� Hexadecimal system #�O�% ��� ��� �� system ��� ��� � �C�। practice ��� �@ �� �#3 � ����

&�� � য�#। �� Hexadecimal system &�� �S�^ ����যগ �#� #o� # #p%। Hexadecimal system � �;�����

standard color।

Hexadecimal �� a digit ����� �"U"�। ��� -�� digit(RR), Red value ���-�( ��� "�#�%� -�� digit(GG), Green

value ���-�( ��� �#� &#��(3 -�� digit(BB), Blue value ���-�( ���। �������� � - ���� � �! bgcolor="#RRGGBB" �������� -�! �� � (HTML- Color code: breaking the code)

���� ��#�� �-��� �� �B ����# #R� Hexadecimal system �� Numbering system �� #�@�% ��� `a digit � �W+% ���।

Decimal 0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

Hexadecimal 0 1 2 3 4 5 6 7 8 9 A B C D E F

%� #R��� �\� ��&�# # #�� �� � । �� #R��� "�� �\�� 2"X� �� � ।���� ��� �-��� �- ���। ��� � .� � - ���� �: bgcolor="#FFFFFF" ���� "F" ��� &�#V� "���� �#� �� ���� ("#FFFFFF") &- ��� ���-(� ���। ���� �#3 � �#A��% ����� �� �� �B। � - ���� � /": (15 * 16) + (15) = 255 �"��� &�^� #A#। ���� F �� ��(`n) �� `a d� !� ��� "�#�%� ���� &�� �যগ ���% ��#। knn ��� �য���

����� ����� ���� �S�^ &�#�V।���� ��� �-��� �- ���। �$ ��: bgcolor="#CC7005" CC(RR - Red) (12 * 16) + (12) = 204 70(GG - Green) (7 * 16) + (0) = 112 05(BB - Blue) (0 * 16) + (5) = 5

�������� I; ����� � (HTML Font Tutorial in Bangla)

���� ��: �I��-M& ���

<font> গ # #�� ��� �� # &��� �?�� P��, &�� �#� ��� �যগ �� � । size, color �#� face attributes

# #�� ��� �"�� I; �� �P��� ���% "��।<basefont> গ # #�� ��� �"��� &�� �?�� ��� P��, &��

�#� ��� � �& �� য ।

<font> �#� <basefont> গ # #�� � ��� �&�&�&(�&�&�& ����� �� ����� �� �� �B) # #�� �� ���%। � ,� � (Font size) Size attribute �� &��য I; �� &�� C� �� � । I; �� ��� �� ����যগ �� ��� `(&#��� �B) ��% q(&#���

#c)। I; �� �$I[ ��� ��� l। 1.<p>

2.<font size="5">Here is a size 5 font</font>

3.</p>{}

#$�%�: Here is a size 5 font. � �! (Font color)

��� attribute �� &��য font �� color �& �� � । 1.<font color="#990000">This text is hexcolor #990000</font >

Page 10: Bangla html

2.<br />

3.<font color="red">This text is red</font>

#$�%�: This text is hexcolor #990000

This text is red

� �� (Font face) I; face �� �S�^ &%�� �� ���% ��� �"�� �&�P� � ��@���% I; � ��P� �- � ��� %��� �"�� . I; �

�-��% "�#� � �#� %� "��#�%� �$I[ ��&�# Times New Roman I; � �-��% "�#�। 1.<p>

2.<font face="Bookman Old Style, Book Antiqua, Garamond">Th is paragraph

3.has had its font...</font>

4.</p>

#$�%�: This paragraph has had its font formatted by the font tag! ��� (Basefont) Basefont গ �� &��য �"�� �� # �"��� �$I[ I; �& ���% "���।���� basefont # #�� ��� &C� "� �-��� ��। 01.<html>

02.<body>

03.<basefont size="2" color="green">

04.<p>This paragraph has had its font...</p>

05.<p>This paragraph has had its font...</p>

06.<p>This paragraph has had its font...</p>

07.</basefont>

08.</body>

09.</html>

#$�%�: This paragraph has had its font formatted by the basefont tag! This paragraph has had its font formatted by the basefont tag! This paragraph has had its font formatted by the basefont tag!

�(�3 #��% �� font # basefont # #�� � ��� �&�&�& (�&�&�& ����� �� ����� �� �� �B) # #�� �� ���। Attributes: Review

Attribute= "Value" Description

size= "Num. Value 1-7" Size of your text, 7 is biggest

color= "rgb,name,or hexidecimal" Change font color

face= "name of font" Change the font type

#0� 12��� 34� � ��:

I; �� �P��� ��� �য��� @���� P�� �� য । 1.<p><font size="7" face="Georgia, Arial" color="ma roon">C</font>ustomize

2.your font to achieve a desired look.</p>

#$�%�: Customize your font to achieve a desired look.

�������� ���� ����� �

���� ��� ��� ���+�I��-M& ���

�"�� ���� �"�� &��� ��� �?�� �"� ���� *%�+ ��� �-�% "��� �য��� �J� ���� �� �"�/&� �&�#।

anchor tag �� &��য ���� *%�+ �� � । 6@� �? � �"�� ���� �� ���� ��8�&� �"� ���� �-�% "���,��

Page 11: Bangla html

B�#� �"� ���� �-�% "���,#c ��� �� # �"��� &���"^ *%�+ ��� �� ����!���% ���� �-�% "��� (�&# ����� �J�

���� �"���� . ���( য�# �য�� ���� ����� 62 �� �B)।

�� ���-5 ��� ��6(href)

href ��<�#� ���-(� ��� �য ���� �J� ��� ��� য�#।

Hypertext reference ��% "�� Internal, Local, Global ।

�;���: ��� �"��� ��@ ���� *%�+ ��#।

����: �"�� web site �� ��%�� ��� �"���� &�� ���� *%�+ ��#। �r#�: �"�� web site �� #���� �� web site �� ���� *%�+ ��#। �;���- href="#anchorname"

����- href="/webcoachbd/../pics/picturefile.jpg"

�r#�- href="http://www.tizag.com/" �������� ��!� (��-5) �78 �� 9+�: ����� <a> �#� </a> tag d� য�s�� ���� 62 �#� �(3 �#O । href ��<�#� �� &��য ��� @���� ���� U�"% ��# % ��@���% � । href ��<�#��� opening tag �� ��@ ���% � । opening �#� closing tag �� ��@ ��� ��� ����, % "��

web �"�� ���� ��&�# �-� য�#।�য�� 1.<a href="http://www.webcoachbd.com/" target="_blank" >Webcoachbd Home</a>

2.<a href="http://www.google.com/" target="_blank" >Google Home</a>

3.

4.<a href="http://www.yahoo.com/" target="_blank" >Yahoo Home</a>

#$�%�: �r#� ���� Webcoachbd Home Google Home Yahoo Home �������� ��!� � ��%� (HTML-link Target)

Target ��<�#� d� �#O , � �"� ����% ��# "D�� window �% ��# ���� ����% ��# ��� browser window �% ।

target="_blank" �%� � browser window �% page ��� ।

_self" current window �% page Load �� । _parent"Loads new page into a frame that is superior to where the link lies

_top" &# frames cancel ���, current browser window �%� � page Load

�� ।

�������� ����� ��!� �? ���� �"�� �য��# *%�+ ����� ����� ����� �&��# ���% ��# 6@� href ��<�#��� ��%� ����� $ ��� ��@ ��গ �� # &��� C�� �B� �� �#� ����� C�� �-�#�।�য�� <a href= "mailto:[email protected]" >Email Example</a> #$�%�: Email Example �� ������ �"� ��& ��� য�, ���� P&#�� mailto:[email protected] ��� �-��#।���� �J� ����

�"�� N��� [email protected] ���� ��� ���� C�� ���� "Q��� �S^ �t% ���#।��� &����# #��,@2�

�"�� ���� I �I? N��� # #�� ���B�,�"�� য�- Tools>Options>Applications � �গ� mailto �� � গ

8"$�� ���� ���� Use Yahoo mail �&��u ��� �-� %��� Email Example ����� �J� ���� �"�� � o ���� ����# �#� To �I�v� � গ [email protected] ��� �Q�#। �"�� ���� ����� ����� subject �#� body C� ��� �-�% "��� �য�� <a href= "mailto: [email protected]?subject=Web Page Email&body=This email is from your website" > 2nd Email Example</a> �-(��: 2nd Email Example ���� �J� ���� �"�� � o ���� ����# �#� To �� � গ [email protected] �� Subject �� � গ Web Page Email �

Body �% This email from your site �!�� �গ� ������ #&�#। � �� � ��!�

Page 12: Bangla html

���� ����!���% �J���� �-��� �� �"���� �#��W ���( �� ����!�� ��� য�#।� ��� �;��� ����।�"� #c ���

&���"^ *%�+ ��� ���# ���� �-�% "���। �"��� �"�� য�

�? ����

"�"��� �"�� য�" ���� �J� ���� �"��� ��� য�# % ��গ� C� ��� ���% ��# ���#

<h3>��"��?u ��I��7(href)<a name="top"></a></h3>

"��� ������ ���# ��� ���% ��# (���� name="text")

�(�3 "�"��� �"�� য�" �� �"� ���� �-� �B ���#

<a href="#top">�"��� �"�� য�</a> �#� <a href="#text">�? ����</a>

�������� ����� ����� � (HTML Entities Tutorial in Bangla)

���� ��: �I��-M& ���

���� �� symbol �� �w��� �#3 । ���� symbol �য�� �<$��� , ��"��, *#�-�(� ��j ��%� �% �- �� # �"�

�-(�� ���% ��� ���� �#3� ���% ��#। ��% � ���� �� �%�� ��( ��� �য��: `.��% � Entity ��"��&x (ampersand) �-� 62 � - &

k.%�"� Entity �� �� – copy

l.�(�3 semicolon �যগ ���% � -; ���� �� &copy���^ ���� % *%�+ ��� © - Copyright symbol. 1�+��; �< ��� " ��I গ ��� ���$� গ �� ��@ �-���B N��� 6@� -�� (�:� ��@ ��� �y& ����% "�� �� �#�( "�� �।

��� ���� # #�� ��� ��%��Z �y& �-�% "��। ���� �-��� �- ���। 1.<p>Everything that goes up, must come &nbsp;&nbsp ;&nbsp;&nbsp;down!</p>

#$�%�: Everything that goes up, must come down! ��� �������� � ��& �-� �#� ��� �-� ��G # #�� ��� গ *%�+ ���। �&# ��G �� # �"� � �-��% ����

���� # #�� ���% ��#। 1.<p>

2.Less than - &lt; <br />

3.Greater than - &gt; <br />

4.Body tag - &lt;body&gt;

5.</p>

#$�%�: Less than - < Greater than - > Body tag - <body>

�������� ���; # �z# (HTML Comments Tutorial in Bangla)

���� ��: �I��-M& ���

Page 13: Bangla html

���; �"��� �� # �$���"� ��&�# ��� ��� "� �-��# �য d� �"�� � �� {� ���% "��#� �য ��| ��|

��� N��� d� ���/ �� ��#।

�%�� ���� ��� ��$�� ignore ���। `. �������� $K��; �� ��%�� note ���� # ����� �� reminder ����

k.�/�0� � �!� � �য�� ���/0 �� ��B� ���; # �X# �� ��। .

l.Temporarily comment �� �� য%S� "য�X �������� �����; �&Y��� ���। 1.<!--Note to self: This is my banner image! Don't forget -->

2.<img src="http://www.webcoachbd.com/pics/ferdousSugar.jp g" height="100"

width="200"/>

�� � গ �% ���; ��� opening tag �#� closing tag ��B। <!-- Opening Comment -- > Closing Comment �������� - <!-- �� ��= � ��� �> 0 ��� -->: �� # �$���"� ��&�# �"�� ���� �� �&Y��� ���% "��� �&�S�^ �&Y��� ����� <!— -- > ���; গ �� ��%�

���% "���। 1.<!-- <input type="text"> size="12" /> -- Input Fi eld -->

য�� �������� �����;�� �-(�� ���% �� %�� ���; গ� �C� �-�#�। 1.<input type="text" size="12" />

#$�%�: Input Field:

�������� B�# ����� � (HTML Images Tutorial in Bangla)

���� ��: �I��-M& ���

B�# �� !2}"��� �#3 �� &C� # #�� ���-� ���% ��#। <img/> গ # #�� ��� ��� �� # �"� � ���� ���

�&�% "��। 1.<img src="/sunset.gif" /> #$�%�:

��������-��� src:

Src attribute !2}"��� �#3 । Src �� ��� �&&�(source) ���5 ������ �5& # �য��� picture file � �#�U%।

-�� �"� ��� ������ �&&� ���-�P ���% "��। `. Standard URL # #�� ��� (src=http://www. webcoachbd.com/pics/htmlT/sunset.gif) k. web server � file ��" # �"��$ ��� (src="/../sunset.gif")

�� picture file �� location �� &�� .�������� file �� location �� &Y�� ��B। URL Types: Local Src Location Description

src="/sunset.gif" picture file �#� .html file ��� directory �% �#U� #��।

src="/../sunset.gif" picture file "�#�#�% directory �% �#U� ��� .html file �%।

Page 14: Bangla html

src="/../pics/sunset.gif"pic directory �� picture file "�#�#�% directory �% �#U� ���

.html file �� �%।

��������-alternative attribute:

Alt attribute ���-�P ��� ������� �? ��� 5 য�� ���� �-�(%� � � %�� ������� �?� �-�(%� � । ����

�-�(%� � �� � ��� ��% "�� I��� �_ �� �গ�B # browser ���� I��� ���� "�� �। 1.<img src="http://example.com/brokenlink/sunset.gif" alt="Beautiful Sunset" /> #$�%�:

��������-��� height ��! width:

������ height �#� width C� ��� �� height �#� width attribute # #�� �� � । 1.<img src="/sunset.gif" height="50" width="100"> #$�%�:

��������-Vertically ��! Horizontally align ���:

Align �#� valign attribute # #�� ������ �#U� ��@��� ���% "��। 1. align (Horizontal)

o right o left o center

2. valign (Vertical) o top o bottom o center

���� �-��� �- ��� 1.<p>This is paragraph 1, yes it is...</p> 2.<p> 3.<img src="/sunset.gif" align="right"> 4.The image will appear along the...isn't it? 5.</p> 6.<p>This is the third paragraph that appears...</p > #$�%�: This is paragraph 1, yes it is. I think this paragraph serves as a nice example to show how this image alignment works.

The image will appear along the right hand side of the paragraph. As you can see this is very nice for adding a little eye candy that relates to the specified paragraph. If we were talking about beautiful tropical sunsets, this picture would be perfect. But we aren't talking about that, so it's rather a waste, isn't it? This is the third paragraph that appears below the paragraph with the image! ��������-������ ��!� � �� ��� �:

������ ���� ��&�# # #�� �� য । 1.<a href="http://www.webcoachbd.com/"> 2.<img src="/sunset.gif"> 3.</a> �-(��:

��������- Thumbnails:

Page 15: Bangla html

Thumbnails �� �B &���� ���� য #c, �� ���� ������ &�� ���� ���। �� ���� �@ �� picture quality �S �� য ।Thumbnails �� ��H ���� ���� য ���� ���� ��&�# �� ���। 1.<a href="/sunset.gif"> 2.<img src="/thmb_sunset.gif"> 3.</a>

�������� ��#� ����� � (HTML Tables Tutorial in Bangla)

���� ��: �I��-M& ���

��#� �� Horizontal &�� �#� vertical ����� �#� &। � tabular data �-(���� �S�^ ���� !2}"���। $K���;� �����;

�� {��� �� �� # �$�����-� ��B � ��� �#�( !2}"��� । &�� �#� ����� �;��&�(��� cell #��। &��

�������� ��#� <table> গ �-� 62 � �#� </table> গ �-� �(3 � ।

`.<tr> গ Horizontal &�� ���-(� ���।

k <td> গ . Horizontal &��� data cell ���-(� ���।

l <th> গ data cell �� ��#� heading ��&�# �� ���।

~ <tfoot> গ ��#��� footer �যগ ��� �� # #�� � । 1.<table border="1">

2.<tr><td>Row 1 Cell 1</td><td>Row 1 Cell 2</td></t r>

3.<tr><td>Row 2 Cell 1</td><td>Row 2 Cell 2</td></t r>

4.</table>

#$�%�:

Row 1 Cell 1 Row 1 Cell 2

Row 2 Cell 1 Row 2 Cell 2

1���?�� �� ��! �� ��� ��. �: Rowspan # #�� ��� ����!�� &��� �#A� �#� colspan # #�� ��� ����!�� ����� �#A� �� � । �"�� য�-

����� header �-�% �� %��� <th> গ # #�� ���% ��#। <th> গ # #�� ���� default ��&�# header � �#v

���� �-��#। 01.<table border="1">

02.<tr>

03.<th>Column 1</th>

04.<th>Column 2</th>

05.<th>Column 3</th>

06.</tr>

07.<tr><td rowspan="2">Row 1 Cell 1</td>

08.<td>Row 1 Cell 2</td><td>Row 1 Cell 3</td></tr>

09.<tr><td>Row 2 Cell 2</td><td>Row 2 Cell 3</td></ tr>

10.<tr><td colspan="3">Row 3 Cell 1</td></tr>

11.</table>

#$�%�:

Row 1 Cell 1 Row 1 Cell 2

Row 2 Cell 1 Row 2 Cell 2

Cell padding ��! spacing ���� cellpadding #��% �#O ��#��� #$� � �#� ��#��� ��@ @���D % ��( (���, &�� ) �� ��@ �y& (space) # I� ��( �#� cellspacing #��% �#O ��#��� -�� cell �� ��@ �y&(space) # I� ��( । 01.<table border="1" cellspacing="10"

02.bgcolor="rgb(0,255,0)">

03.<tr>

04.<th>Column 1</th>

Page 16: Bangla html

05.<th>Column 2</th>

06.</tr>

07.<tr><td>Row 1 Cell 1</td><td>Row 1 Cell 2</td></ tr>

08.<tr><td>Row 2 Cell 1</td><td>Row 2 Cell 2</td></ tr>

09.</table>

#$�%�:

Column 1 Column 2

Row 1 Cell 1 Row 1 Cell 2

Row 2 Cell 1 Row 2 Cell 2

1.<table border="1" cellpadding="10" bgcolor="rgb(0,255,0)">

2.<tr>

3.<th>Column 1</th>

4.<th>Column 2</th>

5.</tr>

6.<tr><td>Row 1 Cell 1</td><td>Row 1 Cell 2</td></t r>

7.<tr><td>Row 2 Cell 1</td><td>Row 2 Cell 2</td></t r>

8.</table>

#$�%�:

Column 1 Column 2

Row 1 Cell 1 Row 1 Cell 2

Row 2 Cell 1 Row 2 Cell 2

�������� # ���x �� ����� � (HTML Background Colors Tutorial in Bangla)

���� ��: �I��-M& ���

bgcolor ��<�#� � �#�(3��# �� # �"� �#� ��#��� # ���x �� {� ���। Bgcolor ��<�#� ��� ���� ��������

গ �� ��@ # #�� �� য %�# &#��� �� � <body> �#� <table> গ �� ��@ # #�� ����। ��%��Z ��&�#

# ���x P�� ���% ���� �&�&�& # ���x(CSS ����� �� ����� �� �� �B) �-��% "���। �@�: <tagname bgcolor ="value"> 1.<body bgcolor="Silver">

2.<p>We set the background of this paragraph to be silver. The body tag is

3.where you change the pages background. Now contin ue the lesson to

4.learn more about adding background colors in your HTML!

5.</p>

6.</body>

#$�%�: We set the background of this paragraph to be silver. The body tag is where you change the pages background. Now continue the lesson to learn more about adding background colors in your HTML! ������� �� �� �A � � � � �7 � �� : 01.<table bgcolor="lime" border="1"><tr>

02.<td>A lime colored table background using color names.</td>

03.</tr></table>

04.

05.

06.<table bgcolor="#ff0000" border="1"><tr>

07.<td>A red colored table background using hexadec imal values "#FF0000".</td>

Page 17: Bangla html

08.</tr></table>

09.

10.

11.<table bgcolor="rgb(0, 0, 255)" border="1"><tr>

12.<td>A blue colored table background using RGB va lues "rgb(0, 0, 255)".</td>

13.</tr></table>

#$�%�:

A lime colored table background using color names.

A red colored table background using hexadecimal values "#FF0000".

A blue colored table background using RGB values "rgb(0, 0, 255)".

������� �� ��! �� �� � � � �7 � �� : 1.<table>

2.<tr bgcolor="#FFFF00"><td>This Row is Yellow!</td></tr>

3.<tr bgcolor="#AAAAAA"><td>This Row is Gray!</td></tr>

4.<tr bgcolor="#FFFF00"><td>This Row is Yellow!</td></tr>

5.<tr bgcolor="#AAAAAA"><td>This Row is Gray!</td></tr>

6.<tr bgcolor="#FFFF00"><td>This Row is Yellow!</td></tr>

7.<tr bgcolor="#AAAAAA"><td>This Row is Gray!</td></tr>

8.</table>

#$�%�:

This Row is Yellow!

This Row is Gray!

This Row is Yellow!

This Row is Gray!

This Row is Yellow!

This Row is Gray!

���" �� �� �A color ��! font color: 1.<table bgcolor="#000000">

2.<tr><td bgcolor="#009900">

3.<font color="#FFFF00" align="right">Green Bay</font></td>

4.<td><font color="#FFFFFF">13</font></td></tr>

5.<tr><td bgcolor="#0000FF">

6.<font color="#DDDDDD" align="right">New England</font></td>

7.<td><font color="#FFFFFF">27</font></td></tr>

8.</table>

#$�%�:

Green Bay 13

New England 27

1.<table bgcolor="#777777">

2.<tr><td>

3.<p><font face="Monotype Corsiva, Verdana" size="4" color="#00FF00">

4.This paragraph tag has...

5.</font></p>

6.</td></tr>

7.</table>

#$�%�: This paragraph tag has a gray background with green colored font. You should see Monotype Corsiva font if you have it installed, or Verdana as the backup. Both fonts are widely accepted as standard fonts.

�������� # ���x ����� � (HTML Background Tutorial in Bangla)

���� ��: �I��-M& ���

# ���x ��<�#� �� &��য �������� ��#�� ������ # ���x ���� ��&�# �-��� য ।

Page 18: Bangla html

1.<table height="50" width="100"

2.background="http://www.tizag.com/pics/htmlT/backg round.jpg" >

3.<tr><td>This table has a background image</td></ tr>

4.</table>

#$�%�:

This table has a

background

image

��������-�� �� �A �����:

�"��� �-���� �-� �গ� �B �য ��#� �� ��� B�#� ����� &�� #�� ��� &�& � �� । য�- ��#� �� ��� B�#�

����� ��� #c � %�# # ���x B�# ���" ��#। 1.<table height="200" width="300"

2.background="http://www.tizag.com/pics/htmlT/backg round.jpg" >

3.<tr><td>This table has a background image</td></ tr>

4.</table>

#$�%�:

This table has a background image

��������- �� � �%� �� �� �A �#��W I� ��$�� &�� � �-� �#��W " ���� # ���x B�# ��� <7"��; # ���x B�# *%�+ �� য ।

<7"��; ������ I����� gif I���� ���% ��# jpeg I���� � । 1.<table height="100" width="150"

2.background="http://www.tizag.com/pics/htmlT/patte rn.jpg" >

3.<tr><td>This table has a background patterned im age</td></tr>

4.</table>

#$�%�:

1.<table background="http://www.tizag.com/pics/htmlT/transpa rent.gif" >

2.<tr><td>This table has a red transparent backgrou nd image</td></tr>

3.</table>

#$�%�:

�������� ��� ����� � (HTML Frame)

���� ��: �I��-M& ���

��� �� �@ �� ��� &� ��� N��� ���x �% ���� !�� �������� $K��; �-(�� �� য । ��������-a generic frame page:

����� �#�( # #�� �� ��� ��� � ���� �� ��� ��� � %� ���; ।য�� ��� ���� ����� �J� ��� %�� �&� �� #

�"�� ���; �"�� ����। 1.<html>

2.<head>

3.</head>

4.<frameset cols="30%,*">

5.<frame src="/menu.html">

6.<frame src="/content.html">

7.</frameset>

8.</html>

�-(��:

Page 19: Bangla html

���� �J� �2� frameset – � �� parent tag য ��� page �� characteristics ���-�( ���।"D�� "D�� ��� frameset �� ��@ ���-� �(%

���। frameset cols="#%, *" - Cols(column) য ��� �� width ���-�( ���। �"��� �-���� ��� ���� (1st column) ��#���

����B য total page �� lm% �#� "*", �� ��� total page �� qm% content(2nd column) ���-� �(% � ।

frame src="/" �� # �"� �� ����(� ���� ��$ � । ��� � � � ���� �7 � �� : 1.<html><head></head>

2.<frameset rows="20%,*">

3.<frame src="/title.html">

4.<frameset cols="30%,*">

5.<frame src="/menu.html">

6.<frame src="/content.html">

7.</frameset>

8.</html>

frameset rows="#%, *" -�� ��� frameset cols="#%, *" - �%�। FrameBorder and FrameSpacing: FrameBorder �#� FrameSpacing attribute �� &��য ��� �� Spacing �#� -�� ����� ��@ ugly gray lines ����� �� য । 1.<html><head></head>

2.<frameset border="0" frameborder="0" framespacing="0" rows="20%,*">

3.<frame src="/title.html">

4.<frameset border="0" frameborder="0" framespacing="0" cols="30%,*">

5.<frame src="/menu.html">

6.<frame src="/content.html">

7.</frameset>

8.</html>

�-(��:

���� �J� �2� Noresize and Scrolling: Noresize attribute �� &���_ ����� ��� ��&�� ���% "�� �।

scrolling="(yes/no)"- ��� �� ��%�� scroll ��# # ��# �। 1.<html><head></head>

2.<frameset border="2" frameborder="1" framespacing="2" rows="20%,*">

3.<frame src="/title.html" noresize scrolling="no">

4.<frameset border="4" frameborder="1" framespacing="4" cols="30%,*">

5.<frame src="/menu.html" scrolling="auto" noresize>

6.<frame src="/content.html" scrolling="yes" noresize>

7.</frameset>

8.</html>

1�3� ��� �� �?�� ���� ���= # �� ��� �$=3�।

�������� ���� ����� � (HTML Layout Tutorial in Bangla)

���� ��: �I��-M& ���

�������� ���� �� ��# ��M��� �#3 । ��#��� ��%� ��#� U"� ��� ��������

���� *%�+ �� � । 1.<table bgcolor="black" border="1" heigh="200" width="300">

2.<tr><td>

3.<table bgcolor="white" heigh="100" width="100">

4.<tr><td>Tables inside tables!</td></tr>

Page 20: Bangla html

5.</table>

6.</td></tr></table>

#$�%�: ������� �8+� �����

Tables inside

tables!

�������� � A �% ��,�� Standard layout &@��% �"�� �#�U% # ��, �����গ(� �#� content # �-(�� #?। �!�� ��� �� �� # &� �� *#�(_ । 01.<table cellspacing="1" cellpadding="0" border="0"

02.bgcolor="black" height="250" width="400">

03.<tr height="50"><td colspan="2" bgcolor="white">

04.<table title="Banner" id="banner" border="0">

05.<tr><td>Place a banner here</td></tr>

06.</table>

07.</td></tr>

08.<tr height="200"><td bgcolor="white">

09.<table title="Navigation" border="0">

10.<tr><td>Links!</td></tr>

11.<tr><td>Links!</td></tr>

12.<tr><td>Links!</td></tr>

13.</table>

14.</td><td bgcolor="white">

15.<table title="Content" id="content" border="0">

16.<tr><td>Content goes here</td></tr>

17.</table>

18.</td></tr></table>

�-(��:

���� �-��� 01.<table title="Shell" height="250" width="400"

02.border="0" bgcolor="black" cellspacing="1" cellpadding="0">

03.<tr height="50"><td bgcolor="white">

04.<table title="banner" id="banner">

05.<tr><td>Banner goes here</td></tr>

06.</table>

07.</td></tr>

08.<tr height="25"><td bgcolor="white">

09.<table title="Navigation" id="navigation">

10.<tr><td>Links!</td>

11.<td>Links!</td>

12.<td>Links!</td></tr>

13.</table>

14.</td></tr>

15.<tr><td bgcolor="white">

16.<table title="Content" id="content">

17.<tr><td>Content goes here</td></tr>

18.</table>

19.</td></tr></table>

�-(��: ���� �-���

Page 21: Bangla html

�������� ������ ����� � (HTML Embed Music Tutorial in Bangla)

���� ��: �I��-M& ���

�� # �"� � music �� ��� ���� &��। Embed গ �� &��য music �� ��� � �#� src attribute �� &��য media file

�� ����(� C� �� � । 1.<embed src="/Madine Ko Jain.mp3" />

Embed Attributes – #$�%��� �0 B%��+:

Embeded media player �� #�� � 2" �� �P��� ���% ����� attribute �� �& ���% ��#। `. width - media player �� �&U% k. height - media player �� �V% l. hidden – য�- �� �� &% � %�# media player � �-�(�% ��# �। ��� &�"��( ��# �� attribute� # #�� ���% য�-

�"�� ���� ���� �� # �"� � �� music � ����� #E �� option � ��। 1.<embed src="/last breath.mp3" width="360" height="165" />

Embed Attributes – � 7%#C �: : Embeded media player �� �য��R�+ �� �P��� ���% ����� attribute �� �& ���% ��#।

autostart – �� attribute �� -�� �� false # true । য�- �� true �- � %�# �� # �"� ���� &�� &�� গ� 62 ��#।

loop - �� attribute �� -�� �� false # true। true �& �� ���� গ�� ���" ��# �� false ���� ��# �।

volume - �� attribute d� media file �� volume �& �� � । �� &+� �� m-`mm। 1.<embed src="/beethoven.mid" autostart="false" loop="false"

2.volume="60" />

�������� ���$� ����� � (HTML Video Tutorial in Bangla)

���� ��: �I��-M& ���

Page 22: Bangla html

Music I�� �� �% ���$� I�� �� <embed /> গ �-� �� # �"� � �-(�� �� য । image গ �� �% embed গ �� ��� closing গ �� �� �� ���। src attribute �� �@ �� &C� URL(local # global) C� ��� ���$� �� # �"��

�-(�� �� য । 1.<embed src="http://www.webcoachbd.com/files/html/htmlexamp le.mpeg"

2.autostart="false" />

�-(��:

�"�� href attribute �� �@ ��� &C� URL C� ��� ���$� �� # �"�� �-(�� �� য । 1.<a href="http://www.webcoachbd.com/pics/flash/motiontw een1easy.swf">

2.motiontween1easy.swf</a>

(�� #� �J� ��� play) �������� -�8��D� E��

Flash movies (.swf), AVI's (.avi), and MOV's (.mov)। embed গ �&# I����� &�"� ���। .swf files - �� I���� ��� �(

.wmv files – �� I���� ��� ���e&I ���x� ���$ �"।

.mov files - �� I���� ��� �"� K�� �� ���$

.mpeg files – �� ��� standard I��� য Moving Pictures Expert Group d� compression movie I�� *%�+ �� �B।

�"��� I��� !��� ��@ �;��� �#�( # #�� � swf, mpeg �� I��� !�� । �������� - Embed Attributes:

Src attribute �� �% <embed /> গ �� ��� attribute �� �B �&!�� ��� volume, autostart, hidden, and loop ।

autostart - �� attribute �� -�� �� false # true । য�- �� true �- � %�# �"� ���� &�� &�� ���$� � 62 ��

য�#। hidden - �� attribute �� �@ �� play/stop/pause �� {� ���। embedded object is hidden or not. Values are true or false. (Hide your embeded media if you just want background noise).

loop - �� attribute �� -�� �� false # true। true �& �� ���� ���$� � ���" ��# �� false ���� ��# �।.

playcount - Setting a playcount �& �� ��� ��� media� x number "য�X repeat ��# ��#�% �� � repeat

"��#�%� (playcount="2" �� ��� video � -�� #� ���#).

volume - �� attribute d� media file �� volume set �� � । �� &+� �� m-`mm।

�������� #�$ (HTML Body)

���� ��: �I��-M& ���

Body tag য web page �� &�� element @�� ���। Tables, Lists, Forms, paragraph element !���� Body element ��

��@ ���% � । HTML - Body Margins: Attributes

Leftmargin: body element. �� #� "�(� �����।

topmargin :body element �� �"��� �����। 1.<body topmargin="50">

2.<body leftmargin="50">

#$�%�: Top Margin Left Margin

Page 23: Bangla html

HTML - Base Text: Text attributes �� �@ �� Body tag �� ��%��� &�� �? �� ��� C� �� য । 1.<body text="red" >

# 1.<body text="rgb(255,0,0)" >

�������� �$� ����� � ( HTML Div Tutorial in Bangla)

���� ��: �I��-M& ���

<div> গ �� � গ �� "^ ��&�# �� ��� ���� body গ �� �%।

Div �����; !�� ��� block �����; য� �X��� ���� �� � গ !���� ���^ ���।

�&�&�& �� �S�^ Div �����; ���� !2�"���।

���� �$�� # #p% �%�!�� attributes �- ���। id width height title style

-(���-� strong visualization �� �� �$��� style attribute �� �@ �� ��� �-(�� �� য । 1.<body>

2.<div style="background: green">

3.<h5 >SEARCH LINKS</h5>

4.<a target="_blank" href="http://www.google.com">Google</a>

5.</div>

6.</body>

�-(��:

�$� ��� �-��� �������� ��8 ��,��

��#� ���� ��# ��� Bc� l �[����� ��&�# div �����; # #�� �� য ।

beginning and ending গ �� �@ �� div �����; &�� �������� �����; @�� ���% "��। 01.<div id="menu" align="left" >

02.<a href="/">HOME</a> |

03.<a href="/">CONTACT</a> |

04.<a href="/">ABOUT</a>

05.</div>

06.<div id="content" align="left" bgcolor="white">

07.<h5>Content Articles</h5>

08.<p>This paragraph would be your content paragraph with all of your readable material.</p>

09.</div>

�-(��:

��F������ �$� ���� 01.<div id="menu" align="right" >

02.<a href="/">HOME</a> |

03.<a href="/">CONTACT</a> |

04.<a href="/">ABOUT</a> |

05.<a href="/">LINKS</a>

06.</div>

07.<div id="content" align="right" >

08.<h5>Content Articles</h5>

09.<p>This paragraph would be your content

10.paragraph with all of your readable material.</p >

11.<h5 >Content Article Number Two</h5>

12.<p>Here's another content article right here.</p >

13.</div>

Page 24: Bangla html

�-(��: �$� ����

�������� �#v �#� ���� (HTML Bold & Italic)

���� ��:�I��-M& ���

<b> bold tag # #�� ��� ��� �? �#v ���% "��। 1.<b>This text is entirely BOLD!</b>

#$�%�: Bold: This text is entirely BOLD!

�?�� highlight ���% bold tag # #�� ���% "��।. 1.<p><b>Don't</b> touch that!</p>

#$�%�: Don't touch that!

dictionary fashion.���� �� ��� bold tag # #�� ���% "��। 1.<p><b>Cardio:</b> Latin word meaning of the heart .</p>

#$�%�: Dictionary Cardio: Latin word meaning of the heart. HTML - Italic(s) The italics tag � key word or phrase �� highlight ���% # #�� �� ���%। �� tags �"�� font face �� stylize # ��� ��D �% �-�#� #�� �?�� ��� �-�#। Emphasized tag � � italics tag �� �%। 1.Italic <i>tag</i>!

2.<em>Emphasized</em> Text!

3.Create a <blockquote>blockquote</blockquote>!

4.Format your <address>addresses</address>!

#$�%�: HTML Italics: Italic tag! Emphasized Text! Create a blockquote! Format your addresses! 1.<b>HTML</b>

2.<i>Hyper Text Markup Language</i>

# 1.<b>HTML</b>

2.<em>Hyper Text Markup Language</em>

#$�%�: HTML Dictionary HTML

Hyper Text Markup Language

Page 25: Bangla html

or

HTML

Hyper Text Markup Language

HTML Bold and Italics <b> and the <i> tags �� ��� ��&�� text format �� �� # #�� �� য ।

6@� %�-� e� C� ���� ��� % �-�� ���#�। 1.<p>Phillip M. Rogerson <b><i>MD</i></b></p>

#$�%�: Phillip M. Rogerson MD

<b> and the <i> tags �� ��� �? ����� # #�� ���� # "� �� #�O য । 1.<p>Include several external

2.links throughout your texts as references to your viewers,

3.we will discuss

4.<a href="/" target="_blank" title="Tizag Links">

5.<b><i>HTML Links</i></b>

6.</a>

7.in a later lesson.</p>

#$�%�: Format Links: Include several external links throughout your texts as references to your viewers, we will discuss HTML Links in a

later lesson.

�������� ��$ �#� pre গ (HTML Code & Pre)

���� ��:�I��-M& ���

code tag �� �@ �� �"�� text �� computer code �� �% ��� ����% "���। � &@�� ��# text �� font face, size,

�#� letter spacing "��#%� � ���% "��। 1.This text has been formatted to be computer <code >code</code>!

#$�%�: Computer Code This text has been formatted to be computer code ! Use this tag to separate any computer code you wish to display on your website. It is not always necessary, but the tag exists if you so desire. HTML - Code Links "D�� link ��&�# �"�� web page � �-��% "���। 1.<p>Feel free to search <a href="http://www.google.com" target="_blank">

2.<code>Google</code>

3.</a> for

4.anything you wish to find on the internet.</p>

#$�%�: Code Links: Feel free to search Google for anything you wish to find on the internet. HTML - <pre> Preformatting <pre> tag �� &��#@ �� HTML coding �� &� �য��# ��� ��� �N�, �y& ���-�( ��� �-�# C� �&��# �? �-�(�%

��#।��� 5 �য��# ��$ ����#� �&��#� ��"� �-��#। 1.<pre>

2.Roses are Red,

3. ���� �� � �y& ��BViolets are blue,

4.I may sound crazy,

5. ���� �� � �y& ��BBut I love you!

Page 26: Bangla html

6.</pre>

#$�%�: Roses are Red, Violets are blue, I may sound crazy, But I love you!

�������� &�"��/0,&#�/0,�����

���� ��:�I��-M& ���

1.<p>This text is <sup>superscripted!</sup></p> #$�%�: Superscript: This text is superscripted! HTML – Exponents ���� exponential # #�� �� �� <sup> tag # #�� ���% � । 1.2<sup>3</sup> = 8 2.14<sup>x</sup> #$�%�: Exponents: 23 = 8 14x HTML – �3 ��� �:

�"� & # �#�E �-� য ��� ���� reference �- � �� <sup> tag # #�� � য I� ���� ���-�( ���। 1.<p>"It was a lover's tryst<sup>1</sup>." 2.<hr /> 3.1. Secret meeting between lovers #$�%�: Footnote "It was a lover's tryst1."

1. Secret meeting between lovers HTML -Subscript 1.<p>This text is <sub>subscripted!</sub></p> �-(��: This text is subscripted! 1.<p>H<sub>2</sub>0 - Water 2.<p>O<sub>2</sub> - Oxygen 3.<p>CO<sub>2</sub> - Carbon Dioxide �-(��: H2O - Water O2 - Oxygen CO2 - Carbon Dioxide HTML – Strikethrough <del> tag �� �@ �� ��� ����� e& �-� য । 1.<p>This text is <del>scratched</del> out!</p> #$�%�: Strikethrough This text is scratched out! HTML - Check Off Task: 1.<ol> 2.<li>Clean my room</li> 3.<li><del>Cook Dinner</del></li> 4.<li><del>Wash Dishes</del></li> 5.</ol> #$�%�:

Page 27: Bangla html

1. Clean my room 2. Cook Dinner 3. Wash Dishes

�������� I�� ( HTML Form)

���� ��: �I��-M& ���

�� # &�� � ��% %� (name, email address, credit card, �% �-) ����� �S�^ �� #�P� �� �� I�� !2}"��� tool ��&�#

��। �"�� ���- ���য + I�� -(�� ��% ��"� ��� ���। �"�� ��� ���� �$ &� ���% "��� , order ���% "���,

# #����+� "��&�� � �� ���% "���,�"�� forum � . # �Z��� ������(� ���% "��� �% �- ।

��-� ��F

����# &Y��� I�� *%�+ ���% � �& �"��-� ��গ ���% ��#। Input fields ��� form ��� sandwich �� �গ(% ।

<input> tag �� ��B� attributes ��B �&&# &\�E �� ���% ।

type - �� ��<�#� ��"� �Iv �� �����- ��@��� ���। �য�� text, submit, �#� password ।

name - �� ��<�#� � �-� �Iv �� ����� �� য য�% "�#�%� �% �"�� reference ���% "���।

size - �� ��<�#� � �Iv �� horizontal width �& ��� ।

maxlength – �� ��<�#� � character �� &�#�V �\� ��@��� ��� <form method="post" action="mailto:youremail@email. com"> Name: <input type="text" size="10" maxlength="40" name="name"> < br /> Password: <input type="password" size="10" maxlength="10" name="pass word"> </form> #$�%�: Input Forms

Name:

Password:

��������- ���3� �� �:

Input fields �� ��@ �য&# ����& �X��� Z �&!�� ��� checkboxes, text fields, radios, �#� form submission buttons।

<input /> গ �� ��� closing tag �� �� ���। �������� -Type Attribute:

Type attributes �� &��য �� ����� input tag ���-�( ���% "��।���� �%�!�� input tag �- ���। `. "text"

k. "password" l. "checkbox"

~. "radio"

n. "submit"

a. "reset" �������� – ����-: ���#? ����!�� ���� ���� �� #B� ��� &��#@ �- । ���#? �� name �#� value ��<�#� য ���$� #� ��

name �#� value ��<�#� �% ���� ���। <form method="post" action="mailto:youremail@email. com"> Select your favorite cartoon characters. <input type="checkbox" name="to on" value="Goofy">Goofy <input type="checkbox" name="toon" value="Donald">D onald <input type="checkbox" name="toon" value="Bugs">Bugs Bunny <input type="ch eckbox" name="toon" value="Scoob">Scooby Doo <input type="submit" value ="Email Myself"> </form> #$�%�: ����-:

Page 28: Bangla html

�������� - ���� � ��:

Input type �� ��@ "submit" �"(�� &#�� #� *%�+� �S�^ �����যগ ।specifies a very unique button. য�� ���

submit button � �" �-�# %�� I�� �� #%� � activate ��#। �য��%� ��� &#�� #� *%�+ ����B %� �%� � ��<�#� �� �� % ��� value ��<�#�। ��� �য (:�� value

��<�#� �� �� ��&�# ��#��� ���# % #� �"� �-�(�% ��#। "Submit" or "Continue" (:!�� value ��<�#� �� �� ��&�# # #�� � । . 1.<input type="submit" value="Submit" />

2.<input type="submit" value="Continue Please!" />

�-(��: &#�� #�

�������� - ���� � ��: &#��(3 input type �� ���& #�। ���& #� �J� ��� �@ �� �"�� I�� �� &#��B� �#� "��#�� L��#� �#U ���

�য�% "��#�।"start over" #� �� �"�� ���& #� �� �% # #�� ���% "��#�। 1.<input type="reset" value="Reset Fields" />

2.<input type="reset" value="Start Over" />

#$�%�: ���& #�:

�������� �?u �Iv (HTML Text Field)

���� ��: �I��-M& ���

Text fields �� �B � %�S^ য �"��� ��� �? ��"� ���% �#� �&� %� web server "Q�% &�য ���#। �&#

%� !�� scripting language �য�� (PHP, PERL, or ASP) �� �@ �� ��e � । HTML - Text Field Size: Size attribute �� �@ �� text area �� size �� {� �� য । default size �� &@��% km characters �-g� । 1.<input type="text" size="5" />

2.<input type="text" size="15" />

3.<input type="text" size="25" />

#$�%�: Text Fields:

HTML - Text Field Maxlength: maxlength attribute ���-�P �� Bc # #����+ %� ���% characters ��"� ���% "��# ����� �"�� য�- &�� ���-�P ���� ����। characters ��"� �� &+�#b ���% maxlength attribute � # #�� �� � । size �#� maxlength ��� �� �� ��। 1.<input type="text" size="5" maxlength="5" />

2.<input type="text" size="15" maxlength="15" />

3.<input type="text" size="25" maxlength="25" />

#$�%�: Maxlength Attribute

Page 29: Bangla html

HTML - Text Field Value: value attribute # #�� ��� �"�� ��গ ����� �? �I�v ��B� ���� ���% "��� �য &��� �-��% "��#। 1.<input type="text" size="5" maxlength="5" value="55555" />

2.<input type="text" size="15" maxlength="15" value="Corndog" />

3.<input type="text" size="25" maxlength="25" value="Tizag Tutorials!" />

Text Field Values:

55555

Corndog

�������� �?u ��� (HTML Text Area)

���� ��: �I��-M& ���

�?u ��� �গ �� �% � ���� ���� %� %� �� ���% # #p% � । Paragraphs, essays, or memos &��� � �"_ ���

�?u ��� �% #&�� য �#� &#�� �� য ।�?u ��� �� opening �#� closing গ �� �B। �?u ��� গ ��

��%� ��� ��B� ����� % �� # �"� �� �?u ��� �% �-�(�% � । 1.<textarea>Text Area!</textarea>

�-(�� Text Area!

HTML - Text area Cols and Rows: Adjust the of the text area � size �� appearance �� C� ���% ��� -�� attributes �� �� % ��� cols androws। ��%�

attribute �� �� &�� গ% �� �-�% ���। য% #c �� ��# %% #c text area ��#। 1.<textarea cols="20" rows="10">Text Area!</textarea>

2.<textarea cols="40" rows="2">Text Area!</textarea>

3.<textarea cols="45" rows="5">Text Area!</textarea>

�-(��: Text Area!

Text Area!

Text Area!

HTML - Textarea Wrap: wrap attribute � ��?� �য���" ��@��� ��� য�� textarea � text field � ��� ����% ����% &��� �(�3 ��� ��&। Wrap

Page 30: Bangla html

�� �%� @���� �&�� ��B।�য��: `.soft

k.hard l.off wrap attribute �� Soft ��� word�� text area� ��%�� ���c� �I�� but form &#�� �� � %�� ��c�� word� �-� য � (Line breaks �"(� �যগ � � ) wrap attribute �� Hard ��� word�� text area� ��%�� ���c� �I�� �#� ��� �� �(�3 Line breaks �"(� �যগ �

। %�"� form &#�� ���� �-� য �য��# text box � ��� �B� C� �&��# �-���।

wrap attribute �� Off ��� word�� text area� ��%�� ���c� �I�� � �#� ��� ���� ��#�% ���% ���। 1.<textarea cols="20" rows="5" wrap="hard">

2.As you can see many times word wrapping is often the desired

3.look for your textareas. Since it makes everythin g nice and

4.easy to read.

5.</textarea>

�-(��:Text Area Wrapping: As you can see manyis often the desired lonice and easy to read

1.<textarea cols="20" rows="5" wrap="off">

2.As you can see many times word wrapping is often the desired

3.look for your textareas. Since it makes everythin g nice and

4.easy to read.

5.</textarea>

�-(��: No Wrapping As you can see manyis often the desired lonice and easy to read

HTML - Textarea Readonly: readonly attribute �� value -�� yes # no। readonly attribute �� �� yes ���� �"�� 6@� textarea �� �?�� ��"

���% "��#� ��� "��#%� � ���% "��#� �। 1.<textarea cols="20" rows="5" wrap="hard" readonly="yes">

2.As you can see many times word wrapping is often the desired

3.look for your text areas. Since it makes everythi ng nice and

4.easy to read.

5.</textarea>

�-(��: As you can see manytimes w ord w rapping it makes everything n

HTML – Disabled disabled attribute �� �গ� I�� textarea � ��� highlight � �, @�&� �� @�� ��� �#� �� ����� "��#%� � ���% "��

�। 1.<textarea cols="20" rows="5" wrap="hard" disabled="yes">

2.As you can see many times word wrapping is often the desired

Page 31: Bangla html

3.look for your text areas. Since it makes everythi ng nice and

4.easy to read.

5.</textarea>

�-(��: As you can see manytimes w ord w rapping it makes everything n

�������� ���$� �#%� (HTML Radio button)

���� ��: �I��-M& ���

Radios �� �� ��� ��"� I�� য # #����+�� �য��� ��� �"(� �&��u ���% #��। ���$� �#%� # #� �� ��

C���# �-�% ��#।"multiple choice" �� @���� K�� �#� ���� �� Radios # #�� �� &#��� ��। 1.Italian: <input type="radio" name="food" />

2.Greek: <input type="radio" name="food" />

3.Chinese: <input type="radio" name="food" />

#$�%�: Radios:

Italian:

Greek:

Chinese:

��� I�� � -��� ��W �& ���$�� ��� �-��� �- ��। 1.Italian: <input type="radio" name="food" />

2.Greek: <input type="radio" name="food" />

3.Chinese: <input type="radio" name="food" />

4.

5.Male: <input type="radio" name="gender" />

6.Female: <input type="radio" name="gender" />

#$�%�: Multiple Radios:

Italian:

Greek:

Chinese:

Male:

Female: ��������- Radio Checked:

checked ��<�#�,�� &��য �"�� radio �% �������� �$I[ ��&�# #D�� ��গ ���� ��� �-� ���% "���। 1.Italian: <input type="radio" name="food" checked="yes" />

2.Greek: <input type="radio" name="food" />

3.Chinese: <input type="radio" name="food" />

�-(��:Default Italian:

Italian:

Greek:

Chinese:

�������� �"��$ ( HTML Upload Form)

���� ��: �I��-M& ���

Page 32: Bangla html

upload form # #�� ��� ���� pictures, movies, # ����� ����� webpages upload ���% "��। �� upload form ��

�� @���� input form । �"�� &@����# type attribute �-� �� �� ��&�# file ���� upload form *%�+ ���% "���। 1.<input type="file"/>

#$�%�: Upload Form Max File Size upload I�� �� size �� &+�� �#�@ �-� �"�� �"�� webserver �� ��� #� space �S ���% "���। �� �� ��� hidden input field �#� ��� ��B� specific attributes �যগ ���#। 1.<input type="hidden" name="MAX_FILE_SIZE" value="500" />

2.<input type="file"/>

���� value 100 ��� file &�#�V 100kb ��% "��#। �-(��:

�������� 8"$�� ��P ( HTML Drop down list)

���� ��:���� ��� ���

8"$�� ��P �� �@ �� �"�� ������ �� ��� �� %��� *%�+ ���% "��#� �য�� ���� ���� �য��� �� �&��u ��� �-�% "��#।@2� �"��� �� I�� *%�+ ���% #� �� �#� ���� ������ �� �� �� �& য�% �&��u ���

�-�% "�� (����!�� �� �� ��@ ) ��� ��� �"(� ���% ��#,%�� 8"$�� ���P� �@ �� �& &���� ���% "���। 8"$�� ��P *%�+ ���% ���� <select> গ �-� ��$ 62 ���% ��# ��"� �য ����!�� ���� ���� #B� ���# �&!��� ��%� <option> �গ� ��@ ���% ��#।�য�� 1.<select name="color"> 2.<option value="bl">Black</option> 3.<option value="wh">White</option> 4.<option selected="selected" value="mr">Maroon</option> 5.</select> �-(��:8"$�� ��P �"��� �-���� �-��� selected ��<�#��� ���� ��� �"(� Maroon �-��� �"�� য�- �� White ���� �-�� %��� l

�\� ���� selected ��<�#� # #�� ���#�। ��%� <option> �গ value ��<�#� ��B � ��# !�}"��� য�� I���� �$ &�� �� "Q�#�।value ��<�#��� �� @��

(�য�� bl,mr..) �� ���% � ।

<select> �� ��� size �������

<select> �গ size ��<�#� �-� �"�� C� ��� �-�% "��� �য ���P � � ���� �-��# �য�� �"��� �-����� য�-

size=2 �-� %��� -�� �"(� �-��# #�� /� ��� �-��% ��#। 01.<select name="color" size=2> 02. 03.<option value="bl">Black</option> 04. 05.<option value="wh">White</option> 06. 07.<option selected="selected" value="mr">Maroon</option> 08. 09.</select> �-(��: <select> �গ� size ��<�#�

<select> �� ��� multiple �������

multiple �� �@ �� �"�� ���� ��@� �#3 �&��u ��� &��যগ �-�% "���। 01.<select multiple="yes"> 02. 03.<option value="bl">Black</option>

Page 33: Bangla html

04. 05.<option value="wh">White</option> 06. 07.<option selected="selected" value="mr">Maroon</option> 08. 09.</select> �-(��: <select> �গ� multiple ��<�#�

*q �\� ���� য�- selected ��<�#� �C� �-� %��� ��� �"(� �� �&���u$ �-��#�। �"�� �"(� ��P য�- ���� #c � %��� �" ���% "���।<optgroup> �����; �-� � �� য । �য�� 01.<select name="selInformation" > 02.<optgroup label="Tutorials" > 03.<option value="html"> HTML Tutorial </option> 04.<option value="css"> CSS Tutorials </option> 05.<option value="javascript"> JavaScript </option> 06.</optgroup> 07.<optgroup label="PHP Tutorials" > 08.<option value="basicphp"> Basic PHP </option> 09.<option value="advancedphp"> Advanced PHP </option> 10.</optgroup > 11.<optgroup label="Database Tutorials"> 12.<option value="sql"> SQL Tutorial </option> 13.<option value="phpdatabase"> PHP Database </option> 14.</optgroup> 15.</select> �-(��: