تعلم html [PDF]

Citation preview

---

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‬ﻴﺒﺩﺃ ﺩﺍﺌﻤﺎﹰ ﺒﺎﻟﻭﺴﻡ >‪ ‪ .‪‪‪‪‪‪‪hello world !! ‪‪‪‪‪‪‪‪‪ ‪‪‪‪‪‪‪hello
world ‪‪‪ ‪‪‪‪‪‪‪hello

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



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