تعلم html

www.dinaro.com/vb3

1

www.dinaro.com/vb3

 :HTML ‫ﻣﻘﺪﻣﺔ ﻓﻲ ﻟﻐﺔ‬ :

‫ﺍﻟﺪﺭﺱ ﺍﻷﻭﻝ‬

:‫ﺍﻟﺪﺭﺱ ﺍﻟﺜﺎﻧﻲ‬ : ‫ﺍﻟﺪﺭﺱ ﺍﻟﺜﺎﻟﺚ‬ : ‫ﺍﻟﺪﺭﺱ ﺍﻟﺮﺍﺑﻊ‬ : ‫ﺍﻟﺪﺭﺱ ﺍﻟﺨﺎﻣﺲ‬ : ‫ﺍﻟﺪﺭﺱ ﺍﻟﺴﺎﺩﺱ‬ 1: ‫ﺍﻟﺪﺭﺱ ﺍﻟﺴﺎﺑﻊ‬ 2: ‫ﺍﻟﺪﺭﺱ ﺍﻟﺜﺎﻣﻦ‬ : ‫ﺍﻟﺪﺭﺱ ﺍﻟﺘﺎﺳﻊ‬ : ‫ﺍﻟﺪﺭﺱ ﺍﻟﻌﺎﺷﺮ‬ 2

www.dinaro.com/vb3

1: ‫ﺍﻟﺪﺭﺱ ﺍﻟﺤﺎﺩﻱ ﻋﺸﺮ‬ 2: ‫ﺍﻟﺪﺭﺱ ﺍﻟﺜﺎﻧﻲ ﻋﺸﺮ‬

MS : ‫ﺍﻟﺪﺭﺱ ﺍﻟﺜﺎﻟﺚ ﻋﺸﺮ‬ Internet

Explorer

3

‫‪www.dinaro.com/vb3‬‬

‫ﻛﻠﻤﺔ ﺍﻟﻤﺆﻟﻒ‬ ‫ان اﻟﺘﻄﻮر اﻟﺸﺪﯾﺪ اﻟﺬي ﺷﮭﺪﺗﮫ ﻟﻐﺔ ‪، HTML‬واﻻﻋﺪاد اﻟﮭﺎﺋﻠﺔ اﻟﺘﻲ ﺗﺤﺎول ان ﺗﺘﻌﻠﻢ‬ ‫ھﺬه اﻟﻠﻐﺔ اﻟﺠﻤﯿﻠﺔ واﻟﺴﮭﻠﺔ ﻛﺎن ﻻﺑﺪ ﻟﻲ ﻣﻦ اﻧﺸﺎء ﻛﺘﺎب ﯾﺘﺤﺪث ﻋﻦ ھﺬه اﻟﻠﻐﺔ‪.‬‬ ‫وﻓﻲ اﻟﺤﻘﯿﻘﺔ ﺗﻮﺟﺪ ﻛﺜﯿﺮ ﻣﻦ اﻟﻜﺘﺐ ﺗﺘﺤﺪث ﻋﻦ ﻟﻐﺔ ‪، HTML‬وﻟﻜﻦ ﻗﻠﯿﻞ ﻣﻨﮭﺎ ﯾﻌﻠﻤﻚ‬ ‫ﻛﯿﻒ ﺗﺼﺒﺢ ﻣﺼﻤﻢ ﺻﻔﺤﺎت وﯾﺐ ﻧﺎﺟﺢ‪.‬‬ ‫وﻓﻲ ھﺬا اﻟﻜﺘﺎب ﺳﻨﺴﯿﺮ ﺧﻄﻮة ﺧﻄﻮة ﯾﺎ ﻋﺰﯾﺰي اﻟﻤﺘﺪرب‪.‬‬ ‫وﻟﻘﺪ اﻋﺘﻤﺪت ﻋﻠﻰ ﻋﺪة ﻣﺼﺎدر وﻛﺘﺐ ‪.......................‬وادﻋﻮا ﻟﮭﻢ ﺑﺎﻟﺨﯿﺮ واﻟﺼﺤﺔ‬ ‫واﻟﻌﻄﺎء اﻟﺪاﺋﻢ‪.‬‬

‫وﻋﻤﻮﻣﺎ اﺗﻤﻨﻰ ﻟﻜﻢ اﺳﻌﺪ اﻻوﻗﺎت‪ ،‬واﺳﺘﻔﺎدة ﻣﻮﻓﻘﺔ ﺑﺈدن اﷲ !‬

‫اﻟﻤﺆﻟﻒ!!‬ ‫أﯾﻮب ﻣﻌﺘﺼﻢ‬

‫‪4‬‬

‫‪www.dinaro.com/vb3‬‬

‫ﻗﺒﻞ ﻗﺮﺍﺀﺓ ﻫﺬﺍ ﺍﻟﻜﺘﺎﺏ‬ ‫ﯾﺠﺐ ان ﯾﻜﻮن ﻟﺪﯾﻚ ﻣﺤﺮر ﻧﺼﻮص ﻣﺜﻞ ‪ NotePad‬اﻟﻤﺮﻓﻖ ﻣﻊ ‪Windows‬‬ ‫وﻣﺘﺼﻔﺢ ﻟﻤﻌﺎﯾﻨﺔ اﻟﻨﺘﺎﺋﺞ ﻣﺜﻞ ‪ Netscape Navigator‬ﺃﻭ ‪.MS Internet‬‬

‫وﻻ ﺗﻈﻦ ان اﺑﺪا ان اﻧﺸﺎء ﻣﻮاﻗﻊ ﻋﻤﻠﯿﺔ ﺻﻌﺒﺔ ھﺬا ﺧﺎﻃﺊ ھﺬا ﺧﺎﻃﺊ ھﺬا ﺧﺎﻃﺊ‪..........‬‬ ‫واذا اﻛﻤﻠﺖ ﻗﺮاءة ھﺬا اﻟﻜﺘﺎب ﺟﯿﺪا ﺳﺘﺘﻤﻜﻦ ﻣﻦ ﺗﺼﻤﯿﻢ ﺻﻔﺤﺎت اﻟﻮﯾﺐ‪.‬‬ ‫‪5‬‬

‫‪www.dinaro.com/vb3‬‬

‫ان ﺗﻌﻠﻢ ﻟﻐﺔ ‪ HTML‬اﻣﺮ ﻣﻤﺘﻊ وﺳﺘﻌﺮف ذﻟﻚ‪.‬‬ ‫ﯾﺎ ﻋﺰﯾﺰي اﻟﻤﺘﺪرب ﻟﻘﺪ ﻛﻨﺖ ﻣﺘﻠﻚ ﻣﺒﺘﺪئ ﻟﻜﻦ ﺑﻌﻮن اﷲ ورﻋﺎﯾﺘﮫ ﺻﺮت ﻣﺼﻤﻢ ﻣﻮاﻗﻊ‬ ‫وﯾﺐ ﻧﺎﺟﺢ‪.‬‬

‫ﯾﻤﻨﻊ اﺳﺘﻐﻼل ھﺬا اﻟﻜﺘﺎب ﻓﻲ اي اﻣﻮر ﺗﺠﺎرﯾﺔ ﺑﺪون اﻻذن اﻟﺨﻄﻲ ﻣﻦ‬ ‫اﻟﻤﺆﻟﻒ‪..........‬‬ ‫اﻟﻤﺆﻟﻒ ﻏﯿﺮ ﻣﺴﺆول ﺗﻤﺎﻣﺎ ﻋﻦ اي اﺳﺘﻌﻤﺎل ﻏﯿﺮ ﺷﺮﻋﻲ ﻟﮭﺬا اﻟﻜﺘﺎب‪..‬‬ ‫ﻓﻲ ﺣﺎﻟﺔ وﺟﺪت اي اﺧﻄﺎء ﻓﻲ ھﺬا اﻟﻜﺘﺎب ﯾﻤﻜﻨﻚ ﻣﺮاﺳﻠﺘﻲ ﻋﻠﻰ اﻟﺒﺮﯾﺪ اﻟﺘﺎﻟﻲ ‪:‬‬

‫‪[email protected]‬‬

‫أو‬ ‫‪[email protected]‬‬ ‫ﺳﯿﻜﻮن ﻋﻤﺎ ﻗﺮﯾﺐ ﺑﺈذن اﷲ ﻛﺘﺐ ﺟﺪﯾﺪة ﻓﻲ ﻋﺪة ﻟﻐﺎت ﻣﻨﮭﺎ ‪ pascal :‬و ‪ php‬و ‪css‬‬ ‫و ‪ visual basic 6‬و ‪ javascript‬و ‪.mysql‬‬

‫ارﺟﻮا زﯾﺎرة اﻟﻤﻨﺘﺪى ‪www.dinaro.com/vb3‬‬ ‫‪6‬‬

‫‪www.dinaro.com/vb3‬‬

‫ﺛﻤﻦ ﺍﻟﻜﺘﺎﺏ‬ ‫ﺍﻟﺪﻋﺎﺀ ﻟﻲ ﻭﻟﻮﺍﻟﺪﻱ ﻭﻟﺠﻤﻴﻊ ﺍﻟﻤﺴﻠﻤﻴﻦ ﺑﺎﻟﺼﺤﺔ ﻭﺍﻟﻬﻨﺎﺀ ﻭﺍﻻﺯﺩﻫﺎﺭ ﻭﺍﻟﻨﻤﺎﺀ‬

‫ﻭﺍﻟﻌﻄﺎﺀ ﺍﻟﺪﺍﺋﻢ ﻭﺍﻟﺸﻔﺎﺀ‪...............................‬ﻭﺍﻟﻔﻮﺯ ﺑﺎﻟﺠﻨﺔ ﻭﺍﻟﻨﺠﺎﺓ ﻣﻦ ﺍﻟﻨﺎﺭ‬ ‫ﻭﻫﺬﺍ ﻛﻞ ﻣﺎ ﺃﻃﻠﺒﻪ‪......‬ﻭﺷﻜﺮﺍ ﻟﻜﻢ‪...‬‬

‫‪7‬‬

www.dinaro.com/vb3

           

8

‫‪www.dinaro.com/vb3‬‬

‫ﻣﻘﺪﻣﺔ ﻓﻲ ﻟﻐﺔ ‪HTML‬‬ ‫أھﻼً ﺑﻚ إﻟﻰ ﻣﻘﺪﻣﺔ ﻟﻐﺔ ‪ HTML‬أو ﻛﻤﺎ ﯾﺴﻤﯿﮭﺎ اﻟﺒﻌﺾ ﻟﻐﺔ اﻟﮭﺘﻤﻞ ‪.‬‬ ‫ﺣﺴﻨﺎً ﻓﻠﻨﺒﺪأ اﻟﺸﺮح وﻟﻜﻦ أوﻻً أرﯾﺪ أن أﺟﯿﺐ ﻋﻠﻰ ﺑﻌﺾ أﺳﺌﻠﺘﻚ واﺗﻮﻗﻊ أن أول ﺳﺆال‬ ‫ﯾﻘﻮل ‪:‬‬ ‫ﻣﺎ ﻣﻌﻨﻰ ﻟﻐﺔ ‪ HTML‬؟‬ ‫ان ﻟﻐﺔ ‪ HTML‬وھﻲ اﺧﺘﺼﺎر ﻟﻜﻠﻤﺔ )‪(Language Markup Text Hyper‬‬ ‫وھﻲ إﺣﺪى اﻟﻄﺮق ﻓﻲ ﺗﺼﻤﯿﻢ ﺻﻔﺤﺎت ﻋﻠﻰ اﻻﻧﺘﺮﻧﺖ أو ﺗﺰﯾﯿﻦ اﻟﺮﺳﺎﺋﻞ اﻟﺘﻲ ﺗﺒﻌﺚ ﻋﺒﺮ‬ ‫اﻟﺒﺮﯾﺪاﻻﻟﻜﺘﺮوﻧﻲ‪.‬‬ ‫ان ﻟﻐﺔ ‪ HTML‬ﻟﯿﺴﺖ ﻟﻐﺔ ﺑﺮﻣﺠﯿﺔ ﻛﻠﻐﺔ ‪ C++‬أو ‪ JAVA‬أو ‪ C‬ﻓﮭﻲ ﻟﻐﺔ ﺳﮭﻠﺔ‬ ‫وﻏﯿﺮ ﻣﻌﻘﺪة وﻻ ﺗﺤﺘﻮي ﻋﻠﻰ ﺷﯿﻔﺮات ﻛﺜﯿﺮة ﻛﺬﻟﻚ ﻓﮭﻲ ﻻ ﺗﺤﺘﺎج إﻟﻰ ﻣﺘﺮﺟﻢ ‪ .‬ﻟﺬﻟﻚ ﻓﮭﻲ‬ ‫ﻟﻐﺔ ﺑﺴﯿﻄﺔ ﺟﺪاً‪ ،‬وﺳﮭﻠﺔ اﻟﻔﮭﻢ واﻟﺘﻌﻠﻢ وﻻ ﺗﺤﺘﺎج ﻟﻤﻌﺮﻓﺔ ﻣﺴﺒﻘﺔ ﺑﻠﻐﺎت اﻟﺒﺮﻣﺠﺔ‬ ‫واﻟﮭﯿﻜﻠﯿﺔ اﻟﻤﺴﺘﺨﺪﻣﺔ ﻓﯿﮭﺎ‪.‬‬ ‫ﺗﺤﺘﺎج داﺋﻤﺎً إﻟﻰ ﺗﻄﺒﯿﻖ ﻣﺎ ﺗﺘﻌﻠﻤﮫ ﺑﺼﻮرة ﻋﻤﻠﯿﺔ أﻛﺜﺮ ﻣﻦ ﻣﺠﺮد اﻷﻣﺜﻠﺔ اﻟﻤﺪرﺟﺔ ﻓﻲ‬ ‫اﻟﻜﺘﺎب‪.‬‬

‫‪9‬‬

‫‪www.dinaro.com/vb3‬‬

‫ﺍﻟﺪﺭﺱ ﺍﻻﻭﻝ‬ ‫‪‬‬ ‫ﺣﺴﻨﺎً ﻓﻠﻨﺒﺪأ اﻟﺸﺮح ﺗﻜﺘﺐ ﻟﻐﺔ ‪ HTML‬ﺑﺮﻣﻮز ﻏﺮﯾﺒﺔ وﻛﺜﯿﺮة اﺳﻤﮭﺎ ﺑﺎﻟﻠﻐﺔ اﻻﻧﺠﻠﯿﺰﯾﺔ‬ ‫اﻟـ‪ Tags‬وﺗﺴﻤﻰ ﺑﺎﻟﻠﻐﺔ اﻟﻌﺮﺑﯿﺔ اﻟﻮﺳﻮم ‪.‬‬

‫و ﻟﻜﻞ وﺳﻢ ﻣﻦ وﺳﻮم ﻟﻐﺔ اﻟـ‪ HTML‬وﺳﻢ ﺑﺪاﯾﺔ ووﺳﻢ ﻧﮭﺎﯾﺔ وﺳﻮف اﻣﺜﻠﮫ ﻟﻚ ﻣﻦ‬ ‫ﺧﻼل اﻟﺮﺳﻢ اﻟﺘﺎﻟﻲ ‪:‬‬

‫‪10‬‬

‫‪www.dinaro.com/vb3‬‬

‫ﺳﻮف أﺷﺮح ﻛﻞ وﺳﻢ ﻋﻠﻰ ﺣﺪى ‪:‬‬ ‫واﻟﻮﺳﻢ اﻷول ھﻮ اﻟﻮﺳﻢ > ‪ < HTML‬اﻟﺬي ﻛﻤﺎ ذﻛﺮت ﺳﺎﺑﻘﺎً أﻧﮫ أھﻢ اﻟﻮﺳﻮم‬ ‫اﻟﻤﺴﺘﺨﺪﻣﺔ ﻓﻲ ﺑﻨﺎء اﻟﺼﻔﺤﺎت اﻟﻤﺴﺘﺨﺪم ﻓﯿﮭﺎ ﻟﻐﺔ اﻟـ‪ ، HTML‬ﻷﻧﮫ ﯾﻘﻮم ﺑﺘﻌﺮﯾﻒ‬ ‫ﻟﻠﻤﺘﺼﻔﺢ أن ھﺬه اﻟﺼﻔﺤﺔ ﻣﺼﻨﻮﻋﺔ ﺑﻠﻐﺔ اﻟـ‪ HTML‬وﯾﻮﺿﻊ ھﺬا اﻟﻮﺳﻢ ﻓﻲ أول‬ ‫اﻟﻤﺴﺘﻨﺪ اﻟﻤﺼﻨﻮع ﺑﻠﻐﺔ اﻟـ‪ HTML‬وﻟﻮﻻ ھﺬا اﻟﻮﺳﻢ ﻟﻈﮭﺮت ﻣﺤﺘﻮﯾﺎت اﻟﺼﻔﺤﺔ ﺑﺼﻮرة‬ ‫ﺑﺎھﺘﺔ وﻏﯿﺮ ﻣﻔﮭﻮﻣﺔ ‪ ،‬وﺳﻢ اﻟﻨﮭﺎﯾﺔ ھﻮ > ‪ < /HTML‬اﻟﺬي ﯾﻮﺿﻊ أﺧﺮ اﻟﻤﺴﺘﻨﺪ‬ ‫اﻟﻤﺼﻨﻮع ﺑﻠﻐﺔ اﻟـ‪. HTML‬‬ ‫ﻓﻠﻨﺄﺗﻲ اﻵن ﻟﻠﻮﺳﻢ > ‪ < HEAD‬اﻟﺬي ﯾﺴﺘﺨﺪم ﻟﺘﻌﺮﯾﻒ ﺻﺎﺣﺐ اﻟﺼﻔﺤﺔ واﻟﻠﻐﺔ واﻟﻌﺪﯾﺪ‬ ‫ﻣﻦ اﻷﺷﯿﺎء اﻟﺘﻲ ﺳﻮف ﻧﺸﺮﺣﮭﺎ ﻓﻲ دروس ﻗﺎدﻣﺔ إﻧﺸﺎء اﷲ ‪ .‬وأذﻛﺮك أن وﺳﻢ اﻟﻨﮭﺎﯾﺔ‬ ‫اﻟﺨﺎص ﺑﮫ ھﻮ > ‪< /HEAD‬‬

‫ﻧﺄﺗﻲ اﻵن إﻟﻰ اﻟﻮﺳﻢ > ‪ < TITLE‬اﻟﺬي ﯾﻤﺜﻞ اﻟﺠﻤﻠﺔ اﻟﺘﻲ ﺗﻮﺿﻊ أﻋﻠﻰ اﻟﺸﺎﺷﺔ ﻋﻠﻰ‬ ‫اﻟﯿﺴﺎر ‪ ،‬ووﺳﻢ اﻟﻨﮭﺎﯾﺔ اﻟﺨﺎص ﺑﮫ ھﻮ > ‪ ، < /TITLE‬ﻣﻼﺣﻈﺔ ﯾﻮﺿﻊ ھﺬا اﻟﻮﺳﻢ ﺑﯿﻦ‬ ‫اﻟﻮﺳﻤﯿﻦ > ‪ < HEAD‬و > ‪< /HEAD‬‬

‫ﻧﺄﺗﻲ اﻵن إﻟﻰ اﻟﻮﺳﻢ > ‪ < BODY‬اﻟﺬي ھﻮ ﻟﺐ اﻟﺪروس ﺑﺄﻛﻤﻠﮭﺎ ‪ ،‬ﺣﯿﺚ ﯾﻤﺜﻞ ھﺬا‬ ‫اﻟﻮﺳﻢ ﻣﺤﺘﻮﯾﺎت اﻟﺼﻔﺤﺔ ﺑﺄﻛﻤﻠﮭﺎ ﺣﯿﺚ ﺗﻀﻊ ﻓﯿﮫ اﻟﺠﺪاول واﻟﺼﻮر و اﻟﻤﻮاﺿﯿﻊ وﻛﻞ‬ ‫ﻣﺎﺗﺮﯾﺪه أن ﯾﻈﮭﺮ ﻋﻠﻰ اﻟﺼﻔﺤﺔ ‪.‬‬ ‫ﺳﻮف أﺑﺴﻂ ﻟﻚ ﻛﻞ ﻣﺎ ذﻛﺮت ﻓﻲ ھﺬا اﻟﺪرس داﺧﻞ ھﺬا اﻟﺮﺳﻢ اﻟﺘﺒﯿﺎﻧﻲ ‪:‬‬

‫‪11‬‬

‫‪www.dinaro.com/vb3‬‬

‫ﺇﺫﻥ ﻤﻠﻑ ‪ Html‬ﻴﺒﺩﺃ ﺩﺍﺌﻤﺎﹰ ﺒﺎﻟﻭﺴﻡ >‪ ‪ .‪‪‪<TITLE‬‬ ‫‪first page web‬‬ ‫>‪‪ first page web‬‬ ‫>‪‪hello world !! ‪‪‪<TITLE‬‬ ‫‪first‬‬ ‫‪page‬‬ ‫‪web‬‬ ‫>‪‪‪‪‪‪ ‪‪‪<TITLE‬‬ ‫‪first page web‬‬ ‫>‪‪‪‪hello
world ‪‪‪ ‪‪‪<TITLE‬‬ ‫‪first page web‬‬ ‫>‪‪‪‪hello

world ‪‪‪‪‪<TITLE‬‬ ‫‪first page web‬‬ ‫>‪‪‪‪‪ ‪ ‪. ... ‪‪‪<TITLE‬‬ ‫‪first page web‬‬ ‫>‪‪"‪‪"‪‪ ‪‪ ‪‪ أو < أو "‬ ‫ﺑﺈﺧﺘﺼﺎر ﺷﺪﯾﺪ‪ ...‬وﻛﻘﺎﻋﺪة أﺳﺎﺳﯿﺔ‪ ،‬اﻟﺼﻔﺤﺔ اﻟﻤﺼﻤﻤﺔ ﺟﯿﺪاً ھﻲ اﻟﺼﻔﺤﺔ ذات اﻟﻮﺳﻮم‬ ‫اﻟﺼﺤﯿﺤﺔ وﻏﯿﺮ اﻟﻤﺘﺪاﺧﻠﺔ‪.‬‬

‫وﺻﻠﻨﺎ اﻵن إﻟﻰ ﻧﮭﺎﯾﺔ ھﺬا اﻟﺪرس‪ .‬أﺗﻤﻨﻰ أن ﺗﻜﻮن ﻗﺪ ﻗﻀﯿﺖ وﻗﺘﺎً ﻣﻤﺘﻌﺎً ﻣﻌﮫ‪ .‬وأن ﻻ‬ ‫ﯾﻜﻮن ﻗﺪ أﺣﺪث ﺗﺪاﺧﻼً ﻓﻲ وﺳﻮم أﻓﻜﺎرك‪ .‬أراك ﻓﻲ اﻟﺪرس اﻟﺘﺎﻟﻲ‪.‬‬ ‫‪48‬‬

www.dinaro.com/vb3

‫أﻟﯿﺲ ھﺬا‬ ‫ﻣﻤﺘﻌﺎ‬ !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!! HHHHHHHHHHHHHH HHHHHHHHHHHHHH HHHHHHHHHHHHHH HHHHHHHHHHHHHH HHHHHH 49

‫‪www.dinaro.com/vb3‬‬

‫ﺍﻟﺪﺭﺱ ﺍﻟﺮﺍﺑﻊ‬

‫‪‬‬ ‫أھﻼً وﺳﮭﻼً ﺑﻚ إﻟﻰ اﻟﺪرس اﻟﺮاﺑﻊ ﻣﻦ ﻛﺘﺎب ﺗﻌﻠﻢ ‪.HTML‬‬ ‫ﻓﻲ ھﺬا اﻟﺪرس ﺳﻮف ﻧﻨﺎﻗﺶ اﻟﻮﺳﻮم اﻟﺨﺎﺻﺔ ﺑﺎﻟﻔﻘﺮات ﺑﺸﻜﻞ ﺧﺎص وﺗﺮﺗﯿﺐ اﻟﺼﻔﺤﺎت‬ ‫وﺗﻨﺴﯿﻘﮭﺎ ﺑﺸﻜﻞ ﻋﺎم‪.‬‬ ‫ﺻﺤﯿﺢ أن اﺳﺘﺨﺪاﻣﻚ ﻟﻸﻟﻮان واﻟﺮﺳﻮﻣﺎت ﻓﻲ اﻟﺼﻔﺤﺔ ﯾﻀﻔﻲ ﻋﻠﯿﮭﺎ ﻧﻮﻋﺎً ﻣﻦ اﻟﺤﯿﻮﯾﺔ‪،‬‬ ‫وأن اﻟﺨﻄﻮط ﺗﻌﻄﻲ ﺻﻔﺤﺘﻚ روﻧﻘﺎً وﺟﻤﺎﻻً‪ .‬ﻟﻜﻨﻚ إن ﻟﻢ ﺗﮭﺘﻢ ﺑﺘﺮﺗﯿﺐ ﺻﻔﺤﺘﻚ أو ﺗﻘﻀﻲ‬ ‫ﺑﻌﺾ اﻟﻮﻗﺖ ﻓﻲ ﺗﻨﺴﯿﻖ ھﯿﻜﻠﮭﺎ اﻟﻌﺎم وﺗﻨﻈﯿﻢ ﻓﻘﺮاﺗﮭﺎ وﻗﻮاﺋﻤﮭﺎ‪ ،‬ﻓﺈﻧﮫ ﻣﻦ اﻟﺼﻌﺐ ﻋﻠﯿﻚ‬ ‫اﻟﺤﺼﻮل ﻋﻠﻰ ﺻﻔﺤﺔ وﯾﺐ ﻧﺎﺟﺤﺔ‪ .‬ﻓﺎﻟﺘﺮﺗﯿﺐ ھﻮ اﻟﺨﻄﻮة اﻷوﻟﻰ ﻟﺠﺬب اھﺘﻤﺎم اﻟﺰاﺋﺮ أو‬ ‫اﻟﻘﺎرئ ﻟﺼﻔﺤﺘﻚ وﺗﺴﮭﻞ ﻋﻠﯿﮫ ﻓﮭﻢ اﻟﺨﻄﻮط اﻟﻌﺮﯾﻀﺔ ﻟﻠﺼﻔﺤﺔ‪.‬‬ ‫ﻟﻘﺪ ﻗﻤﺖ ﻓﻲ اﻟﺪرس اﻷول ﺑﺈﯾﻀﺎح ﺑﻌﺾ اﻟﻮﺳﻮم اﻟﺨﺎﺻﺔ ﺑﺎﻟﻔﻘﺮات‪ .‬وﻻ ﺑﺄس ﻣﻦ ﺗﺬﻛﯿﺮك‬ ‫ﺑﮭﺎ‪ .‬ﻓﺎﻟﻮﺳﻢ >‪ ‪ ‫ﻟﻘﺪ ﻗﻠﺖ إن اﻟﻮﺳﻢ‬ ‫< وﻓﻲ ھﺬه اﻟﺤﺎﻟﺔ ﯾﻤﻜّﻨﻨﺎ ﻣﻦ ﺗﺤﺪﯾﺪ إﺗﺠﺎه اﻟﻔﻘﺮة وإﺗﺠﺎه اﻟﻨﺺ ﻓﯿﮭﺎ ﺣﯿﺚ ﯾﺴﺘﺨﺪم‬/P> .DIR ،ALIGN ‫ﻣﻌﮫ اﻟﺨﺼﺎﺋﺺ‬

Center, Right ،Left ‫ ﺗﺤﺪد ﻣﺤﺎذاة اﻟﻔﻘﺮة وھﻲ ﺗﺄﺧﺬ اﻟﻘﯿﻢ‬ALIGN ‫ﻓﺎﻟﺨﺎﺻﯿﺔ‬ :‫وأوﺿﺤﮭﺎ ﺑﺎﻷﻣﺜﻠﺔ اﻟﺘﺎﻟﯿﺔ‬

This is a left-aligned paragraph

This is left-aligned paragraph

This is right-aligned paragraph

This is a right-aligned paragraph

This is a centered paragraph

This is a centered paragraph

‫ﻛﺬﻟﻚ ﻟﺘﻮﺳﯿﻂ اﻟﻔﻘﺮات أو اﻟﻜﺎﺋﻨﺎت ﺑﺸﻜﻞ ﻋﺎم ﻓﻲ اﻟﺼﻔﺤﺔ ﻧﺴﺘﻄﯿﻊ اﺳﺘﺨﺪام اﻟﻮﺳﻮم‬ ...

This is a centered text This is a centered text 51

‫‪www.dinaro.com/vb3‬‬

‫أﻣﺎ اﻟﺨﺎﺻﯿﺔ ‪ DIR‬واﻟﺘﻲ ﻧﺴﺘﺨﺪﻣﮭﺎ أﯾﻀﺎً ﻣﻊ >‪ ‪ ... ‪ ... ‪‪‪‪‪.‪ ... ‪ ... ‪ ... ‪ ‪‪‪‪‪‪‪‪‪‪‪‪‪‪‪ ‪ ‪ "‪

‪ ... ‪DINARO1.gif" BORDER="0">‪DINARO1.gif" BORDER="7">‪Main Page‪BORDER="0">‪ ‪ ... ‪LINKS‪LINKS‪3rd Paragraph"‪