1 / 19

بسم الله الرحمن الرحيم کارگاه طراحی صفحات وب

بسم الله الرحمن الرحيم کارگاه طراحی صفحات وب. html. جلسه دوم. مروری بر جلسه پیش. 2. HTML 4 تگهای اصلی html صفت تگ معرفی چند تگ تگهای heading تگ hr تگ br تگ p. تصویر. < img src =“gol.jpg " width="104" height ="142" >. 3.

baxter
Download Presentation

بسم الله الرحمن الرحيم کارگاه طراحی صفحات وب

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. بسم الله الرحمن الرحيمکارگاه طراحی صفحات وب html جلسه دوم

  2. مروری بر جلسه پیش 2 html • HTML 4 • تگهای اصلی html • صفت تگ • معرفی چند تگ • تگهای heading • تگ hr • تگ br • تگ p

  3. تصویر <imgsrc=“gol.jpg" width="104" height="142" > 3 html برای قرار دادن تصویر درون صفحه وب از تگ img استفاده می‌شود. تگ <img> تگ پایانی ندارد. نام فايل، پهنا و ارتفاع تصوير به ترتيب توسط صفات src،widthوheight تعيين می‌شوند. مقدار پهنا و ارتفاع با واحد پیکسل می‌باشد. چنانچه، فایل تصویر کنار فایل html باشد ذکر نام و پسوند آن در مقدار صفت src کافی است. در غیر این صورت باید آدرس فایل تصویر به طور کامل درsrc قرار داده شود.

  4. آدرس دهی <imgsrc=“golha/gol.jpg" > <imgsrc=“file:///D:/ax/golha/gol.jpg" > 4 html چنانچه تصویر در پوشه‌ای کنار فایل html شما باشد، آدرس تصویر شامل نام همان پوشه و سپس نام فایل است. چنانچه تصویر در یک مسیر کاملا متفاوت باشد مثلا در یک درایو جدا باشد، آدرس تصویر باید به صورت زیر نوشته شود:

  5. صفات مورد استفاده برای تصویر مثال <imgsrc=“golha/gol.jpg" align = “right” title = “flower” alt = “this is a picture that shows beautiful flowers” border = “3” height = “220” width = “150”> 5 html

  6. پیوند <a href = “http://www.shafieh-uast.ir”> دانشگاه شفیعه </a> دانشگاه شفیعه 6 html قدرت صفحات وب در پيوند مستندات به يکديگر است. برای پيوند به سند ديگری در وب ازhyperlink استفاده می‌شود. هايپرلينک‌ها کلمات زيرخط‌داری هستند که وقتی روی آن کليک می‌کنيد شما را به صفحه ديگر يا قسمت ديگری در همان صفحه می برند. انواع پيوندها توسط تگ <a> تعريف می‌شود. a مخففanchor به معنی پیوند است. آدرس مقصد توسط صفتhref مشخص می‌شود.href مخفف hyper reference می‌باشد.

  7. قرار دادن یک تصویر به عنوان پیوند <a href = “http://www.shafieh-uast.ir”> <imgsrc= “my-picture.jpg”> </a> 7 html علاوه بر متن، یک تصویر هم می‌تواند به عنوان لینک قرار گیرد.

  8. پیوند به فایلی درون کامپیوتر <a href = “path/name.html”> صفحه من</a> <a href = “name.html”> صفحه من</a> 8 html اگر صفحه‌ای که قرار است به آن لینک دهید (صفحه مقصد) در مسیر path باشد، به صورت زیر می‌توانید به آن پیوند دهید: اگر صفحه مقصد در همان پوشه صفحه مبدا باشد، به صورت زیر می‌توانید به آن پیوند دهید:

  9. پیوند به یک قسمت از خود صفحه وب <a name=“flower”></a> <imgsrc = … > <a href=“#flower”> عکس گل بالای صفحه</a> 9 html در ابتدا باید از طریق صفت name در تگ a به قسمت مقصد یک نام اختصاص دهید. سپس برای پیوند به بخش نامگذاری شده از علامت # استفاده می‌شود.

  10. پیوند به یک قسمت از صفحه وب دیگر <a name= “good”> </a> <a href=“test.html#good”> text or image </a> 10 html در ابتدا باید از طریق صفت name در تگ a به قسمت مقصد یک نام اختصاص دهید. سپس برای پیوند به بخش نامگذاری شده از علامت # استفاده می‌شود.

  11. رنگ 11 html اسامی رنگها توسط اکثر مرورگرها برای تعيين مقدار رنگ پشتيبانی می‌شود. تنها شانزده رنگ در HTMLنسخه 4 درنظرگرفته شده است که عبارتند از: aqua,black,blue,fuchsia,gray,green,lime,maroon,navy,olive,purple,red,silver,teal,white ,yellow. رنگ می تواند با يک مقدار عددی بر مبنای شانزده برای ترکيب رنگهای قرمز، سبز و آبی هم تعيين شود. کد رنگ به صورت #rrggbb است. rr،gg و bb دو رقم hexبرای تعيين شدت رنگهای قرمز و سبز و آبی است. کمترين مقدار آن 00# و بيشترين مقدار آن #FF است.

  12. کدهای 16 رنگ تعریف شده 12 html

  13. تعیین رنگ 13 html در تگ bodyصفات زیر برای تعیین رنگ به کار می‌روند: صفت Text، رنگ تمام متن‌هايي که در صفحه وب موجودند را تعيين مي‌کند. در اين صورت مرورگر تمام متن‌ها را به اين رنگ نشان مي‌دهد، مگر اينکه نويسنده HTML رنگ ديگري را در قسمت‌هاي مختلف متن تنظيم نمايد.

  14. مثال برای تعیین رنگ <body bgcolor="#0000FF" text="#000000" link="#FFFF00" vlink="#FF0000“ alink=“#00FF00”> 14 html در مثال بالا، رنگ زمینه صفحه آبی، رنگ متون مشکی، رنگ لینکهای دیده نشده زرد، رنگ لینکهای دیده شده قرمز و رنگ لینکها به هنگام کلیک شدن، سبز است.

  15. صفات تگ پاراگراف 15 html • Dir: جهت نوشته شدن متن • LTR: left to right • RTL: right to left • Align: طرز قرار گرفتن متن در صفحه را مشخص مي‌کند: left، right و center. • Title: مقدارTitle به عنوان توضيح در مورد پاراگراف هنگامي که ماوس روي آن قرار مي‌گيرد، ظاهر مي‌شود.

  16. فرمت دهی کاراکترهای متن با تگها مثال <b> <i> <s> <u> hello, how are you </b> </i> </s> </u> 16 html

  17. صفات تگ HR مثال <HRcolor=“red” align = “center” size = “3” width = “50%” > 17 html

  18. صفات تگ font (برای مطالعه) مثال <FONT size=“2” face=“tahoma” color=“red”> text </FONT> 18 html این تگ در html5 وجود ندارد.

  19. متحرک نمودن بخشی از متن (برای مطالعه) 19 html <marquee> متن </marquee> متن بین این دو تگ، متحرک خواهد شد (این تگ منسوخ شده است). این تگ می‌تواند صفات زیر را داشته باشد: scroll: متن بصورت متناوب از يک‌طرف صفحه وارد و از طرف ديگر خارج مي‌شود. alternate: متن از صفحه خارج نمي‌شود و در عرض مرورگر حرکت مي‌کند. slide: متن از يک‌طرف وارد صفحه شده و در طرف ديگرمي‌ايستد.

More Related