лабораторийн ажил 3

1,382 views

Published on


  • hey tataj abah gesiin

    <b>[Comment posted from</b> http://www.csms.edu.mn/cs212/index.php?option=com_content&view=article&id=79:-3&catid=49:-3&Itemid=53]
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

лабораторийн ажил 3

  1. 1. Лабораторийн ажил 3<br />Зорилго: <br />HTML кодчиллын зураг ба тексттэй ажиллах tag-уудтай танилцаж, тэдгээрийг ашигласан жишээ бичиж ажиллуулах.<br />Бэлтгэл: <br />Ямар нэг текст боловсруулах програм нээх. (Notepad, UltraEdit32 г.м) <br />Гүйцэтгэх даалгавар <br />Доорх tag-уудын тайлбарыг уншиж, жишээг ажиллуулж танилцаад, бүгдийг нэг дор ашигласан жишээ бичиж үзүүлнэ.<br />1. Зураг ба текстийн байрлал<br /> a. <img> tag-ийн align шинж чанар<br />Bottom – текстийн хувьд доош зэрэгцүүлж байрлуулах(default утга)<br />Middle – текстийн хувьд голлуулж байрлуулах<br />Top – текстийн хувьд зургийн дээд хэсгийг зэрэгцүүлэх<br />Left – текстийн зүүн талд байрлуулах<br />Right – текстийн баруун талд байрлуулах<br />Жишээ, <br /> Текст дэх <br /> <img src =" 1.gif" align=" top" width=" 48" height=" 48" > <br /> зураг <br /> b. <img> tag-ийн vspace, hspace шинж чанар<br />Зүүн ба баруун зэрэгцүүлэлт ашиглах үед зураг ба текстийн хоорондох зайг тодорхойлоход ашиглагдана.<br />vspace – босоо тэнхлэгийн дагуу авах зай<br />hspace – баруун ба зүүн талаас авах зай<br />Жишээ:<br /><img src=" my_image.gif" width=79 height=142 <br /> vspace=8 hspace=12><br />2. Зурагтай ажиллах<br /><img> tag-ийн alt шинж чанар<br />Зураг дээр хулганы заагч байрлахад гарах текстийг энэ шинж чанарт тодорхойлж өгнө.<br />Жишээ,<br /><img src=" my_image.gif" alt=" My Image" width=79 <br /> height=142 vspace=8 hspace=12><br />border шинж чанар<br />Зурганд хүрээ тодорхойлоход ашиглагдана.<br /> Жишээ,<br /> <a href=" Lab2.html" > <br /> <img src=" left.gif" alt=" left" border=0> Link <br /> </a><br />border нь 0 утгатай бол зураг хүрээгүй байна. Хүрээний өнгө нь body tag-н text-д тодорхойлогдсон өнгөөр тодорхойлогдоно. Хэрэв холбоос хийгдсэн(link) зураг бол хүрээ нь link шинж чанарт тодорхойлогдсон өнгөтэй байна. <br />3. Зургийг хэсэгчлэн холболт хийх<br /> <br /><img src=" image.gif" usemap=" #map_name" ><br />usemap – ашиглах map-ийн нэрийг тодорхойлж өгнө. <br />Харин map-ийн зарлагаа нь дараах хэлбэрээр бичигдэнэ.<br /> <map name=" map_name" ><br /> <area shape=" rect" coords=" x1,y1,x2,y2" <br />hrEF=”www.csms.edu.mn”><br /> <area shape=" rect" coords=" x1,y1,x2,y2" <br />hrEF=”Main.html”><br /> :<br /> :<br /> </map><br /> <map> tag доторх мөр бүр нь холболт хийх талбайнуудыг тодорхойлж байдаг.<br />shape шинж чанарт холбоос хийх дүрсийн хэлбэрийг тодорхойлно. <br />rect – тэгш өнцөгт, <br />circle – тойрог гэх мэт. <br />cоords шинж чанарын х1, у1 нь талбайн зүүн дээд өнцгийн координат, х2,у2 нь баруун доод өнцгийн координатыг тус тус тодорхойлно. Харин тойрог бол тойргийн төв цэг, радиусын цэгүүдийг тодорхойлж өгнө.<br />href шинж чанарт холболт хийгдэх файл эсвэл интернетийн ямар нэгэн хаяг байна. <br />4. Текстийн зэрэгцүүлэлт<br /> Текстийн зэрэгцүүлэлтийг <div> tag ашиглан тодорхойлно.<br /> <div align=left>...</div> - зүүн зэрэгцүүлэлт<br /> <div align=right>...</div> - баруун зэрэгцүүлэлт<br /> <div align=center>...</div> - голлуулах<br />

×