83
1

Html 4.0.1 bangla e book by faruk

Embed Size (px)

Citation preview

Page 1: Html 4.0.1 bangla e book  by faruk

1

Page 2: Html 4.0.1 bangla e book  by faruk

2

��������� �� �-���

(For All Users)

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

(https://www.facebook.com/faruk.ice09)

(http://www.WebTechnologyBlog.com)

Page 3: Html 4.0.1 bangla e book  by faruk

3

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

�������� �������������������� � !�� !�� !�� !� ����

" #$%&� !'!"

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

(&)*��+ ,- ���.�

(https://www.facebook.com/groups/Wordpress2Smashing)

(&)*��+(&)*��+(&)*��+(&)*��+ ,-,-,-,- (�&�+��(�&�+��(�&�+��(�&�+��

(http://www.wpbangla.com)

�/� �/� �/� �/�

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

(https://www.facebook.com/faruk.ice09)

(http://www.WebTechnologyBlog.com)

�0.�0.�0.�0.

1��� %�+� �+1�

(https://www.facebook.com/zamil.hossainsezan32)

23232323����

Extra Network

www.otirikto.net

Page 4: Html 4.0.1 bangla e book  by faruk

4

[+4�*4]

���� ���5� 16 �&

[��-��� © (&)*��+ ,- ���.�-� !�]

Page 5: Html 4.0.1 bangla e book  by faruk

5

��� +7��*-

��� �� ����% ��-���(https://www.facebook.com/faruk.ice09) -8��/ ���9 :�;& �+��< ��=��.>��&� �������� �?) ����@������ ��A��&�� (ICE) ����B� 4C4<& ��D* । ��4��&4 ���/� ���9 �� E4��: 1�� +�� +�� �&� ���4 �����B । E� ���/ ����� ��F��4 G�9�& �/� �; ���। G�9�& ��/�4�

�/���/� #�>+� ��� ��+�9 । ����B �/���/ ���4 । �� ����� ��� #� ��B� ���/�9�� । ���.�

%IJ ��� 1��� %�+� �+1� ���&� (https://www.facebook.com/zamil.hossainsezan32)

+�� -���& %� , (&)*��+ ,- ���& @�� #��� -���K�� �� ����� । ��-E*�& 1��4 -��� ��4 ��+

��� ��� �-��� ����4 %�� । ��� ���� �� ��� �/ ���� �+�+�+ �� ��9 ./�4 -��� । ��-�

�����.� ,�-� �L>�� 1��4 -��� ���������-�� @-�( �-��� ����4 %�� । 1��� ���&� +��

EB�EB ���� @�� ���� ���/ �D ���4 ����� । ��-� @�� ���� E��; @J+% �.�&�9� ( ��&��4 /M1/��

���&�9� E� ���� ��� ���� ���/ �D ���4 -���9 । 1��� %�+� �+1� ���� #��� #��� L6�. +� +��

(&)*��+ $- ���.� (https://www.facebook.com/groups/Wordpress2Smashing/)- �(

#��� #��� L6�. 4�.� �%J ���*� ��� ��1� #�<.� %�4 -�� । �����4 �� ��� ���� N�OP� .C�;�4

./��� �� ���� 1��� +�L��� �; ��� ।

�� ����� +�Q*R ��� । #S$% ��� #S��4 98 �� ����� ���� � +7TU* ��- � ���C4 � ���1� ��� ����& .&� �; ����� � । �-��.� ��1 ��1 V�B� �L>��

���� +�� ��W 9�8�& �.�। �&� ��� +�� +�� । X� ��4��U ��� �, 4� E E 1��� +�� +�� �&� ��� ।

- ����� �� ���

Page 6: Html 4.0.1 bangla e book  by faruk

6

+T+T+T+T��-Y��-Y��-Y��-Y

#L>&#L>&#L>&#L>&-������������ +T��+T��+T��+T��

!.!.��������� �<?

!.�.��������� �< ��1 ��B

!.�.E E ��&1� %��

!.'.(�&� �)1���� 16 HTML-� �� E��;?

#L>&#L>&#L>&#L>&-������������ Z�Z�Z�Z� ��������

�.!.��������� �>�+� [>���

�.�.��������� Z� ���

�.�.��������� Z� ��� ��B E �\G�� ����� 1� .���

�.�.!.�>B (HTML Tag)

�.�.�.��������� �����?� (HTML Element)

�.�. �. ��������� ):��?� (HTML Document)

�.�.'.��]��@�(Attribute)

�.'.)���- �)�������

#L>&#L>&#L>&#L>&-�4���4���4���4�� %) %) %) %) +��� +��� +��� +���

�.!. %) +��� (<head>…</head> �>B)

�.�.����� �>B(<title>…</title>)

�.�. �� �>B(<meta>)

�.�.!. name ��]��@��� �>�%��

�.�.�.HTTP-EQUIV ��]��@��� �>�%��

�.'.��� �>B(<link>)

�.^. �+ �>B(<base>)

Page 7: Html 4.0.1 bangla e book  by faruk

7

�._.`�� �>B(<style>…</style>)

�.a.�bc �>B(<script>…</script>)

#L>&#L>&#L>&#L>&-������������ ��)��)��)��) + + + +������������

'.!.��) +��� (<body>…</body> �>B)

'.�.bgcolor �� �>�%�

'.�.!.���������-� ��&� �>�%�

'.�.background �� �>�%��

'.�.!.(�&�� �>�d4 ���1 �����

'.'.text �� �>�%�

'.^.link �� �>�%�

'._.vlink �� �>�%�

'.a.alink �� �>�%�

'.e. %�) �>B (<h1> ��� </h6>)

'.".->�$� �>B (<p>….</p>)

'.! . f� �>B (<br>)

'.!!.�� f�� 2+(&nbsp) �� �>�%�

'.!�. %&�� 2+ <pre>…….</pre> �>�B� �>�%�

'.!�.�)��1�� �����

'.!'.<acronym> �>�B� �>�%�

'.!^.�S�T��� �/ g4���<hr> �>B

'.!_.Marquee �>�B� �>�%�

'.!a.�h�> EB ��

#L>&#L>&#L>&#L>&- -M��-M��-M��-M�� (�&�(�&�(�&�(�&� -�1 -�1 -�1 -�1 ��?����?����?����?�� �>�%��>�%��>�%��>�%�

Page 8: Html 4.0.1 bangla e book  by faruk

8

^.!.��?�� �>�%�� <font>….</font> �>B�

^.�.��9� �>B �>�%� ��� �i��� `�� -���4*� ��

^.�. 1���� �?� �>����� �>�%��

^.'.����D #N�+T�% (HTML Entities)

^.^.��������� @-.��� jU<���B�

^._. ��` ���& ��9� ���

#L>&#L>&#L>&#L>&-9&�9&�9&�9&� (�&�(�&�(�&�(�&� -�1 -�1 -�1 -�1 ��`��`��`��` g4��g4��g4��g4��

_.!.5��� ��` (Ordered List)

_.�.��#)�(Unordered List)

_.�. ��`) ��`।

#L>&-+4� (�&� -�1 ����1� �>�%�

a.!.<img> �>�B� ��F��4

a.�.+4�*4

#L>&-��� (�&� -�1 ��� g4��

e.!.%�-����� <a>….</a> �>B

e.!.!.href ����3 %�-���ik) )��]��@��� �>�%�

e.!.�.Title ��]��@��� �>�%�

e.!.�.Target ��]��@��� �>�%�

e.�.�?���� ��� g4��

e.�.���1�� ��� �%+�� �>�%�

e.'.��������� ����� ���

e.^.+4�*4

#L>&-�&� (�&�(�&�(�&�(�&� -�1 -�1 -�1 -�1 ���� ���� ���� ���� g4��g4��g4��g4��

Page 9: Html 4.0.1 bangla e book  by faruk

9

".!. ���� g4��� (<table>...</table>)�>B

".�. ����� �>�l4 ��]��@� +T�%

".�.!.align ��]��@��� �>�%�

".�.�.width ��]��@��� �>�%�

".�.�.Border ��]��@��� �>�%�

".�.'.Cellspacing ��]��@��� �>�%�

".�.^.Cellpadding ��]��@��� �>�%�

".�._.bgcolor ��]��@��� �>�%�

".�.a.rowspan ��]��@��� �>�%�

".�.e.colspan ��]��@��� �>�%�

".�.<caption> �>�B� ��]��@� +T�%

".'. ������ �>�$@�?) ����1� �>�%�

".^.��������� �>�$@?) ���-

#L>&-.�� (�&� -�1 ����� �>�%�

! ! ! ! .!!!!.������������ g4��g4��g4��g4�� (<form>...</form>) �>B�>B�>B�>B

! ! ! ! .!!!!.!!!!.Method ��]��@���]��@���]��@���]��@�

! ! ! ! .!!!!.����.Action ��]��@���]��@���]��@���]��@�

! ! ! ! .!!!!.����.Enctype ��]��@���]��@���]��@���]��@�

! .�.��������� ��-�� �>B� ! ! ! ! .����.!!!!. �i� �i� �i� �i� ��m��m��m��m g4��g4��g4��g4��

! ! ! ! .����.����.----+(&)*+(&)*+(&)*+(&)* ��m��m��m��m g4��g4��g4��g4��

! ! ! ! .����.����. ���i ���i ���i ���i g4��g4��g4��g4��

! ! ! ! .����.''''. ��)( ��)( ��)( ��)( ������������ g4��g4��g4��g4��

! ! ! ! .����.^̂̂̂. �i� �i� �i� �i� ���&���&���&���& g4��g4��g4��g4��

Page 10: Html 4.0.1 bangla e book  by faruk

10

! ! ! ! .����.____.������������ g4��g4��g4��g4��

! ! ! ! .����.aaaa.+����+����+����+���� ������������ g4��g4��g4��g4��

! ! ! ! .����.eeee.���1���1���1���1 ������������ g4��g4��g4��g4��

! .�.".���+� ��� g4��

! ! ! ! .����.! ! ! ! .n-)@�n-)@�n-)@�n-)@� ��`��`��`��` g4��g4��g4��g4��

! .�.!!.�-��) ��� g4��

#L>&-�B�� (�&� -�1 o��� �>�%�

!!.!.��������� iframe �>B

#L>&-��� ������������������������������������ ��@� ��@� ��@� ��@�

!�.!.<table> �>B �>�%� ��� ��@� g4��

!�.�.CLASS ( ID ��]��@�

!�.�.��������� <div> �>B

!�.'.<div> �>B �>�%� ��� ��@� g4��

#L>&- 4��

!�.!.��������� 4.01- �� +�� �>B

Page 11: Html 4.0.1 bangla e book  by faruk

11

#L>&-��� +T��

��������� �<?

��������� %� (�&� �)1���� �T����R E �.�& (�&� -1 g4�� �� %&। �-�� E�. ��1� .N (�&� �)1���

� )��-� %�4 �� 4�� �-��� #�p� ��������� ����� 1��4 %��। HTML �� -TU*q- %� Hyper

Text Markup Language 4�� �� �� �$�� �>r��&1 �&। ��������� - � Markup Language ( �� %& , E �4G�� Markup �>�B� +��; �� �� Markup �>�B� �1 %� (�&� -�1 ����s �����?� ����� �.�*�

���� 4 ���.*� ��। E��- ���� (�&� -�1 �i�, ���1, �������,#�)(, ���)( �4>�. �����?� ���4 -�� ;

�� �� �����?�G�� (�&� -�1 �.�*� �� � ����� �.�*� ���� 4 ��L*�U ��� %� ��*�- �>B � ��������� �>�B� �1। E �� (�&� -�1� #@�-�� %� ��������� �)। f@1�� ��� (�&� -1 (�-�

��� �@�+� ��� ��� �t� ��� View Page Source �t� ���� <html>……..</html> �>�B� ��W ��9� �)

./�4 -(& E& E %� ��������� �)।

��������� �< ��1 ��B�

�� ��&,(�&� -1 g4�� �� , -�1� ����s ����?��� � O��6F ��, �)1�� �� �� -�1� �@���� .(& %& ��������� �>�%� ���। ��������� �� �T� �N> ���� ��������� ):��?�((�&� -1) g4�� �� E ����s u���* (f@1��) �1 ���। ��������� � L� %& (�&� -1 ���*�U� ���R�T��।

E E ��&1� %���

��������� �/� 16 ��. �� �i� ��)�� +��(&>� �>�%� � ����( %��, �-�� ��7@���

Notepad ��� E �i� ��)�� ��9 +/��� �) ��/�4 -����। 4�� ��->�)� @s4 +v�U Notepad++ � ��( @s4 ��)�� E/�� �-�� ��� +�� �) ��/�4 ( 4� �@�-�� ./�4 -���� E��- Adobe

Dreamweaver, HTML Kit �>�%� ���4 -���। �-44 ��� �-��.� Notepad++ �>�%� ���4 ���।

��� ��������� �)�� �� ����� 16 E��� ���� f@1� %��� %��। E��� Internet Explorer,

Mozilla Firefox, Google Chrome �4>�.।

(�&� �)1���� 16 HTML-� �� E��;?

�O� 4� ��B 1�� ��� (�&� �)1�� ��; (�&� �)1�� %� ���� (�&� -�1� ��w� �I�� g4�< �� E/��

�� ��u���� ���� � । �/� �x %� ��u���� ��? E�� L�� #>�@?� /� 98 ��� �+��� �>�%� ���4

Page 12: Html 4.0.1 bangla e book  by faruk

12

-�� � � ���.� #>�@�?� y���4 �B�� ���4 %& �G��� %� �� ��� ��u����। ��� �+� ��& ��+

(�&� �)1���� 16 �� ��������� � E��;? ����& �। (�&� �)1���� 16 ��������� -� E��; �।

��������� �>�%� ��� �-�� ZL��Y (�&� -�1 ����s ����?� �.�*� ���4 -����। ��-� CSS(Cascading

Style Sheets) �>�%� ��� (�&� -�1 ����s `�� �>�%� ���4 -����। (�&� �)1���� 16 ���������,

�+�+�+ ( ����- 1���� %��। �� �4��� �>�%� ��� `>��� (�&� +�� g4�� �� E& (`>��� (�&� +�� %�

E/�� �� ��u���� ���� �)। ��z (�&� )��-� %�4 %�� ��( #��� ��9� 1��4 %��।

)���� ��� %�`

+� ���� ��4{�4 ���&

hostghor.com

#L>&-��� Z� �� ��������� �>�+� [>����

��������� �� BI��� ����� �B �� %&। ���� %� %) +��� E <head> �>B �.�& Z� %& �� </head>

�>B �.�& �D %& #6�� %� ��) +��� E <body> �>B �.�& Z� %& �� </body> �>B �.�& �D %&। �� ��

Page 13: Html 4.0.1 bangla e book  by faruk

13

��� +����� <html> ( </html> �>�B� ��W �/�4 %��। ��� ���� ��� ��������� �� �>�+� �I��� .�/ ���-

<html>

<head>

�/�� CSS, Java Script �) �>�%� ���4 -����।

<title>

�/�� (�&� -�1� ������ (title) �>�%� ���4 -����।

</title>

</head>

<body>

���� (�&� -�1� E�4<& ����?� +�T% (Text,Image,Table,Form,Audio,Video �4>�.) �� �>�B� ��L> ��/�4 %��।

</body>

</html>

��������� Z� ����

Notepad++ � ���� �T4� -1 /��� ����� �) G�� ��- ���-

Page 14: Html 4.0.1 bangla e book  by faruk

14

��� File �S�4 �t� ��� Save As…� �t� ���। ����� �4 ���� @��?) (�-� %��-

Page 15: Html 4.0.1 bangla e book  by faruk

15

��� File name:-�� ��i index.html � index.htm �� Save as type:-�� ��i All types(*.*)�+��k ���

save ���� �t� ���। @-��� �.��� Save in #-�� ��� �I� ��� �.�4 -��� ����� ��& +� �����।

��� �/�� ����� )i��- +� ����9। )i��- �B�& ./�� ����� 9��� �4 ���� ��� g4�� %�&�9-

������� E �� ���� f@1� �.�& (�-� ���� ����� �4 �@�-�� ./�4 -����-

�) �) �) �) ���|D�����|D�����|D�����|D�� ��� �/�� <head> ( <body> ��� ��� +��� ./�4 -�0 ,-��4*<�4 ��4� +��� ��

�) ���& ��F��4 ���� ���, 4� ��B ���� �� ��� ��/ %) +���� (�&� -�1� �������� 16 <title >

�>B �>�%� �� %�&�9।�/�� <title> My first web page </title> �>�%��� ��� f@1��� ����� ��� “My

first web page” �/�� ./ E�0। �G�� ���& -����4*�4 ��F��4 ����� �� %�&�9। ��-� ��) +����

(<body>….</body>)-� h1,h2,h3,h4,h5,h6 �� 9&�� �>B }� %�) � ������ �>�%� �� %�&�9। �T�4 ��

���*����� ������ �>�%� �� %& <h1>,<h2,………..<h6> �� 9&�� �>B }�। <p>……</p> �>B }� (�&� -�1

->�$� �/ %&। �/�� ���� L�U �.�� �Y -�� ��F��4 ����� ���।

HTML Z�Z�Z�Z� ������������ ��B��B��B��B E E E E �\G���\G���\G���\G�� �������������������� 1�1�1�1� .����.����.����.����

Page 16: Html 4.0.1 bangla e book  by faruk

16

!. ��������� ):��?� (HTML Document)

�. ��������� �����?�(Element)

�.��������� �>B(Tag)

'.��������� ��]��@�(Attribute)

��D& G�� ���~ ����� �� %��

!!!!.�>B�>B�>B�>B (HTML Tag): �>B %� ���������-�� �U E� �L>�� ��������� �) �/ %&। ��4�� �>B

Z� %& �� (<)��r� f��� �.�& ,��-� ��� �<(&)* �� �D %& )� ��r� (> ) f��� �.�&।�E��� <html>,<head>,<body> %� �� ��� �>B। ��4� �>B ��. ��. #�* �%� ��� #�*J ��4� �>�B� �1

��. �� �� Case Sensitive �& , 4�� Small Letter- � �/ ��। �>B �/� ���� G��-TU* ��&� %� E

�>B �.�& Z� %& +� �>B �.�&� �D ���4 %�� ZL� �D �<(&)* –�� -T��* �� ��B ��� |+ (/) �.�4 %��। E��- �>�+� �I���4 ��� .�/�9 E, %) +��� Z� %�&�9 <head> �>B �.�& �� �D %�&�9 </head> �>B

�.�&।��9� �>B ��&�9 E�.� �D �>B �>�%� � ����( %& , �G�� #-��� �>B । E��� �� ->�$� ��/�4

�D �>B </p> �>�%� � ����( %�� �� #-��� �>B।

����.������������������������������������ �����?������?������?������?� (HTML Element): ��������� �>�B� }�� ��������� �����?� B�I4 ।

��������� �����?� %� ���������-�� ����� E� �L>�� (�&� -�1 ����s �����?� �.�*� �� %& ।����

��������� ):���?�� ���� ����� �����?� ���- html, head, title �� body। �98 ��( #��� �����?�

��&�9।

��������� �����?� �4G�� g���;> ��� ��� 4 ��~q--

• Start Tag/Opening Tag �.�& Z� %&। • End Tag/Closing Tag �.�& �D %&। • Start ( End �>�B� ��W Element Content ���। • ��9� N�R Element Content �( ���4 -��। • ��9� Element-�� End Tag �( ���4 -��।

�>-�� ������ ��W� 16 ���� ����� �� E� E��- �� ->�$� ��/�4 ���� <p> �>B �.�& Z� ���4

%& 4�-� ->�$��� ��D&�� �� +����D </p> �.�& �D ���4 %&। �/�� ->�$��� Z� ( �D �>B

(<p>Element Content</p>)���&� %� ->�$� �����?�। #����� �>B �� ������?�� -�*�>� ��W�4 -�� �, �+�� Z�� ( �D �>B ���Y ����� %� ��������� �����?�।

Page 17: Html 4.0.1 bangla e book  by faruk

17

����. ������������������������������������ ):��?�):��?�):��?�):��?� (HTML Document): ��������� �����?� }� B�I4 (�&� -1�� %�

��������� ):��?� । ��������� ):���?�� �L� ��� #� %� head ( body +���। ��������� ):��?�

������� #�p� something.html/.htm Extension �.�& save ���4 %��।

''''.��]��@���]��@���]��@���]��@�(Attribute): ���� (�&� -�1 ����s �i�, ���1 � ��( ��9� ���4 -�� �� ��.� #��� ,

`�� ����s L��U� %�4 -��। (�&� -�1 �� ������?�� #��� , `�� -���4*���< �4G�� ���.; (&)*�

%� ��]��@��।�� ��W�4 �; %0…? ���� @.%��U� �L>�� ��D&� -���� �� E�- @-��� @.%��U ./��

Q������� %�)G�� -�1� �� �.�� ./�0 ��z ��� E�. �� )��.�� � �W/�� ./�� 4%�� �� ���?

% �� �1� �� E�� ��]��@��� +%�E>।@-��� @.%��U �� “<h1>My First Heading</h1>” ����� ���

����� �����: ��+�& +� ��� f@1� ����) ��� ./�� “My First Heading ” �/� -�1� �W/�� ./�0।

<h1 align=”center”> My First Heading </h1>

�/�� align ��� ���� ��]��@� �>�%� �� %�&�9 E� value %� “center”,E� ��� %�)�� (�&� -�1�

�W/�� ./ E�0। �+�� ��4� ��]��@��� �� � ���L� ��� ���4 -��। ��]��@��� +L�Uq-�� %�-

<HTML Tag Attribute_Name=”Attribute_Value”>………</HTML Tag>

)���-)���-)���-)���- �)��������)��������)��������)�������

������ �� ��� (�&� -�1� Source Code ./�� ��� ./�4 -� E, <html> �>�B� @-�� <!doctype> ��� ������ �>B ��&�9 ।���� �� %& Doctype Declaration । ��������� ��� f@1�� �) %�� )���- +%�1� �?����� ���4 -��। �� 4� )���- .���<। �� �1 %� ):���?�� L�U ���.*� �� #�*J ):��?��� �� �D& ���4, HTML �� �44� �+*�, W3C }� ��&��4 ��� �4>�.? Doctype Declaration �� +L�U �- %��

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>

�/� ��� %) ( ��) +��� ���& ��F��4 ���� ���, 4� ��B ���� �� ��� ��/ +�F

��������� �)�� #�p� <html>…………</html> �>�B� ��W �/�4 %��। ���� Z� �� E�-

Page 18: Html 4.0.1 bangla e book  by faruk

18

#L>&-�4�� %) +���

%) %) %) %) +��� +��� +��� +��� (<head>…</head> �>B�>B�>B�>B):

��� �4N�� 1���9 E ��������� ��� #� ���& B�I4-E� ��� #� %� %) +��� । ��� �� +���� E ��9� ���& ����� ��� 4 #�p� <head>…</head> �� �>�B� ��L> �/�4 %��। <head>……….</head> �>B �.�&

%) +��� B�I4। %) +���� ):��?� +7��*4 4�> ���। E��- ):���?�� �����, ):���?�� ��D&��,

):���?� �>�l4 `���<� � �bc �4>�.। �� +���� E ��9� �/ %& 4 (�&� -�1� ��)�4 ./ E& �; ����� ��� ZL� ./ E& �� EG�� ./ E& � +G�� ++*���) ��� �1 ���। %) +����

(<head>……….</head> �>�B� ��W) ���~� �>B G�� ����

�.����� �>B

/. �� �>B

B.��� �>B

�. �+ �>B

�.`�� �>B

� .�bc �>B

����.�������������������� �>B�>B�>B�>B (<title>…</title>): %) ������?���� ��� �>B %�0 ����� �>B E

<title>……</title> �>B �.�& B�I4। �� �>�B� ��W E ��9� ��/ %& 4 f@1�-�� ����� ��� ./ E&। �T�4

(�&� +���� ��D& ��� +�� +B�4 ��/ ���� +�N� ����� �� �� �>�B� ��W �/ %&। +�* ��A� E�4

�-�� (�&� -1�� +%�1 ���)�i ���4 -�� � 16 E�E� title �� G�R #-��+<� । ���� Valid HTML

Document g4�� ���4 #�p� title �>B �>�%� ���4 %��। E��- �-�� E�. www.youtube.com �� (�&�

+��� E� 4�� f@1��� ����� ��� ./�4 -���� Broadcsst Yourself; �� �1�� ����� �� %�&�9 ./��-

<head>

<title> Broadcsst Yourself</title>

</head>

�������������������� �>�B��>�B��>�B��>�B� N�Y N�Y N�Y N�Y E E E E ������������ �������� +�+�+�+� +�&+�&+�&+�& ������������ �/�/�/�/ .����.����.����.����

Page 19: Html 4.0.1 bangla e book  by faruk

19

►����� �>�B� �\ +/> ' -e ��� ��L> �� ���।

► ����� �>�B� ��W #6 �� �>B �>�%� �� E�� �। E���

<title><p>Paragraph Here</p></title> - �� ���।

////. �� �� �� �� �>B�>B�>B�>B(<meta>): ����� �>�B� -�� �>�%� �� %& <meta> �>B। �� �>B �>�%� �� %&

):��?� +7��*4 4�> +�s��� ��� 16। E��- (�&� -1�� � g4�� ����9 4� -���&, 4� (�&� +���� �I��, 4� #66 ��( 4�>, (�&� +���� ��D&�� �� ��( #��� ��9�। +�* ��A� ���)�i �� 16 � �>�B� G�R

#-��+<�। �� �� �D �>B ��। <meta> �>�B� +L�� �- %��

<meta name=”meta_Name” content=”meta_Content”>

�� �>�B� +�� name, http-equiv ( content ��� �4��� ��]���� �>�%� �� %& । name ( http-equiv

��]��@��� +�� content ��]���� �>�%� �� %& � �� ��]���� �� �� ��L*�U ��� 16।

���~ name ( http-equiv ��]���� ���& ����� �� %��

!!!!.name ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

i.<meta name=”Developer” content=”Abdullah Al -Faruk”>

�/�� name ( content attribute �>�%� ��� developer ( 4� �� .(& %�&�9।

ii.<meta name=”keywords” content=”html,java,css,php,joomla”>

�/�� -�1� �<(&)*G��� �� .(& %�&�9।

iii.<meta name=”Description” content=”This tutorial about web design & developing” >

�/�� (�&� -�1� +�N� �U*� .(& %�&�9।

iv.<meta name=”robots” content=”noindex/nofollow/all/index”>

robots �<(&)* �>�%��� ��� �-�� (�&� -1�� +�* ��A� ���)i ���4 -��� �।

v. �� ):��?��� ���.; +�& #h� -�����) ��� 16 refresh �>�%� �� %&।

<meta name=”refresh” content=”3,http://www.iceschool.com”>

Page 20: Html 4.0.1 bangla e book  by faruk

20

#6 ��� �/ E&�-

<meta http-equiv=” refresh” content=”3,http://www.iceschool.com”>

�� ��� ��4 �4� ����� -� -� (�&� -1�� ����) %��।

����.HTTP-EQUIV ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

�� ���.; +�& -�� (�&� -1�� update ���4 <meta> �>�B� �� attribute �>�%� �� %&।

<meta http-equiv=”expires” content=”sat,30 dec,2011,12.00AM,GMT”>

�� ��� 30 dec-�� -�� f@1� +�*� ��� ):���?�� ���� S4�� ��- +��% ����।

BBBB. ������������ �>B�>B�>B�>B(<link>): ���� ):���?�� +�� ������ ):���?�� +�EB �-� �� %& <link> �>B

�>�%� ���।��( +%1��� �� E& ���� ):���?�� +�� �i���� �� ����� +�EB g4�� �� %& ��� �>B

�>�%� ���। ��� �>B +L�U4 �>�%� �� %& ):���?� �i���� �� `���<� � �bc +�EB ��� 16।

��� �+�+�+ ��� +�& ��� �>B ���& ��F��4 1��। ):���?� ��� �>B�>�%��� ��&��

<head>

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

</head>

����. �+ �+ �+ �+ �>B�>B�>B�>B(<base>): ���� (�&�+���� +�F ����� ���� (�&� -�1 �)�� ��� �%�+�� �>�%���

16 �>�%� �� %& �+ �>B। <base> �>�B� �L>�� �� ):���?�� �+� URL 1���& .(& %&। ):���?��

%�-���� g4��� 16 <base> �>B �>�%� �� O��L1��। E���

<base href=”http://www.iceiuacademy.com/html/”>

�� E�. ���.� iceiuacademy �� %��-1 %& �� �� -�1 ��� E�. Admission Form ��� ������

-�1� ��� �.�4 �� 4�� �� 16 ��. ��� �>�%� � ��� %��-�1� ����� +�� +�+�� ��� �.� �� E&। E���

<head>

<base href="http://www.iceiuacademy.com/admissionform" />

<base target="_blank" />

</head>

��� +���� ��� Base Tag ���& ��F��4 ����� ���।

Page 21: Html 4.0.1 bangla e book  by faruk

21

����.`��`��`��`�� �>B�>B�>B�>B(<style>…</style>): <style> ( </style> �>B �>�%��� �L>�� �� ):���?�

`���<� E�� �� %&। �� ���.� �/� ��1 �B�� �, �+�+�+ ��� +�& �B��। `�� �>�B� +�� type

��� ���� ��]��@� �>�%� �� %& । E���

<head>

<style type="text/css">

body {background-color:yellow}

p {color:blue}

</style>

</head>

����.�bc�bc�bc�bc �>B�>B�>B�>B(<script>…</script>): <script>( </script> �>�B� �L>�� ):���?� client-side

script E�� JavaScript EB �� %&। 1��bc ��� +�& �� �B��, �/� �B�� �।

���� #-�����.� +�, +��*+ , �>��� ��� ��� ��9� ?

www.extratelecombd.com

Page 22: Html 4.0.1 bangla e book  by faruk

22

#L>&-��� ��) +���

��)��)��)��) +��� +��� +��� +��� (<body>…</body> �>B�>B�>B�>B):

��� 1�� ���� ��������� ):���?�� �L� ��� #� %�- %) +��� ( ��) +���। %) +��� ���& -T��* ����� �� %�&�9,�/� ��� ��) +��� ���& ��F��4 ����� ���। 4� ��B ���� �� ��� ��/ ��� ��

+���� E ��9� ���& ����� ��� 4 #�p� <body>…</body> �� �>�B� ��L> �/�4 %��। <body>……</body>

�>B �.�& ��) +��� B�I4। Body Section �� ��� �>B� (<body> ( </body>) #-��� #�*J ��.� �>�%� � ����( %��। ���� (�&� -�1� E�4<& ����?� (Image, Text, Table, Form, Frame, Paragraph, Heading

Etc.) �� +���� ��/�4 %��। <body> �>�B� +�� �� 9&�� ��]��@� �>�%� ��� (�&� -1�� ��D*U<& ���

4� %&।

�.bgcolor

/.background

B.text

�.link

�.vlink

� .alink

����.bgcolor �������� �>�%���>�%���>�%���>�%�� �� ��]��@� �>�%� ��� (�&� -�1� �>�$@�?)� �� -���4*� �� E&।

E��- ����� �)��: ���/ color.html ��� +� ��� �@�-�� ./���

<html>

<head>

<title>Show a Background Color</title>

</head>

<body bgcolor=”red”>

<h1>Background Color is RED</h1>

</body>

Page 23: Html 4.0.1 bangla e book  by faruk

23

</html>

�/�� <body bgcolor=”RED”> �>�%��� ��� �>�$@�?)� �� �� %��। ���� ��D& �N ��� �/�� ��� bgcolor=”red” �>�%��� ��� �>�$@�?)� �� �-(� �� ./�0 , ��z ��� E�. �� ���� %�� �� ./�

4�� ��� �� ���? % ��� +�L� ��9। �� �4��� @-�& (�&� -�1 ��� +� �� E&, � ��D�& ���~

����� �� %�-

������������������������������������-���� ��&���&���&���&� �>�%���>�%���>�%���>�%��

(�&� -�1 ��� +� ��� �4��� -��4 ��9। 5�S+�� ���~ ��.� ����� �� %�।

������������ -��4�-��4�-��4�-��4�

+L�� ��9� ��� E�� ���, +., ��, +��1, �<� ��9। ��������� � ��� �>�%� ��� +�& +�+�� ��.� �� �/ E�4 -��। ���� !_�� ����� ����� �� .(& %��

!_!_!_!_�������� ����� ����� ����� ����� ������������: Black Gray Silver White

Yellow Lime Aqua Fuchsia

Red Green Blue Purple

Maroon Olive Navy Teal

�}4<&�}4<&�}4<&�}4<& -��4�-��4�-��4�-��4�

��� 1�� ����� �� �4��� RED-GREEN-BLUE(RGB)। � �4��� ����� ��&� +���& #66 ��&� +C�;। Red, Green �� Blue �� �4��� ����� +��; %�0 rgb । ��4>��� �� (E/� �� ��� ��� �) %�4 �^^(E/� � ����� +7��* ���)। rgb ������� %� rgb(RED,GREEN,BLUE)। ����� @.%�U �N> ���-

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 24: Html 4.0.1 bangla e book  by faruk

24

�^^ ���� E��� ����� ����� ���� N�Y +��*�।

4C4<&4C4<&4C4<&4C4<& -��4�-��4�-��4�-��4�

��������� -� ��&� 16 9& �)�1��� ���� %i�)�+�� �) ��%� �� %&।�� �)�� B�I4 %& ����� ��&�

5�S+�� �� ��4�� ���� 16 ���� �)�1� ��&�9।�E���”RRGGBB”-�/�� RR=Red;GG=Green;BB=Blue.। �) �/�

+L�U ��&� %�-"#RRGGBB" #�*J ���� ��� w� +�� (#) 4�-� 5���& �� ���� 16 ��� �)�1� +��1 ���� 16

��� �)�1� �� +����D �<� ���� 16 ��� �)�1�। ��� ��� 1�� )�+�� ( %i�)�+�� ��� ��? ��� " -E*h !

�� +/> �>�%� ��� E +/> G�� B�I4 %& 4 %� )�+�� ��� �� ��� " ( A ��� F -E*h !_ �� +/> �>�%� ���

E +/> G�� B�I4 %& 4 %� %i�)�+�� ���।

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

%i�)�+��� 0 1 2 3 4 5 6 7 8 9 A B C D E F

------------------��&� B�� �8�9। ��N�Y %� E �� ���� N�Y +����~ �� �� F %�

+��*� ��।

@.%�U�

bgcolor="#FFFFFF"

bgcolor=”#0055AA”

[��� �� 4C4<& -��4� %� @R�।�-�� ��� �>�%� �����]

�� �)G�� �-��.� ��� �/�4 %�� � ��� +�* ��� #��� ��� ��* -��� +/� ��� �-�� -9�P�

��� �)�� ��+�& �.��� %��। #�� �-�� ��� �-�� +��(&>� �>�%� ���4 -���।

[��� �� ���������-� E/�� E/�� ��� +� ��� .��� %�� ��� +�+�& @-��� �4��� -��4 �>�%�

���। ]

////.background �������� �>�%���>�%���>�%���>�%�� �� ��]��@� �>�%� ��� (�&� -�1� �>�$@�?) ���1 �>�%� ��

%&। ���1 �>�%��� -��4 %�-

<body background=”����1� ��.����1� ���>�” >

<body background=”web.png” > �/�� web %� ����1� �� �� .png %� 4� ���>�।

E �m�� ��������� ):��?��� +� �� %�&�9 +� �m�� #�p� �>�l4 ���1�� ���4 %��।

(�&��(�&��(�&��(�&�� �>�d4�>�d4�>�d4�>�d4 ���1���1���1���1 ������������������������

.gifGraphic Interchange Format (��� �>�l4)

Page 25: Html 4.0.1 bangla e book  by faruk

25

.jpegJoint Photographic Experts Group (�� �i����� %� .jpg )

.png Portable Network Graphic(.gif ( .jpeg �� -��� �� #���)

.BMPWindows Bitmap.

BBBB.text �������� �>�%���>�%���>�%���>�%�� �� ��]��@� �>�%� ��� (�&� -�1� +�� �i��� �� ��L*�U �� %&। E���

<body text=”GREEN”> ,�� ��� <body> ( </body> �>�B� ��L> +�� �i��� �� +��1 ./��।

����.link �������� �>�%���>�%���>�%���>�%�� �� ��]��@� �>�%� ��� (�&� -�1� E�4<& %�-���i� ����� �� ��L*�U

�� %&।�E���<body link=”BLUE”> ,�� ��� (�&� -�1� E�4<& ����� �� �<� ./��।

����.vlink �������� �>�>�>�>�%���%���%���%�� E G�� %�-���i� ��� Already Visit �� %�&�9 4�.� �� ��L*�U �� %&

�� Attribute �>�%� ���। %&।�E���<body vlink=”RED”> ,�� ��� Visited Link �� �� �� ./��।

����.alink �������� �>�%���>�%���>�%���>�%�� �4*��� E ����� @-� �+*� �-� �� %�&�9 4� �� ��L*�U �� %& ��

Attribute �>�%� ���।�E���

<body alink=”GREEN”> �� ��� Link �� �� +��1 ./��।

(�&� -�1 ����� ��� �>�%� �� %& ��� 4 ��� +���� ��F��4 ����� ���।

��) +���� ����s �>B �>�%� ��� (�&� -�1 ����s ����?��� �.�*� ( 4�.� OP� ���

+1�� %&। ���~ ����s �>�B� ��F��4 �U*� .(& %��

%�) %�) %�) %�) �>B�>B�>B�>B (<h1> ��� ��� ��� ��� </h6>):

%�) #�*J ������, �� ��D�&� � -�$��� ������ �>�%� ���4 �� �>B �>�%� �� %&।

<h1>,<h2>,<h3>,<h4>,<h5>,<h6> �� 9&�� �>B �>�%� ��� ������ .(& %&।��.� 5� %�� h1>h2>h3>h4>h5>h6> #�*J

Page 26: Html 4.0.1 bangla e book  by faruk

26

h1 �>�%� ���� �8 ����� �?� ./ E�� 4�-� 5�6�& 9� ./ E��। +L�U4 ������ (�&� -�1� �M -� ��D

���। align ��]��@� �>�%� ��� ��.� #��� -���4*� �� E&।�E���

<html>

<body>

<h1 align=”left”>Left Alignment</h1> �� �)��।

<h2 align=”right”>Right Alignment</h2> %�) (�&� -�1� )��.�� ./��।

<h3 align=”center”>Center Alignment</h3> %�) (�&� -�1� �W/�� ./��।

<h4 align=”justify”>Justify Alignment</h4> %�) #��� �8 %�� (�&� -�1� �� -�� +�-���� 1&B �M� ����।

</body>

</html>

->�$�->�$�->�$�->�$� �>B�>B�>B�>B (<p>….</p>):

->�$� g4�<� 16 <p>......</p> �>B �>�%� �� %&।�� �D �>B #-���।->�$��� #��� �I� ��� 16

align ��]��@� �>�%� �� %&। E���

<p align=”center”>Here a Paragraph</p>

align=”left”[�)�� �%+�� left align ��� �� �>�%� � ����( %��]

align=”right”[(�&� -�1� )� ��1*� ���� ���G�� #��� ����]

align=”center”[ #��� ���,����� )� ( �� �h +�� %�� �]

align=”justify”[ ->�$��� ����� )� ( �� @�& �h +�� %��]

->�$��� E�E���� �`��1 ��� 16 ��( ��9� �>B �>%� �� %& EG�� ���~ ����� �� %��

Page 27: Html 4.0.1 bangla e book  by faruk

27

f� f� f� f� �>B�>B�>B�>B (<br>): ���� ->�$� ��D ������ ->�$� ��/�4 S4�� ��� ->�$� �>B �>�%� � ���

<br> �>B �>�%� �� E&। �� �>B�� ��� f� �>B �� %& , ��U �� �>B �� ��� �M� �� ��/ S4�� ���

g4�� ���। ZL� ->�$��� 1�E � �-�� E �� ��� <br> �>B �.�& ��� f� g4�� ���4 -���। E��-

<p> You can use a web page editor like Microsoft FrontPage, Adobe Dreamweaver or

similar to create web pages. Webpage editor software works like Microsoft Word™ (a

complicated editor program used for creating and editing pages of books, letters etc.)<br>

Second option is to learn html codes and write html pages in a simple text editor. As

mention eerier, your codes will be seen as WebPages when viewed in a web browser.

�� ��� ��� ��. ��. ->�$� -(& E��।

�������� f�� f�� f�� f�� 2+ 2+ 2+ 2+(&nbsp) �������� �>�%���>�%���>�%���>�%��

���������-� ���L� 2+,�>��1 ���� (Enter Key), �>� -����4*4 %�& ZL� ���� 2+ +C�; ���।4� ��

�i��� ��W #�4��� 2+ +C�; ���4 %�� &nbsp �>�%� ���4 %��। E4G� &nbsp �>�%� �� %��,44G�� 2+ +C�; %��।�E���

<p> Java script is an&nbsp&nbsp&nbsp interpreted object oriented promramming.</p>।�/�� �4���

2+ g4�� %��।

%&�� %&�� %&�� %&�� 2+ 2+ 2+ 2+ <pre>…….</pre> �>�B��>�B��>�B��>�B� �>�%���>�%���>�%���>�%��

��� E�. &nbsp �>�%� ���4 � �� 4�� <pre> �>B �>�%� ���4 -��।�� �>�B� ��W 2+,�>��1 ����

(Enter Key), �>� -����4*4 %& � #�*J E4G� 2+ �>�%� �� %& 44G�� 2+ g4�� %&। E���

<pre>Hyper Text Markup

Language</pre>

Output: Hyper Text Markup

Language

Page 28: Html 4.0.1 bangla e book  by faruk

28

�)��1���)��1���)��1���)��1�� ������������������������

�� ��D�& ���� ��F��4 ->�$� ��/�� � ��D�&� ���� ������ .(& E�4 -�� ������ E, � ->�$��� @-� �@+

�+*� �/�� �������� ���� �&4�� ��i ./ E��, E .�/ �@1� +%�1 ��W�4 -�� ->�$� �� ��D&�� �<। � 16

�>�%� �� %& title ��]����। @.%���

<html>

<head>

<title> Use of title attribute in a paragraph tag</title>

</head>

<body>

<p title="HTML is a Markup Language">HTML is an acronym for HyperText Markup Language.

HTML documents, the foundation of all content appearing on the World Wide Web (WWW), consist

of two essential parts: information content and a set of instructions that tells a computer how to

display that content. The computer application.That translates this description is called a Web

browser. </p>

</body>

</html>

�@�-��� ./�� ����� ->�$��� @-� E �� ��� �@+ �+*� �/�� ���� ��i� ��W "HTML is

a Markup Language" �/�� ./�0।

<html>

<head>

<title> Use of title attribute in a paragraph tag</title>

</head>

<body>

<p title="HTML is a Markup Language">HTML is an acronym for HyperText Markup Language.

HTML documents, the foundation of all content appearing on the World Wide Web (WWW), consist

of two essential parts: information content and a set of instructions that tells a computer how to

Page 29: Html 4.0.1 bangla e book  by faruk

29

display that content. The computer application.That translates this description is called a Web

browser. </p>

</body>

</html>

<acronym> �>�B��>�B��>�B��>�B� �>�%���>�%���>�%���>�%��

(�&� -�1 �� ���� ����D ��\� @-� �+*� �/�� � �\ +7��* ���� 4�> �&4�� ��i ./ E&।<acronym> �>B �>�%� ��� �� �1�� �� %&।�E���

<p><acronym title=” HTML is a Markup Language”>HTML</acronym> is the basic markup

language for web page.It is created by Tim Berners Lee.It is controlled by < acronym

title=”World Wide Web Connection”>W3C</ acronym ></p>

�@�-���

�S�T����S�T����S�T����S�T��� �/ �/ �/ �/ g4���g4���g4���g4���<hr> �>B��>B��>B��>B�

(�&��-�1 �S�T��� �/ g4�� ��� 16 <hr> �>B �>�%� �� %&। �� �� �D �>B ��। ���~� ��]��@�G�� �>�%� ��� �� �@���� -���4*� �� E&�

Page 30: Html 4.0.1 bangla e book  by faruk

30

*align: �/� #��� -���4*� ���4�

align=”center”[�)�� �>��]

align=”left”

align=”right”

*color: �/� ��� ��L*�U ���4।

*size: �/� @�4 ��U*& ���4। �� �� �-�i�� %&।

*width: �/� �+F4 ��U*& ���4। �� �� �4�� � �-�i� @�&� %�4 -��।

@.%���

<hr align=”center” size=”10” width=”50” color=”RED”>

Marquee �>�B��>�B��>�B��>�B� �>�%���>�%���>�%���>�%��

��� ����s ��@1 (�&� +��� ./�4 -� E , +��4� +�.G�� -�1� ���.� ��� #6�.�� E& <marquee>

�>B �>�%� ��� �� �1�� �� E&।��N�Y +L��4 %�) � ->�$��� b� ���� %&।�E���

<marquee>�-�� E �/G�� b� ���4 �� 4 �/�� ��/�4 %��</marquee>

marquee �>�B �>�l4 ��]��@�G�� %�-

direction=”left”[ �/G�� )� ��� ��� E��]

direction=”right”[�� ��� )��]

direction=”up”[��� ��� @-�]

direction=”down”[@-� ��� ����]

@.%�U�

<marquee direction=”right” scroll amount=”2”>HTML Is The Basic Of Web

Design</marquee>

�h�> EB ���

Page 31: Html 4.0.1 bangla e book  by faruk

31

��������� �) ���� �8 %�� +/� ��� ��&1�<& �) /��1 �� ���4, -���4*� ���4 � ��W�4 +�� %&।� ���U ��)� ����s #�� �h�> EB �� E&, E�4 /�� +%�1 ��1� �@1� � )��-� +%�1 ��W�4

-��।�� �h�> f@1� � (�&� -�1� @-� �� ��� ��� � #�*J �h��> E �/ %& 4 ��� ++* ��)�

��� �� �@�-�� ./ E& �। �h�> EB ��� ��&� %��

<!--Your Comment Here-->

���� @.%�U ./��-

<html>

<body>

<h1> First Heading</h1> <!--This is first heading-->

<p> HTML documents, the foundation of all content appearing on the World Wide Web (WWW),

consist of two essential parts: information content and a set of instructions that tells a

computer how to display that content. </p> <!--This is a paragraph about html-->

</body>

</html>

)���� ��� %�`

+� ���� ��4{�4 ���&

hostghor.com

Page 32: Html 4.0.1 bangla e book  by faruk

32

#L>&- -M�� (�&� -�1 ��?�� �>�%�

��?����?����?����?�� �>�%���>�%���>�%���>�%�� <font>….</font> �>B��>B��>B��>B�

�?� (�&� -�1� #4>h G��-TU* ���� �����?�। ��C�4 `�� ��. ��?�� E ����Y4 ��+ 4�� ��?�� �-��* �� %&। � +�� �-��*� +�*� ��&B ./ E�� CSS-�। ��?�� -��-TU* ��&h� -(& E�� HTML ( CSS �>�%���

�L>��। �?� +�|; �1 ��� 16 HTML –� <font>…</font> �>B �>�%� �� %&। �� +�� color, face �� size ��]��@� �>�%� ��� �?� `�� -���4*� �� E&। � �4��� @-.�� )������) #�*J �� -����4* CSS

�>�%� �� @R�।

i.Color ��]��]��]��]��@�����@�����@�����@��� �>�%���>�%���>�%���>�%��

��?�� ��� ��L*�U �� %& �� ��]��@��� +%�E>। E���

<font color=”#ff0022”>Some Text Here</font>

ii.Face ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

��?�� �@���� ��L*�U �� %& �� ��]��@��� �L>��। 4�� ��� ��?�� �� @��/ ���4 %�� E� 4 +�

��7@��� ���। E���

<font face=”Arial”> Some Text Here </font>।

�/�� ���L� ��?�� �� @��/ �� E�4 -�� ��z 4�.� ��W �� �>�%� ���4 %��। E���

<font face=”Arial”,”Times New Roman”,”Solaiman Lipi”> Some Text Here </font>।

iii.Size ��]��@��]��@��]��@��]��@������������ �>�%���>�%���>�%���>�%��

��?�� ��� ��� �� %& -�&?� �%+��। �� -�&?� %� !/a� ���� +��। �)�� �%+�� �� �� ��� !�

-�&?�। �� +�� + � - ��� +% ! ��� a -E*h +/> �>�%� ��� ��?�� ��� -���4*� �� E&। ��4 �Y E�B

�?� +�1 �� -�&?� ��� -����4*4 %&।@.%���

!. <font size=+1>Web development</font>[ �� �� !' -�&?� ]

�.<font size=-2>Web development</font> [ �� �� e -�&?� ]

�%+�� ��� %& #����� ��W�4 -��9� �; ���� ����� �� E�-

Page 33: Html 4.0.1 bangla e book  by faruk

33

�)�� �� !�+ (size=�/�� E �.���*�)

! � �� 16 �%+� �� E�- !�+(!*�)= !�+�=!'

� � �� 16 �%+� �� E�- !�+(-�*�)= !�-'=e

Size Attribute ���& ���� @.%�U ���~ .(& %��

<html>

<head>

</title>Font Size</title>

</head>

<body>

<font face=”arial” size=”-2”> Error! Hyperlink reference not valid.>

<font face=”arial” size=”-1” > www.webtechnologyblog.com </font><br>

<font face=”arial” > www.webtechnologyblog.com </font><br>

<font face=”arial” size=”+1” > www.webtechnologyblog.com </font><br>

<font face=”arial” size=”+2”> www.webtechnologyblog.com </font><br>

<font face=”arial” size=”+3” > www.webtechnologyblog.com </font><br>

<font face=”arial” size=”+4” > www.webtechnologyblog.com </font><br>

</body>

</html>

�.�*��

Page 34: Html 4.0.1 bangla e book  by faruk

34

+�G�� ��]��@� �>�%� ��� ���� �) ���� .(& %��

<p>

<font size="5" face="arial" color="red">

This paragraph is in Arial, size 5, and in red text color.

</font>

</p>

<p>

<font size="3" face="verdana" color="blue">

This paragraph is in Arial, size 5, and in red text color.

</font>

</p>

��9���9���9���9� �>B�>B�>B�>B �>�%��>�%��>�%��>�%� ������������ �i��� �i��� �i��� �i��� `��`��`��`�� -���4*�-���4*�-���4*�-���4*� �������� E&।E&।E&।E&। E��� E��� E��� E���

*�������������������� ./�4� ./�4� ./�4� ./�4�

i.<I>Some Text Here</I>

ii.<address>Some Text Here</address>

iii.<cite>Some Text Here</cite>

* �m �m �m �m ./�4� ./�4� ./�4� ./�4�

Page 35: Html 4.0.1 bangla e book  by faruk

35

i.<B> Some Text Here</B>

ii.<EM>Emphasized Text</EM>

iii.<strong> Some Text Here</strong>

*�?)�����?)�����?)�����?)���� ./�4� ./�4� ./�4� ./�4�

<U> Some Text Here</U>

* �m �m �m �m + �������������������� + �?)�����?)�����?)�����?)���� ./�4� ./�4� ./�4� ./�4�

<B><I><U> Some Text Here</U></I></B>

*#66�#66�#66�#66�

1.<blockquote> ..</blockquote> [ @�C�4 ��� ��� 16 ]

2.<Q>…..</Q> [ ������ @�C�4 ��� ��� 16 ]

3.<dfn>Definition</dfn>[ �� )������ .&� 16]

4.<samp>Sample Computer Code Text</samp>

5.<kbd>keyboard</kbd>

6.<var>Variable</var>

7.<code>…….</code>[ Programming code ��W��� 16 ]

8.<sample>Program �� Sample Output</sample>

9.<strike>�W ���� .B</strike>

10.<big>Text Font �8 ./� 16</big>

11.<small> Text Font 9� ./� 16

12.<TT>��-������ �4 ./�4 </TT>

13.<blink>Text �� �� ��� 16</blink>

Page 36: Html 4.0.1 bangla e book  by faruk

36

14.<sub>:H<sub>2</sub>O[Output:H2O]

15.<sup>a<sup>2</sup>+b<sub>2</sub>[Output(a2+b2)]

1���� 1���� 1���� 1���� �?��?��?��?� �>������>������>������>����� �>�%���>�%���>�%���>�%��

����s �?� �>�%� ��� ):��?��� ��D*U<& ��� 4� E&। ��z �� ���� �8 +�� %� �-�� �>�l4 �?���

�@1��� ��7@��� �( ���4 -��। �#��& �@1� �-�� ):��?��� ./�4 -��� �। ��4 ��� (�&� +��

g4��� @��p �>%4 %��। �� +�� +�L��� 16 ��7@��� �>�l4 +�� �?�+�T%�� ��&��� 1���� �?�

�>�����4 �B �� %�&�9। (�&� -�1 �-�� �>�l4 �?��� E�. �@1��� ��7@��� �( ��� �� E�. �-��

1���� �?� �>����� �� @��/ ���� 4�� � �>����� �L> ��� ���� �?� ��9 �(& %��।��� �>����� �?�

./�4 �& �9��9। ��� �/� �?� �>����� +�� -����4 %�। -M��� 1���� �?� �>����� �� %��

I.cursive

Ii.fantasy

Iii.monospace

Iv.sans-serif

v.serif

�������������������� @.%��U@.%��U@.%��U@.%��U +����+����+����+���� �?��?��?��?� �>������>������>������>����� �>�%��>�%��>�%��>�%� ./�� ./�� ./�� ./�� %��%��%��%��

<html>

<head>

<title>Generic Font Families</title>

</head>

<body>

<h3> Generic Font Families</h3>

<p style="font-family:serif; font-size:14pt;">serif family</p>

<p style="font-family:sans-serif; font-size:14pt;">sans-serif family</p>

<p style="font-family:cursive; font-size:14pt;">cursive family</p>

<p style="font-family:fantasy; font-size:14pt;">fantasy family</p>

<p style="font-family:monospace; font-size:14pt;">monospace family</p>

Page 37: Html 4.0.1 bangla e book  by faruk

37

</body>

</html>

�.�*��

����D����D����D����D #N�+T�%#N�+T�%#N�+T�%#N�+T�% (HTML Entities):

��9� #N� ��&�9 EG�� +�+�� HTML ��)� ��W �/ E& �।�E��� (&,””,<>)।��� ��9� #N� ��&�9 EG�� �<��)* �.�& ��/ E& �। E���(∞,µ,α,Ủ,µ �4>�.)। �+� N�Y ��9� �) �>�%� �� %& E�.��� �� %&

Entity Code।��4� #N��� �� L��U� Entity Code ��&�9 -+/>B4 ( �\B4।�E��� µ �� Entity Code %�-

+/>B4 �\B4

&#956 ; &mu;

��9� Entity Code ���~ .(& %��

#N� +/>B4 �� �\B4 ��

“ &#34; #quot;

< &#60; &lt; > &#62; &gt;

& &#38; &amp; ® &#174; &reg;

© &#169; &copy; µ &#956; &mu;

Page 38: Html 4.0.1 bangla e book  by faruk

38

♥ &#9829; &hearts; ♠ &#9824; &spades; ♣ &#9827; &clubs; ♦ &#9830; &diams;

��� +�* ��� �-�� �-�� ��&1�<& Entity Code +$% ��� ���4 -���।

������������������������������������ @-.���@-.���@-.���@-.��� jU<���B� jU<���B� jU<���B� jU<���B�

������������������������������������-�������� +��+��+��+�� @-.�+�T%�� �� ��B �B �� E&।E��

!.V� ����� �� V� ���� ��� �� ��.� ��B -�� ��� f� g4�� %&। E��� ��� ->�$� �>B�� ��� ���� ��/�� 4�.� �@�-�� ��. ��. ���� ./ E��। @.%��U� +%�E> ./�� %�-

<p>First Paragraph </p><p> Second Paragraph</p>

�@�-���

First Paragraph

Second Paragraph

#�*J �� ���1� ���� ��� V� g4�� ����9। ���������-� <p>,<h1> ��� <h6>, <hr> �4>�. %� V� ����

�����?�।

�. �i� ����� �� �� ���� ���4 -��। ��.� ��B -�� ��� f� g4�� %& �। V� ���� �����?� ��.

+�� �����?�� �i� ���� �����?�।

��` ��` ��` ��` ���&���&���&���& ��9���9���9���9� ������������

�� @-.��� ��W #6 @-.� �-� ��� %� ��`। ��` ��4G�� ��&� ��� ���।�E��-

!.��4�� @-.� -��-��� ��`) %�4 %��।�E��-

<p><B>HTML</p> �� ��� ��U <B> �>B �D %& ��।

�. ��`) 5� +�I� %�4 %��। E��-

<p><B>HTML</p></B> �� ��� ��U <B> �>B 5� ��� ��� ��।

�.V� ���� @-.��� #6 V� ���� @-.��� ��W ��`) �� E�4 -��।�E���

<p>html is the basic of <h1>Web Design</h1></p>

Page 39: Html 4.0.1 bangla e book  by faruk

39

4.V� ���� @-.��� �i� ���� @-.��� ��W �` �� E�� �।�E���

<B>Something<p>Paragraph here</p></B> �� ���।

�5��� ���& ���4 +L�U 4�>

www.cricketw.com

#L>&-9&� (�&� -�1 ��` g4�� ���.� g.��P� 1<��� ����s ��1� 16 ��` g4�� ���4 %&। E��- �1� ��`, ���&� ��` , ����� ��` �4>�.। ����s +/> � �4<� �.�& �� ��` g4�� �� %&। �I� 4��� 4�>��<�� (�&� -�1 OP���� @-�-��� 16 ��` �����?� (<li>….</li>) �>�%� �� %&। <li>….</li> �>B �>�%� ��� 4�>��<� ��` g4�� �� %&। �� �D �>B #-���। �4� ����� ��������� ��` ��.>��। <ol> �>B �.�& Z� L���%� � #�)�) ��`(ordered list), <ul> �>B �.�& Z� ��� L���%�4%<� � ��#�)�) ��` �� <dl> �>B �.�& Z� ��� +X�T�� ��`(definition list)। 4�� ordered ( unordered list-� %� HTML-�� �L� ��`। ��� �/�� �� ��� ���&� ����� ���-

1.<ol> - ordered list(Numbered List)

2.<ul> - unordered list(Bulleted List)

Page 40: Html 4.0.1 bangla e book  by faruk

40

����. 5���5���5���5��� ��`��`��`��` (Ordered List):

4�>��<�� �+��&� ��� #S+�� @-�-��� 16 Ordered List �>�%� �� %&। ��� ���� V� ���� @-.�।

Ordered List ��� �� %& <ol>….</ol> �>�B� �L>��। �� +�� type ��]��@� �>�%� ��� ��L*�U �� %&

�+��&� ��� ��� %��। ����� @.%�U�� ./���

�) �) �) �) ���|DU����|DU����|DU����|DU� !. ���� ��L*�U ��� �.�4 %�� E ���`� L�� ��� %�� । ' ��� ���� ��� ��L*�U ��� �.�&�9 E ���.� g4�� ��` %�� 5��� ��` 4� ��� <ol>….</ol> �>B �>�%� ����9।

�. ��-� E �����G��� ��` g4�� ��� 4�.��� <li>…</li> �>�B� ��W �/�4 %��। ��� �@�-�� ./��-

An Ordered List:

• Coffee

• Tea

• Milk

@-��� �@�-�� �N ��� �/�� ��`G�� g4�� %�&�9 !,�,�... 5�S+��, �� �)��। ��z ��� E�. �� ���.� ��`G�� a,b,c….� i,ii,iii….5�S+�� %� 4�� ��� �� ���? % �� ��1� 16 ��&�9 ��( �� ����� L���%� ��`(ordered list) ��&�9। �G�� +L�� !,�,� ����� -����4* ��� ��� � �U* %�4 -�� 4 �8 %�4� � 9� %�4�। type ��]��@� �>�%� � � ��� -���4*� �� %&-

1.<ol type="a"> // a,b,c…�� 5�� ./��।

2.<ol type="A"> //A,B,C... �� 5�� ./��।

3.<ol type="i"> // i,ii,iii... �� 5�� ./��।

4.<ol type="I">// I,II,III... �� 5�� ./��।

�������������������� @.%�U@.%�U@.%�U@.%�U ./��� ./��� ./��� ./���

Page 41: Html 4.0.1 bangla e book  by faruk

41

�������������������� �4�4�4�4 ���������������� ./��� ./��� ./��� ./���

Letters list:

• Apples

• Bananas

Lowercase letters list:

• Apples

• Bananas

Roman numbers list:

• Apples

• Bananas

Lowercase Roman numbers list:

• Apples

• Bananas

Start ��]��@� �.�& ���1� �0SE&< ��� %�4 ��` Z� �� E&। E��-

Page 42: Html 4.0.1 bangla e book  by faruk

42

�.�*��.�*��.�*��.�*�: 4.Buy Food

5.Enroll in College

6.Get a Degree

////.��#)���#)���#)���#)�(Unordered List)

� L���� ���` �� Serial Number ��� � , �� -����4* ����s Symbol �>�%� �� %&। <ul>…<ul> �>B �>�%�

��� Unordered List ��� �� %&। Type Attribute �>�%� ��� ����s Symbol .(& %&।����� @.%�U

./���

�.�*��.�*��.�*��.�*�:

An Unordered List:

• Coffee

• Tea

• Milk

<ul> �>�B� +%�E> ����� ��` g4�< �� %&। ����� ��` ��� �4� ��� E�� !. squares(■) �.disc �.circles(○) । default �%+�� +L��4 full discs �>�%� �� %&। <ul> �>�B� +�� type ��]��@� �>�%� ��� ����s �+�� .(& E�4 -��। E��-

Page 43: Html 4.0.1 bangla e book  by faruk

43

<ul type="square">

<ul> type="dics">

<ul> type="circle">

����� @.%�U�� ./���

�.�*��

Disc bullets list:

• Apples

• Bananas

Circle bullets list:

• Apples

• Bananas

Square bullets list:

• Apples

• Bananas

��`) ��`) ��`) ��`) ��`���`���`���`�

Page 44: Html 4.0.1 bangla e book  by faruk

44

�.�*��

Page 45: Html 4.0.1 bangla e book  by faruk

45

)���� ��� %�`

+� ���� ��4{�4 ���&

hostghor.com

#L>&-+4�+4�+4�+4� (�&�(�&�(�&�(�&� -�1 -�1 -�1 -�1 ����1�����1�����1�����1� �>�%��>�%��>�%��>�%� �& +�� (�&� +���� ��9� � ��9� ���1 �>�%� �� %�& ���। ���1 �>�%�� ( &� -1�� .C�;�P� ( ��D*U<&

%�& (�I। (�&� -1�� OP� ��� +1�4 E�� ����s `����� �?�, ��D*U<& �>�$@?) ��� ��&1� 4���

����1� G��( #���। (�&� -1�� OP� ��� +1�4 ���1 �>�%� �� %&। <img> �>B �>�%� ��� (�&� -�1

���1 +E�� ���4 %&।�� �� �D �>B ��, 4�� �� +�� src ��]��@� �>�%� ��� ���1 ����� 1���& �.�4

%&। E��-

Page 46: Html 4.0.1 bangla e book  by faruk

46

<img src=”����1� �����/����1� ��.()�)����1� ���>�”>

<img src=”image/web.jpg”>

�/�� ��W�� %�0 E Image ��� �m�� � web.jpg ��� ���� ���1 ��&�9।

��z �-�� E �m�� HTML ����� +� ����9� +/��� E�. ���1�� ��/� 4�� ����1� ����� ./�4 %��

�। E��-

<img src=”web.jpg”>

���� ���1 �>�%� � ��� +�+�� �� (�&� +���� ���1 B>��� ��� ���1 ����� 1���& .(& E�4

-��। E���

<img src=”http://www.image.google.com/ html/html5.jpg”>

<img> �>�B ��( ��9� ��]��@� �>�%� �� %& EG�� ���� ����� �� %�-

����.width(((( height ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

(�&� -�1 ���� ���1 �� -���� 1&B ���& �.��*4 %�� 4 ���.*� �� %& <img> �>�B� width ( height ��]��@� ��

�L>��। ��.� �� ��� �� %& �-�i��। width ( height ��]��@� �>�%��� ��� (�&� -1 �4 �) %& ��U

f@1��� S4� ��� ���1 +�1 �� ���4 %& �। width ( height ��]��@� �>�%� ��� 9� ���1�� �8 �� �8

���1�� 9� �� E&। �>�%����L�

<img src=”image/web.jpg “width=”300” height=”200”>

////.Align ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

����1� #��� ���.; ���4 align ��]��@� �>�%� �� %&। E���

<img src=”html.jpg” align=”left”>

�i��� ��W ���1 �>�%� ���4 %�� align ��]��@��� ���~� �>�� G�� �>�%� �� %&�

*align=”top”[ �i��� #��� ����1� @-� �.�� ]

Page 47: Html 4.0.1 bangla e book  by faruk

47

*align=”middle”[ �i��� #��� ����1� �W ���� ]

*align=”bottom”[ �i��� #��� ����1� ����� �.�� ]

.........................................................................................................

*align=”left”[ ����1� #��� (�&� -�1� �� �.�� ]

*align=”right”[ ����1� #��� (�&� -�1� )� �.�� ]

BBBB.Border ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

�)�� �%�+�� ����1� �� �)*� ��� �। ���1 �)*� g4�� ���4 �� ��]��@� �>�%� �� %&। �)*��� ��

�)�� �%�+�� ��� ��� � �� -���4*� �� E& � 4�� � -���4*��� �1�� `���<��� �L>�� �� E&।�� ��

L� %& �-�i��। �>�%����L�

<img src=”faruk.png” border=”4”>

����.hspace (((( vspace ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

->�$��� ��W ���1 ���� �i� ��� ����1� �S�T��� .T�� (@�&-�/�-��)���.*� �� %& hspace �� @�� .T��(@-�� ( ����) ���.*� �� %& vspace ��]��@� �>�%� ���।�E���

<p>Use of hspace and vspace Attribute <img src=”wp.jpg” hspace=”20” vspace=”10”></p>

����.Alt ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

�� ���U f@1� E�. ���1 �.�*�� �>�* %& � �@1� ���1 �� ��� ��/ � L<�� -1 �) %�� ���U E�.

���1 �) � %& 4�� ����1� ��� ���� ��B � �i � ���� ./ E&,E� @-� �+*� �/�� ���1

+7��* ������-� �L> ���� 4�> -(& E& � +�+�� �i� ./ E&। alt ��]��@� �>�%� ��� �� �1�� �� %&।�E���

<img src=”joomla.jpg” alt=”joomla admin panel picture”>

<img src=”photo.jpg” alt=”my photo with my friends”>

Page 48: Html 4.0.1 bangla e book  by faruk

48

����1� ��� E�. alt ��]��@� -� �>�l4 �i��� ./& �� +� E�4 �T� �i��� +�� ���� � E& + ���U

�i����� ���<� �L> �/ E�4 -��।�E���

<img src=”joomla.jpg” alt=”[joomla admin panel picture]”>

�� ��� E�. �� �i��� ����s �i� `��� �- �.�4 �� 4�� <img> �>B�� � �>�B� ��W ��`) ���4 %��।

E���

<I><img src=”joomla.jpg” alt=”joomla admin panel picture”></I>

<img> �>�B� +�� title ��]��@� -�� �L>�� �)��1�� ����� �>�%� �� E&। �� ��� �@+(���� +�&

Alt �i��� -����4* title ��]��@��� �i� ./��। E���

<p><img src=”mmm.png” title=”HTML A Markup Language”>HTML is an acronym for

HyperText Markup Language. HTML documents, the foundation of all content appearing on the

World Wide Web (WWW), consist of two essential parts: information content and a set of

instructions that tells a computer how to display that content. The computer application.That

translates this description is called a Web browser. </p>

�@�-����@�-����@�-����@�-���

Page 49: Html 4.0.1 bangla e book  by faruk

49

+4�*4�+4�*4�+4�*4�+4�*4�

!.(�&� -�1 �Y�4� ���1 �>�%� ����� �।

�.#��� �8 +��1� ���1 �>�%� ����� �।

�. Width ( height ��]��@��� �L>�� ���1 +�1 ���.; ��� ��&

���.; +��1� ���1 �-��) ���।

'.alt ��]��@� �>�%� ���।

^.(�&�� ���1 �-��) ���� 4� �&���� ��9�� /�- %�& E&

4� ��� /�- ���� ���1 �-��) ����� �।

_.��� -�1 ��+�� #���G�� ���1 �>�%� ����� �।

#L>&-������������ (�&�(�&�(�&�(�&� -�1 -�1 -�1 -�1 ������������ g4��g4��g4��g4�� %�-�����%�-�����%�-�����%�-����� <a>….</a> �>B��>B��>B��>B�

��� %� (�&� +���� #64� G��-TU* ���� ��D&। ���������-�� �L>�� ��� ���� ��� (�&� -1 g4�� ��� ��z +G�� ��Y �� %& ��� �>�B� +%�E>; �98( ���� (�&� +���� +�� #6 ������ (�&� +���� +�EB �� %& ��� �>�B� �L>��।(�&� -�1� �� ���� �t� ��� #6 E �� -�1 E(& E&। #>�� �>B (<a>…</a> �>B) �� +%�E> ��� g4�< �� %&। ZL� �i� �& �-�� ���� ��� ��� ��n�+� @-� ��� �.�4 -���,��� 9��� @-� ��� �.�4 -���,�8 �� (�&� -�1� O��-Y g4�< ��� �� �����G���4 ��� �.�4 -��� �4>�.।��� �>�B� +�� href, title, ( target ��]��@� �>�%� �� %&। ��� �>�B� +L�U q-�� %�-

<a href=” E -1�� +�EB ���4 �� 4� �I��” target="���� �t� ���� S4� -1�� �4*�� -�1� �) %�� ��� S4� @��?)�4 /���� 4 �I� ��� �.�4 %��" title=”����� @-� �@+ ���& B�� Bh�> (�&� -1 +7��* ��B� L�� �.�” > f@1�� E ./�4 ��, E� @-� �t� ���� Bh�> -�1 E(& E�� </a> ।���� @.%�U ./��-

<a href="http://www.google.com/" target="_blank" title=”Search Engine”>Google Home</a>

�� ��� ��� ):���?� Google Home �/�� ./�4 -�, E�4 �t� ���� www.google.com (�&� +��� E(& E��।

��� �>�B� +�� �>�l4 ��]��@�G�� ���~ ��F��4 ����� �� %��

����.href( %�%�%�%�-���ik-���ik-���ik-���ik ����3 ����3 ����3 ����3 ) ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%�� ��B*� -�1� ����� (URL) ��L*�U �� %& �� ��]��@��� �L>��। E���

Page 50: Html 4.0.1 bangla e book  by faruk

50

<a href=”http://www.facebook.com ” target=”_self” >Facebook</a>

f@1�� ZL� Facebook ./ E��,E� @-� �t� ���� www.facebook.com (�&�� ���� �� E��।

Hypertext reference %�4 -�� Internal, Local, Global ।

!.�?����( Internal): ��� -�1� ��L> ��� g4�< ���4 �?���� %�-���i� �����+ �>�%� �� %&। � ��D�& ���~ ��F��4 ����� �� %�&�9।

�. ���( Local): ��� 1�� ���������-�� �L>�� ZL� ���� ��� (�&� -1 g4�� �� E&। �� ���� #���G�� -1 g4�� ��� ����� +�� #6�� +E�� ��� ���� +7TU* (�&� +�� g4�� �� %&। �� �� �1�� #�*J (�&� +���� ����s -�1� +�� �h+�EB B�8 4� %& ��� %�-���i� �����3� �L>��। E��-�-�� �-�� (�&� +���� %� -�1� 16 index.html, About Us -�1� 16 about.html; Blog -�1� 16 blog.html; Tutorial -�1� 16 tutorial.html �4>�. ��� ����s -1 g4�� �����। �/� �-�� ����� %� -�1� +�� #66 -�1�� +E�� �����; �� �1�� ��� 16 index.html ���� ����� �4 ��) ��/��-

<a href="about.html” target="_blank"> About Us </a>

<a href=" blog.html” target="_blank"> Blog </a>

<a href=" tutorial.html” target="_blank"> Tutorial </a>

[��� �� +�� ��������� ����� �/�� ��� �m�� �/ %�&�9 ��� L�� �(& %�&�9। ��. ��. �m�� �/�� +�N�Y �)������ @��/ ��� �.�4 %��]

�.  ��( Global): �� -��4�4 ���� (�&� +���� +�� #6��� (�&� +���� +�EB �� %&। E��- �-�� E�. �-�� (�&� +��� �+����� ��� �.�4 �� 4�� index.html ���� ����� �4 ��) ��/��-

<a href=”http://www.facebook.com ” target=”_self” >Facebook</a>

////.Title ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

%�-������ +�� title ��]��@� �>�%� ��� �@1��� 4� Bh�> -1 +7��* ��B� L�U .(& E�4 -��

���� �����- ��+�1� �L>��। E���

<a href=”http://www.WebTechnologyBlog.com” title=“���1�� B�8 4���� �E���� +��......”> < a>

�/� ����� @-� �@+(�� ���� “���1�� B�8 4���� �E���� +��......” �� �/�� �����- �%�+�� ./ E��।

���� �)��1�� �����( �� %&।

BBBB.Target ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

Page 51: Html 4.0.1 bangla e book  by faruk

51

���� �t� ���� �4�� -�1�� �4*�� -�1 Open %�� ��� �4�� Window 4 Open %�� 4 ��L*�U �� %&

target ��]��@��� �L>��। target ��]��@� +L�U4 o�E�� (�&� -�1 �>�l4 %& , 4�� +L�U (�&� -�1(

�� �>�%� �� E&।��� ��]��@� �>��%� � ���� �4*�� -�1� ��B*� -�1�� (�-� %��।@.%�U�

<a href=”http://www.facebook.com “ target=”_blank”>Facebook</a>

�� ��� �4�� Window 4 Open %��

<a href=”http://www.facebook.com “ target=”_self”>Facebook</a>

�� ��� �4*�� -�1 Open %��।

�?�����?�����?�����?���� ������������ g4���g4���g4���g4��� �?���� ����� �L>�� �� �\G0 ��� -�1� #6 �� #� ��� #6 �� -�1� ���.` �� #��� +�� +�EB B�8 4��। ���� ��B ��� 1�� �+�� E ����� ���� (�&� +���� ����s -�1� +�� ��� g4�� �� %&। ��� ��� 1�� ����� ���� -�1� ��4� ����s #��� +�� ��� g4�� �� E&। ���� (�&� -1 E/� #��� �8 %& 4/� �� �1�� �� %&। E��-@����-�)&�4 (http://en.wikipedia.org) �-�� E�. “HTML” ���/ +�* ���� 4�� ���� #��� �8 ):��?� ./�4 -����। � -�1� ����� �.�� ����� �4 ���� �i ./�4 -���। � -�1� E�4<& ����?�G��� %�) ��i� ��W ./�4 -����। �/� �-�� E %�)-�� @-� �t� ����� � ����?� -�1� E/�� ��9 4 �-�� +��� .Cp�� %��। E�. � ����?� -�1� ��.� ���� ��� 4�� 4 ������� ���1�� ���&�4 ��� �+��। �O� .�/ �� �1� ����� �� E&-

Page 52: Html 4.0.1 bangla e book  by faruk

52

���� ):���?�� �� #���( %�)��) �����*/����4 ��� 16 <a> �>�B� name ��]��@� �>�%� �� %&। ��-� href ��]��@��� �L>�� ��� E/�� � �����*�� �� ���4 �� ( E��-@-��� � �i) +/�� �� ���4 %��।

���� @.%�U ./���

�) ���|DU� !. �-�� ���� a,",!!,!�,!_,!e,� � ���� �8 ->�$� ��/��।

�. !" � ���� �N> ��� ��� ���� name="C7" �.�& Chapter 7 � ����4 ��� ��/�9। Chapter 7 +�� ���� ��� ���U ��� ������� ���1�� ���&�4 Chapter 7 � ./�4 -�� �; ���.� �@+ b� ��� ./�4 %��। ��� ��� �� Chapter 7 �� ��� ��� -�1� @-��� �.�� �/�4 E�4 ��� (/�� �t� ���� ��� Chapter 7 � ������� ���1�� ���&�4 ./�4 -�। �� �1�� ��� 16-

�. !" � ���� ��� Chapter 7 � E ��� ����4 ��� ��/�9�� ' � ���� href��]��@� �>�%� ��� 4�� �� �� %�&�9। ���� �� ��� �/ /�� .��� E �� ��� E �� ����?��� E �� ��� �� ���4 -���।

���1�����1�����1�����1�� ������������ �%+���%+���%+���%+�� �>�%���>�%���>�%���>�%��

Page 53: Html 4.0.1 bangla e book  by faruk

53

��� #��� (�&� +��� .�/ E �� ��� ����1� @-� �@+ �+*� ���& B�� �+*� ��C�4 -���4*� %�& E& E ���� ����� ���.*� ���। �� �1�� ���4 ��� �>�B�(<a> ( </a>) ��W <img> �>B�� ��`) ���4 %&।���1��

��� �%+�� �>�%� ��� ��&� %��

<html>

<body>

<a href="http://www.WebTechnolohyBlog.com">

<img src="smiley.gif" alt="Web Design tutorial" width="32" height="32" />

</a>

</body>

</html>

��N�Y ���� �� ����D��� ��� �/ .��� E, �/�� #�p� alt �>�%� ���4 %�� ��U �@1� E�. ���1 ��

��� ��/ 4�� alt �� �i���� ��� �%�+�� ./��।

������������������������������������ �������������������� ������������ �i� ��� ��� E��� g4�< ���� ����� ���( +��� ���4 %�� ZL� href ��¡��@��� ��4� �����*) ��� ��L> ��B E (�&� +���� �I�� �9� 4� ��� ��� ����� �I�� �.��� %��।�E���

<a href= "mailto:[email protected]" >Email Example</a>

�/�� mailto: %� ����� N�Y ���� �����।

�.�*��.�*��.�*��.�*�:

Email Example �� ����� @-� �@+ ���& E�, ���� `�+��� mailto:[email protected] �/ ./��।�/�� �t� ���� �-�� f@1� [email protected] ��� �I��& ���� ��� -�I�& �.��।

�-�� ���� �-�� ����� ���� #�4��� ��� ��D& EB ���4 -��� E� %�0-!.subject �� �.body

!.subject ������� subject-� �-�� �-�� ����� ������ ���/ �.�4 -���। subject �� -����4* title ��]��@� �>�%� �� E�4 -��।

�.body body- 4 ����� ��D&�� ���/ �.�4 -���।

@.%�U�

<a href= "mailto: [email protected]?subject=Web Page Email&body=This email is from your website" > 2nd Email Example</a>

�.�*�:

2nd Email Example

Page 54: Html 4.0.1 bangla e book  by faruk

54

�/�� �t� ���� �-�� �&� ��� /���� �� To �� 1&B& [email protected] �� Subject �� 1&B& Web Page Email ( Body 4 This email from your site �G�� �B�& #������� �+��।

**�-�� E�. �� �@ �-�� +��� ��� ���� 4�� �- ��� ����� �L>�� � ���4 -���। E��-

<a href=”mailto: [email protected]?subject=Feedback&body=Good Job”> % [email protected] </a>

��� �>�%���<� O��L��* ���� +�+�� ��� ��n+ .(& E�4 -��।

<a href=”mailto: [email protected]?subject=Feedback”> [email protected]</a>

+4�*4� !.��� g4��� -� E�� ��� ./�� 4 �I���4 �1 ���9 ���?

�.����� .�/ ��� +�I� ��� �.�&�9� ���?

�.)@���) ��� �.�� .�/ ��� -� �I� ��9 ���?

'.�-�� +�� %` ��� -� ���( .�/ ��� +�� ��� ( ��� �)��k�� �I� ��9 ���?

�+���� �+���� �+���� �+���� ��X-���X-���X-���X-� �.�4�.�4�.�4�.�4 �������� ?

�������� ������������ !_!^�'�^!_ !_!^�'�^!_ !_!^�'�^!_ !_!^�'�^!_ ����

Page 55: Html 4.0.1 bangla e book  by faruk

55

#L>&-�&� (�&�(�&�(�&�(�&� -�1 -�1 -�1 -�1 ���� ���� ���� ���� g4��g4��g4��g4�� ���� ���� ���� ���� g4���g4���g4���g4���<table>….</table> �>B��>B��>B��>B�

����s ��1� 16 (�&� -�1 4�> @-�-��� 16 ������ G�R #-��+<�। �98 -��� (�&� -1�� ��&��� ��B

�B ��� ����s #�� �i�, ���1 �4>�. �-� ��� ���� OP� (�&� -1 g4�� �� E&। <table>….</table>

�>B �>�%� ��� (�&� -�1 ���� g4�� �� %&। ���� �>�B� ��W ��( ��9� �>B ��� EG�� ���� g4��� 16

#�p� ��&1�। �>BG�� ��~�-�

�.<tr>….</tr> [ �� �>B }� row � +�� g4�� �� %& ]

/.<td>….</td>[ �� �>B }� +���4 )� ��-�� �� %& ]

B.<th>….</th>[ �� �>B }� +��� %�) .(& %& ]

[ ��� �� +�G�� �>�B� �D �>B Optional। ]

���� Z� ���, ���� ��� ����� 9��� �4 ���� ���� g4�� ����

@-��� �������4 �N> ���- �/�� ��� �/+�� �� �4��� ��� ��&�9। ��( �N> ���-��4� ����� ����

��� %�) ��&�9। ���� g4�� ��� +�& ���� �/+�� g4�� ��� ���4 %& ; ��-� ��4� �/ +���4 E4G�� )� �/ %& 44G�� ��� g4�� %&। ��D&� ����� ��W� 16 ���~ L�- L�- ����� �� %�-

@-��� ���Y E ������ ./�� %�&�9 4� ��� +���� ��� g4�� ���-

<tr> <!—�� ��� ���� +�� g4�� % � -->

<th>Name</th> <!— ������ ��4� ����� %)� .(& %�&�9-->

<th>Roll No.</th>

<th>Age</th>

</tr>

[��� �� �N> ��� ��4� <th>…</th> �>B +���� ���� �B ��� �.�&�9]

Page 56: Html 4.0.1 bangla e book  by faruk

56

��� ��� �}4<& +���� g4�� ���-

<tr> <!—�� ��� ���� +�� g4�� %�� -->

<td>Faruk</td> <!— ������ ��4� +�� )� ��-�� �� %�&�9-->

<td>0818002</td>

<td>22</td>

</tr>

��� +�� �)�� <table>...</table> �>�B� ��W �/�4 %��। +7TU* �) ���~ .(& %�-

f@1�� ����� �4 ./ E���

����� ����� ����� ����� �>�l4�>�l4�>�l4�>�l4 ��]��@���]��@���]��@���]��@� +T�%�+T�%�+T�%�+T�%�

Page 57: Html 4.0.1 bangla e book  by faruk

57

������ ��D*U<& ��� 16 �>�l4 ��]��@�G�� %�- align, width, border, cellspacing, cellpadding �� bgcolor।���~ �G�� ����� �� %��

align ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

Q������� ���� ���� (�&� -�1� ���.�� #��� ���, �-�� ���� align ��]��@� �>�%� ��� �� #��� -���4*�

���4 -���।�E���

<table align=”left”> [�� �)��]

<table align=”right”>[ ���� (�&� -�1� )��.�� ����]

<table align=”center”>[ ���� (�&� -�1� ��� ����]

width ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

������ ��F4 ��U*& �� %& width ��]��@�� �L>��। �� ��� �� ��]��@� �>�%� �� E&-

!.<table width=”60%”>[ ��N�Y ������ ��F4 %�� f@1��� _ %]

��N�Y f@1� 9� ���� ����( 9� %��।

�. <table width=”100”>[ ��N�Y ������ ��F4 %�� ! �-�i� ]

� � �>�%� �� @R�। ��N�Y ������ ��� +�+�& �I� ����।

[��� �� width ��]��@� �>�%� � ���� f@1� ���1� �4 ��� ���� �.�*� ���� #�*J ����� E -���� )� ���� + -���� 1&B 1��8 ���� �.��*4 %��]

Border ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

�)�� �%�+�� ������ ���.�� �� �)*� ��� �। �)*� .(& %& border ��]��@�� �L>��। ��z

+���( ������ ��4� ��) �)*� .(& E& �।@-��� @.%��U �N> ��� ��� <table border=”1”> �.�&�9 ; E�

��� ������ ���.�� ���� �)*� ./�0।

Cellspacing ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

Cellspacing ��]��@� �>�%� ��� +� +T��%� ��L> �M� �� ��L*�U �� %&। cellspacing ���4 �W& ������ ��� cell �� ��L> 2+(space) � �� #�।�)�� �%+�� cellspacing ��]��@��� �� � ���।�� �� %& �-�i��। E��� <table cellspacing=”3”>

���� @.%�U ./���

Page 58: Html 4.0.1 bangla e book  by faruk

58

�.�*��

Cellpadding ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

+� �)*� ��� +� ��?��?�� .T�� ���.*� ���4 �� ��]��@� �>�%� �� %&।�)�� �%+�� �� �� ! �-�i� ��� #�*J +�

�)*� ��� +� ��?��?�� .T�� ! �-�i�।�� �� �-�i�� %&।�E��� <table cellpading=”2”>

���� @.%�U ./���

�.�*��

Page 59: Html 4.0.1 bangla e book  by faruk

59

bgcolor ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

�� ��]��@��� �L>�� ������ �>�$@�?) ��� �>�%� �� E&। E���

<table bgcolor=”red”> �� ��� �>�$@?) ��� �� ./��।

rowspan ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

���L� +��� +�G���� ���� +�� -���4 ��� 16 <td> ( <th> �>�B� +�� rowspan ��]��@� �>�%� �� %&।�EG�� +��� ��<�T4 ���4 ��0� 4�.� ��L> +����& @-��� +���� +�� rowspan ��]��@� �>�%� ���4 %��।�E���

<td rowspan=”2”>

<th rowspan=”2”>

�/�� � }� ��� +��� ��Y �� %�&�9।

����� @.%�U�� �N> ���-

Page 60: Html 4.0.1 bangla e book  by faruk

60

����� �4 �@�-�� ./ E��-

colspan ��]��@�����]��@�����]��@�����]��@��� �>�%���>�%���>�%���>�%��

colspan �� �>�%� rowspan �� �4�। ZL� colspan ����� ��<�T4 ����।�EG�� ����� ��<�T4 ���4 ��0� 4�.�

��L> +����& @-��� ����� +�� colspan ��]��@� �>�%� ���4 %��।�E���

<td colspan=”2”>

<th colspan=”2”>

����� @.%�U�� �N> ���-

����� �4 �@�-�� ./ E��-

Page 61: Html 4.0.1 bangla e book  by faruk

61

<caption> �>�B��>�B��>�B��>�B� ��]��@���]��@���]��@���]��@� +T�%�+T�%�+T�%�+T�%�

<caption> �>B �>�%� ��� ������ ������ .(& %&। align ��]��@� �>�%� ��� ������ �� #���� caption �� %��

4 ��L*�U �� %&। �)�� �%+�� caption ������ @-�� ���।

<caption align=”top”>

<caption align=”bottom”>

<caption align=”left”>

<caption align=”right”>

���� @.%�U ./��-

����� �4 �@�-�� ./ E��-

������ ������ ������ ������ �>�$@�?)�>�$@�?)�>�$@�?)�>�$@�?) ����1�����1�����1�����1� �>�%���>�%���>�%���>�%��

�>�$@?) ��¡��@� �� +%�E> ���1�� ������ �>�$@?) ���1 �%+�� ./�� E&। ����� @.%�U�� ./���

Page 62: Html 4.0.1 bangla e book  by faruk

62

�.�*���.�*���.�*���.�*��

������������������������������������ �>�$@?)�>�$@?)�>�$@?)�>�$@?) ���-����-����-����-�: @-��� @.%��� ./ E�0 E ���� �� ��� 9��� ����� +�� ��� �� +�� %& �� । E�. ���� �� ��� 9��� ����� ��& �8 %& 4�� �>�$@?) 9�� ���-� %��।

�.�*��

Page 63: Html 4.0.1 bangla e book  by faruk

63

���&� v� ��-� E �� �)k ����4 f@1 ���

www.ashianskyshopbd.com

#L>&-.�� (�&� -�1 ����� �>�%�

������������ g4��g4��g4��g4�� (<form>...</form>) �>B��>B��>B��>B�

���������-� ��� #4>h G��-TU* ���� ��D&। �& ��4� (�&� +���� ��9� � ��9� ���*� �>�%� �� %&।

�@1� ��� ��-�� (�h�>,#)*� $%�, �����, ���) �&� 16 ���������-� ��� �>�%� �� %&। ����&����&����&����& ��*��*��*��* %�%�%�%� 4�>4�>4�>4�> +$�%�+$�%�+$�%�+$�%� 16161616 ��9���9���9���9� ���m����m����m����m� ������������������������। ��* g4��� �>�l4 �>B %� <form>….</form> �>B।�>B।�>B।�>B। ������������ �>B�>B�>B�>B �>�%��>�%��>�%��>�%� ������������ ������������ ZL�ZL�ZL�ZL� ������������ g4��g4��g4��g4�� ���4���4���4���4 -��-��-��-�� ��z��z��z��z ���������������� ��-���C4��-���C4��-���C4��-���C4 )�)�)�)� +�*��+�*��+�*��+�*�� -I��-I��-I��-I�� (((( )�G��)�G��)�G��)�G�� ��++��++��++��++ ������������ 16161616 ���������������� +�*�+�*�+�*�+�*� +�)+�)+�)+�) �>r��&1�>r��&1�>r��&1�>r��&1 E�� E�� E�� E��-�-����-�-����-�-����-�-����- .���.���.���.��� %��।%��।%��।%��। <form> �>�B� +�� method, action �� enctype

��]��@� �>�%� �� %&। �� ��]��@�G�� �-44 ���.� ��1 �B�� �, �-����-�-����-�-����-�-����- �.�&�.�&�.�&�.�& ������������ ��++��++��++��++ ������������ +�&+�&+�&+�& �G���G���G���G�� ��1��1��1��1 �B��।�B��।�B��।�B��। ��]��@�G�� ���& ���~ %�� L�U .(& %�-

Page 64: Html 4.0.1 bangla e book  by faruk

64

����.Method ��]��@����]��@����]��@����]��@��

Method ��]��@� �>�%� ��� ���* �.R )� +��*�� +���� �� %&। ��� Method �>�%� ��� )� +���� �� %& -

1.Get Method (<form method=”GET”></form>)(�)��)

2.Post Method (<form method=”POST”></form>)

URL �� +�� ���*� )� +���� ��� 16 Get Method �>�%� �� %&।�E��� �@1� E�. �� ( -+(&)* �.�&

��B� ��� 4�� Address ��� ����� �4 ./ E���

http://www.sitename.com/login.php?/username=faruk&password=1254893/

�8 �� 4�> +��*�� +���� ��� 16 Post Method �>�%� �� %&। ��N�Y 4�> �����&` ��)� #� �%+��

+��*�� +���� %&।

////.Action ��]��@����]��@����]��@����]��@��

+�*� )��� ��++ ��� 16 �� �$� � �bc �>�%� ���� Action ��]��@��� �L>�� 4 1���& .(& %&� E���

<form action=”registration.php” method=”post”>

BBBB.Enctype ��]��@����]��@����]��@����]��@��

#�L� 4�>+7s ���*� N�Y Get Method �>�%� ���� �� �� -(& E& �। ��N�Y Post Methot ( Enctype ��]��@�

�>�%� ���� �� �� -(& E&। �� ��]��@� }� ���*� ��C�4 ��L*�U ��� .(& %&। E���

<form method=”post” action=”order.php” enctype=”text/plain”>

��������� ��-�� �>B� ���������-� ��� �� #��� ��� �>B ��&�9 । 4� ��L> input �>B�� ��� �>�l4। <input /> �>B �� ��

closing �>�B� ��&1� ��। Input fields %�0 form-�� �U। Input fields �� ��L> E+�� �1��+ #h��*�

Page 65: Html 4.0.1 bangla e book  by faruk

65

+G�� %�� Text Field, Password Field, Radio button, Check Box, Text Area, Button, �� form

submission buttons। ����s ��m ���& ���~ ����� �� %��

�i� �i� �i� �i� ��m��m��m��m g4���g4���g4���g4���

����s (�&� +��� ��1�`�� ���4 B�� ���� ���� ��� ��+ E/�� First name, Last name ��� ����s �i� ��m/�� ���, �� �i� ��m %� 9� �&4�NY E �-��� E��� �i� ��-�� ���4 �.��। �@1� �� ( -+(&)* ��m (�� ��� �i� ��/ E& ��� ��m) g4�� ��� 16 <input> �>B �>�%� �� %&। <input> �>�B� +�� �>�l4 ��]��@�G�� %�- type, name, size, maxlength। +�G�� ��]��@� �>�%� ��� ���� @.%�U ./��-

<html>

<body>

<form>

First name:<input type="text" size="20" maxlength="20" value="Here Your Firstname" name="firstname"><br/>

Last name: <input type="text" size="20" maxlength="20" value="Here Your Lastname" name="lastname">

</form>

</body>

</html>

����� �4 �@4-�� ./ E��-

�) ���|DU�

1.type =”text” [ �� ��� ���m �i� �/ E��।]

2.name - �� ��¡��@��� �.�& ��m�� ����4 ��� �/ %&। �-����- �.�& ��� ��++ ��� +�& �� ��¡��@��� ���� �� L�� ����� �� �� %&।

3.Size=”20”[ �� ��� � #N� �+F ��m -(& E��। default size %� +L��4 � characters ]

4.maxlength=”20”[ �� ��� ���m � #N��� ��� ��- �� E�� �। maxlength attribute ���.*̀ �� 98 �>�%���< 4� �0�4 characters ��-�� ���4 -��� ����� �-�� E�. +�1 ���.*̀ ���( ����। characters ��-�� � +<��� ���4 maxlength attribute �� �>�%� �� %&। size �� maxlength ��� %(& ��&1�]

6.value=”Your Name Here”[ �i� ���m ��>�� �)�� �%+�� ����,�� -���4*��EB>]

-+(&)*-+(&)*-+(&)*-+(&)* ��m��m��m��m g4���g4���g4���g4���

Page 66: Html 4.0.1 bangla e book  by faruk

66

Password Field �i� ���m� �4�। ZL� type=”password” %��।#66 ��]��@�� �>�%� �i� ���m� �4�। E���

<form>

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

</form>

����� �4 �@4-�� ./ E��-

���i ���i ���i ���i g4���g4���g4���g4���

��� ��� �.�& �� #-�� �+��k ��� 16 ���i g4�� �� %&। �/�� �� � ���L� #-�� �+��k �� E��। E���

�@�-���

��)( ��)( ��)( ��)( ������������ g4���g4���g4���g4���

���L� #-�� ��� ��� �Y ���� #-�� �+��k ��� 16 Radio Button g4�� �� %&। checked ��¡��@�,�� +%�E> �-�� ��)( ���� #��������� �)�� �%+�� �C�R ��B ��� �� �.�& �/�4 -���। E���

Page 67: Html 4.0.1 bangla e book  by faruk

67

�@�-���

�i� �i� �i� �i� ���&���&���&���& g4���g4���g4���g4���

�@1� ��� �8 �� ���?� -��� 16 Text Area g4�� g4�� �� %&।��ik ���& �� opening �� closing �>B ��&�9। �ik ���& �>B �� ��4� �� ��9� ��/�� 4 (�&� -1 �� �ik ���& 4 �.��*4 %&।

E���

<form>

<p>Comment:</p>

<textarea rows=”5” cols=”8”> text area </textarea>

</form>

�/�� rows ( cols �� �L>�� Textarea Size ��L*�U �� %&।

������������ g4���g4���g4���g4���

��� g4��� 16 ���~� �) ��- ����

Page 68: Html 4.0.1 bangla e book  by faruk

68

<html>

<body>

<form action="">

<input type="button" value="Hello world!">

</form>

</body>

</html>

+����+����+����+���� ������������ g4���g4���g4���g4���

���*� )� +�*�� +���� ��� 16 +���� ��� g4�� �� %&। E/� ��� submit button � �- .�� 4/� ��* �� �4*�� activate %��। ��N�Y ��� E �\�� value ��¡��@� �� �� �%+�� ���*�� ���� 4 ��� @-� �.��*4 %��। "Submit" or "Continue" �� �\ ��� value ��¡��@� �� �� �%+�� ��� �>�l4 %&। E���

<form>

<input type=”submit” value=”Login”>

<input type=”submit” value=” Continue”>

<input type=”submit” value=”Press”>

</form>

�@�-���

���1���1���1���1 ������������ g4���g4���g4���g4���

���1��( ��� �%�+�� �>�%� �� E&। E���

<input type=”image” src=”button.bmp”>

���+� ��� g4���

���+� ��� �t� ��� �L>�� �-�� ��* �� +���9� ��� -���*� Q���� #��& ���& E�4 -����। E��-

<input type="reset" value="Reset" />

Page 69: Html 4.0.1 bangla e book  by faruk

69

n-)@�n-)@�n-)@�n-)@� ��`��`��`��` g4���g4���g4���g4���

n-)@� ��` �� �L>�� �-�� �@1��� 16 ��� ��� 4��� g4�< ���4 -���� E/� ��� �@1� E��� ��� �+��k ��� �.�4 -���।L�� �-��� ��� ��* g4�< ���4 �� %� �� �/�� ��1��� ��& � �� +� E�4 �+��k ��� �.�4 -�� (#���G�� � �� ��L>) ��� ���� #-�� �/�4 %��,4/� n-)@� ���`� �L>�� +� +%�1� ���4 -���। n-)@� ��` g4�< ���4 ���� <select> �>B �.�& �) Z� ���4 % � ��-� E �����G�� ��� �@1� �9� ���� +G��� ��4�� <option> �>�B� ��L> �/�4 %��।�E���

<html>

<body>

<form>

<select name="color">

<option value="bl">Black</option>

<option value="wh">White</option>

<option value="ye" selected="selected">Yellow</option>

</select>

</form>

</body>

</html>

@-��� @.%��� ./�� selected ��¡��@��� ���� ��� #-�� Yellow ./�0 �-�� E�. �� White ���� ./� 4%�� � ��� ���� selected ��¡��@� �>�%� �����। ��4�� <option> �>�B value ��¡��@� ��9 �� /�� G��-T�* E/� ���*� )� +�*�� -I���।value ��¡��@��� �� L�� ( E�� bl,mr..) �� ���4 %&।

<select> �>�B��>�B��>�B��>�B� size ��¡��@����¡��@����¡��@����¡��@�� <select> �>�B size ��¡��@� �.�& �-�� �I� ��� �.�4 -��� E ���` �&�� ����� ./�� E�� @-��� @.%���� E�. size=2 .� 4%�� ��� #-�� ./�� ���� b� ��� ./�4 %��।

<select name="color" size=2>

<option value="bl">Black</option>

<option value="wh">White</option>

<option selected="selected" value="ye"> Yellow </option>

</select>

<select> �>�B��>�B��>�B��>�B� multiple ��¡��@����¡��@����¡��@����¡��@��

Page 70: Html 4.0.1 bangla e book  by faruk

70

multiple ��]��@��� �L>�� �-�� ���� #�L� ��D& �+��k ��� O�EB �.�4 -���। E��-

<select multiple=”yes”>

<option value="bl">Black</option>

<option value="wh">White</option>

<option selected="selected" value="ye"> Yellow </option>

</select>

E�. selected ��¡��@� @�I�& .� 4%�� �� #-�� �� �+���k) ./���।

�-�� #-�� ��` E�. #��� �8 %& 4%�� ,- ���4 -���।<optgroup> �����?� �.�& �� �� E&। E���

<html>

<body>

<form>

<select name="TutorialInfo">

<optgroup label="Web Design">

<option value="html"> HTML Tutorial</option>

<option value="css"> CSS Tutorial</option>

<option value="photoshop"> Photoshop Tutorial</option>

</optgroup>

<optgroup label="Web Development">

<option value="js"> JavaScript Tutorial</option>

<option value="php"> PHP Tutorial</option>

<option value="database"> MySql Tutorial</option>

</optgroup>

</form>

</body>

</html>

����� �4 �@�-�� ./ E��-

Page 71: Html 4.0.1 bangla e book  by faruk

71

�-��) ��� g4���

upload form �>�%� ��� �@1� pictures, movies, � ����� ���1� webpage upload ���4 -��। ��� upload form %� �� L���� input form । �-�� +L����� type attribute �.�& �� �� �%+�� file ���/ upload form g4�< ���4 -���। E���

Upload File: <input type="file"/>

upload ��� �� size �� +<�� ��L �.�& �-�� �-�� webserver �� �T�>�� space �N ���4 -���। �� 16 ��� hidden input field �� ��( ��9� specific attributes EB ����।

<input type="hidden" name="MAX_FILE_SIZE" value="500" />

input type="file"/>

�/�� value 100 ��� file +��*� 100kb %�4 -���।

)���� ��� %�`

+� ���� ��4{�4 ���&

hostghor.com

Page 72: Html 4.0.1 bangla e book  by faruk

72

#L>&-�B�� (�&� -�1 o��� �>�%�

������������������������������������ iframe �>B��>B��>B��>B�

���� (�&� -�1� ��W ������ (�&� -1 �.�*� ���4 iframe �>B �>�%� �� %&। �� �>�B� �+��>i %��

<iframe src=" E (�&� +���� ./�4 �� �/�� +� (�&� +���� �I�� �.�4 %�� "></iframe>

iframe �>�B� +�� E +�� ��]��@� �>�%� �� %&�

1.width

2.height

3.frameborder

Width ( height ��]��@� �>�%� ��� iframe (�&� -�1 �4��: 1&B ���& �.��*4 %�� 4 ��L*�U �� %&।

��.� �� �-�i�� ���, 4�� �-�� ���� �� �4���4 ��� ���4 -���। E���

<iframe src="iframe.htm" width="200" height="200"></iframe> �

<iframe src="demo_iframe.htm" width="50%" height="60%"></iframe>

Frameborder ��]��@� �>�%� ��� iframe-�� �)*� .T� �� %&। E���

<iframe src=" iframe.htm" frameborder="0"></iframe>

�� �� ! �>�%� ���� �)*� ���� E��।

#L>&-��� ������������������������������������ ��@� ��@� ��@� ��@� ���� (�&� -1�� OP� ��� +1�4 ��@��� G�� #-��+<�। (�&� -1�� ����s ��B (+�� ( ����) ����

��� -��4� %� ��������� ��@�।���� ��D*U<& (�&� -1 g4�� ���4 #�p� ��@� +7��* �����

1��4 %��। ��� �N> ���� ./�4 -� E, #�L�� (�&� +��� ���L� +�� ( ��� ���& B�I4। ��B ZL��Y

Page 73: Html 4.0.1 bangla e book  by faruk

73

��������� �>�%� ���� ��@� g4�� �� %4 ��z �4*��� ��������� ( �+�+�+ ���Y ��@� g4�� �� %&। ����� ��@� g4�� �� E& –

!. ���� �>B (<table>...</table>) �>�%� ���। [��N�Y ZL� ��������� %��� %��]

�. �)� �>B (<div>...</div>) �>�%� ���। [��������� ( �+�+�+ ���� .��� %��]

����� ��Y �N> ��� ���� (�&� -1�� ����s ��B �B �� %�&�9। ��� %� ��@�।

<table> �>B�>B�>B�>B �>�%��>�%��>�%��>�%� ������������ ��@� ��@� ��@� ��@� g4���g4���g4���g4���

<table> �>B �>�%� ��� �4��� � ( ��� ��� ����; ���� (�&� -�1� @.%�U ���~ .(& %��

<html>

<body>

<table width="500" border="0">

<tr>

Page 74: Html 4.0.1 bangla e book  by faruk

74

<td colspan="2" bgcolor=#FFA500">

<h1>Main Title of Web Page</h1>

</td>

</tr>

<tr valign="top">

<td bgcolor=#FFD700;width=100px;">

<b>Menu</b><br />

HTML<br />

CSS<br />

JavaScript

</td>

<td bgcolor=#EEEEEE height=200px width=400px">

Content goes here</td>

</tr>

<tr>

<td colspan="2" bgcolor=#FFA500">

Copyright © 2012| Error! Hyperlink reference not valid.>

</tr>

</table>

</body>

</html>

�@�-���

Page 75: Html 4.0.1 bangla e book  by faruk

75

E�.( ���� �>B �>�%� ��� OP� ��@� g4�� �� E& 4�� �� �+�� ��@� �)1�� ��� �%+�� �>�%� �� %& �, ��

-����4* <div> �>B �>�%� �� @R�।

CLASS (((( ID ��]��@����]��@����]��@����]��@��

`���<�(CSS) ( �bc(JavaScript)�>�%��� 16 (�&��-�1� ����s @-.��� ����s ��]��@� �>�%� �� %&। �� �L> #64� %� ID, CLASS ( STYLE। ID Attribute-�� �L>�� ��4�� @-.��� ��s��� ��s ���

����4 �� E&। �� CLASS Attribute-�� �L>�� ���L� @-.��� ��� ,�-� +.� �%�+�� ����4 �� E&।�E��� ��� ->�$��� E�. ��� ��. ��� �)1�� ���4 �� 4�� 4�.��� ���� ��� ID ��� �.�& �/ E�4 -�� E�4 ��� ��� 4�.� `�� ��L*�U ��� +�& ���.` ��� �.�4 -�� �� ->�$��� �)1�� ���4

%��।

<p id=”1”> This is first Paragraph </p>

<p id=”2”> This is second Paragraph</p>

��� #���G�� ->�$��� E�. ��� ��� �)1�� �� 4�� 4�.��� ��� CLASS ��� ����4 ��� �/ E�4

-��। E��-

<p class=”2”> This is first Paragraph </p>

<p class=”2”> This is second Paragraph </p>

<p class=”2”> This is third Paragraph </p>

style ��]��@� �>�%� ��� ����s ��������� @-.��� `�� �� %&। �� �+�� �+�+�+-�� #�। �)�

�>B ������ +�& �� �B�� 4� ���� ��� ����।�E���

<a href=”first.htm” STYLE=”font-style:bold”>Link to first Document</a>

Page 76: Html 4.0.1 bangla e book  by faruk

76

�� ��� ������ �i� �� ./ E��।

������������������������������������ <div> �>B��>B��>B��>B�

<div>...</div> �>B #66 �>B �� -Y �%+�� �1 ��� #���� body �>B �� �4। <div> �>B %�� V� ���� �����?� E ���������-�� ����s @-.��� ,- ���� +1�4 �>�%� �� %&। �)� �>B #�*J �)���� �>�B� �1 %� ���� (�&� -1�� ����s #�� �B �� �� ����s #��� ����s �)1��� +%E> ��। �+�+�+ �� N�Y Div �����?� #��� G�R-��*। �+�+�+ ���& �1 ��� +�& �)� �>�B� -��-TU* �>�%� ����� ��W E��। ���� <div> �>�B �>�l4 �4�G�� ��]��@� .& %���

Id �� +%�E> �� ������?�� ���� �@��� ���) .(& %&।

Align �� ��]��@��� �� left,right,center, justify %�4 -��।

Width ������?�� ��F4

Height ������?�� @�4

Title �����?� +7��* #�4��� 4�> �.�।

style .�*��.� strong visualization �� 16 �)��� style attribute �� �L>�� ��� �.�*� �� E&।

���� @.%�U ./���

<html>

<body>

<div style="background:#ff0011" align="center">

<h1>Visit My blog </h1>

<a href="http://www.webtechnologyblog.com">WebTechnology</a>

</div>

<div style="background:#00ff11" align="center">

<p>This is a paragraph</p>

</div>

</body>

</html>

�@�-���

Page 77: Html 4.0.1 bangla e book  by faruk

77

./�� (�&� -�1 ��� ��. �)���� g4�� %�&�9। ������ @.%�U ./���

<html>

<head>

<title>Use of DIV Tag</title>

</head>

<body>

<div id="menu" align="center" style="background:#aa0000" >

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

<a href="/">HTML</a> |

<a href="/">CSS</a> |

<a href="/">PHP</a>

</div>

<div id="content" align="center" style="background:#aa0000" >

<h5>Content Articles</h5>

<p>This paragraph would be your content

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

<h5 >Content Article Number Two</h5>

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

</div>

</body>

</html>

�@�-���

Page 78: Html 4.0.1 bangla e book  by faruk

78

<div> �>B�>B�>B�>B �>�%��>�%��>�%��>�%� ������������ ��@� ��@� ��@� ��@� g4���g4���g4���g4���

����� @.%��U ./�� ��� �1 �)� �>B �>�%� ��� �� %�&�9-

<html>

<body>

<div id="container" style="width:500px">

<div id="header" style="background-color:#FFA500;">

<h1 style="margin-bottom:0;">Main Title of Web Page</h1></div>

<div id="menu" style="background-color:#FFD700;height:200px;width:100px;float:left;">

<b>Menu</b><br />

HTML<br />

CSS<br />

JavaScript</div>

<div id="content" style="background-color:#EEEEEE;height:200px;width:400px;float:left;">

Content goes here</div>

<div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">

Copyright © 2012| Error! Hyperlink reference not valid.>

</div>

</body>

</html>

Page 79: Html 4.0.1 bangla e book  by faruk

79

�@�-���

#L>&- 4��

������������������������������������ 4.01- �������� +��+��+��+�� �>B��>B��>B��>B� �>B �U*�

+L�U �>B+�T%

<!DOCTYPE> ):���?�� L�U ���.*� ���।

<html> ��������� ):��?� ���.*� ���।

<body> ��������� ):���?�� ��) #� ���.*� ���।

<h1> to <h6> ��������� %�) ���.*� ���।

<p> �� �>B �.�& ->�$� ��� �� %&।

<br /> ��� ��� f� g4�� ���।

Page 80: Html 4.0.1 bangla e book  by faruk

80

<hr /> �S�T��� �/ g4�� ���।

<!--...--> ���� �h�> ��� �� %&।

���>��-�� �>B+�T%

<acronym> ����D �\ +7��* 4�> �.�।

<abbr> �U*��T�� �� ��9� 4��� L��।

<address> #���� 4�> 4��� L��।

<b> �i��� �m ���।

<bdo> �i��� �.� ���.*� ���।

<big> �8 �i� ��� ���।

<blockquote> ����� g4���4 �>�%� �� %&।

<cite> �i��� ����� %��� ./&।

<code> �i��� ��7@�� ��)� �4 ./&।

<del> �i��� �W ���� .B ./&।

<dfn> �i��� )������ ��* ./&।

<em> �m ./&।

<i> �i��� ����� %��� ./&।

<ins> �3���) �i��� ./&।

<kbd> �<��)* �i��� ./&।

<pre> ���>��� �� -���4*� � ��� �i� �.�*� ���।

<q> ��* ������� 16 �>�%� �� %&।

<samp> �i��� ��7@�� ��)� �4 ./&।

<small> 9� �i� ��� ���4 �>�%� �� %&।

<strong> �m �i� �.�*� ���।

Page 81: Html 4.0.1 bangla e book  by faruk

81

<sub> +��bc �i� �.�*� ���।

<sup> O-��bc �i� �.�*� ���।

<tt> �����- �i� �.�*� ���।

������������ g4���4g4���4g4���4g4���4 �>B+�T%�>B+�T%�>B+�T%�>B+�T%

<form> ��� g4��� �>B।

<input /> ��-�� ��m g4���4 �>�%� �� %&।

<textarea> �i� ���& g4�� ���4 �>�%� �� %&।

<button> ��� g4�� �� %&।

<select> n-)@� ��` �+��k �� %&।

<optgroup> �� ���` ��� L��U� ��D&G���� ��Y ���।

<option> ���`� �����G���� ./&।

<label> ��-�� ������?�� ���� �.�*� ���।

<fieldset> ���*� +�� ������?�� ��-�� �)*� g4�� ���।

<legend> <fieldset> �>�%� ��� E �)*� .(& %& 4� ����� �.�4 �>�%� ��

%&।

���1���1���1���1 �>�%����>�%����>�%����>�%��� �>B+�T%�>B+�T%�>B+�T%�>B+�T%

<img /> ���1 ��� ���4।

<map> ���1 �>�-� 16 �>�%� �� %&।

<area /> ���1 �>�-� ��W 1&B ��L*�U ���।

������������ g4���4g4���4g4���4g4���4 �>B+�T%�>B+�T%�>B+�T%�>B+�T%

<a> ��� ����� �>B

<link /> ):���?�� +�� ����� �� ):���?���� +�EB �-�।

Page 82: Html 4.0.1 bangla e book  by faruk

82

��`��`��`��` g4���4g4���4g4���4g4���4 �>B+�T%�>B+�T%�>B+�T%�>B+�T%

<ul> ��#)� ��` ��� ���।

<ol> #)*� ��` ��� ���।

<li> ��` ����� ��� ���।

<dl> )������ ��` ��� ���।

<dt> )������ ���`� ���� ��* ��� ���।

<dd> ���*� �U*� ��� ���।

���� ���� ���� ���� g4���g4���g4���g4��� �>B+�T%��>B+�T%��>B+�T%��>B+�T%�

<table> ���� g4��� �>B

<caption> ������ ������ .(& %&।

<th> ���� +��� %)� �.�4 �>�%� �� %&।

<tr> ���� �/+�� g4���4 �>�%� �� %&।

<td> ������ ���� +� g4���4 �>�%� �� %&।

<thead> ������ %)� ����?�

<tbody> ������ ��) ����?�

<tfoot> ������ ���� ����?�

<col /> ����� �� � ���L� ��� g4���4 �>�%� �� %&।

<colgroup> ����� ��� ,- g4���4 �>�%� �� %&।

):���?��):���?��):���?��):���?�� `��`��`��`�� ��L*��U���L*��U���L*��U���L*��U� �>B+�T%�>B+�T%�>B+�T%�>B+�T%

<style> ):���?�� `�� ��� �� %&।

<div> ):���?� ��. ��. +��� g4���4 �>�%� �� %&।

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

Page 83: Html 4.0.1 bangla e book  by faruk

83

<head> ):��?� +7��*4 4�> ��� ���।

<title> ):���?�� ����� ��� ���।

<meta> ):���?�� �� �������� ��� ��� ।

<base /> ���� (�&�+���� +�F ����� ���� (�&� -�1 �)�� ��� �%�+��

�>�%��� 16 �>�%� �� %& �+ �>B ।

[����� /�� �4� ��� �� %�� ��������� ^-�� @-�

#+L�U ���� �� । ,�- ��&��4 /M1/�� ���]