Contenu connexe
Similaire à web basic 3 (17)
Plus de Usukhuu Galaa (20)
web basic 3
- 1. LOGO
ВЭБИЙН ҮНДЭС
Лекц – 3
Багш: Г.Өсөхжаргал
- 3. ОБЪЕКТЫГ ХӨДӨЛГӨӨНД ОРУУЛАХ
<marquee> tag-ийн тусламжтайгаар ямар нэг
зүйлийг хөдөлгөөнд оруулна.
<marquee behavior= direction= bgcolor= height=
width= hspace= vspace= loop= scrollamount=
scrolldelay= > гэсэн шинж чанаруудтай.
- 4. ОБЪЕКТЫГ ХӨДӨЛГӨӨНД ОРУУЛАХ
Behavior – яаж хөдлөхийг нь заана
Scroll – текст нь хугарна
Alternate – текст нь ойно.
Slide – Хөдөлгөөнд оруулж буй текст нь нэг
удаа гүйгээд зогсоно.
- 5. ОБЪЕКТЫГ ХӨДӨЛГӨӨНД ОРУУЛАХ
Direction – Хаанаас хаашаа хөдлөхийг
заана
Left – баруунаас зүүн тийш хөдлөнө
Right – зүүнээс баруун тийш хөдлөнө.
Up – дээшээ гүйнэ
Down – доошоо гүйнэ.
- 6. ОБЪЕКТЫГ ХӨДӨЛГӨӨНД ОРУУЛАХ
Bgcolor – хөдөлгөөн оруулж буй объектын дэвсгэр
өнгийг тодорхойлно.
Height - өндөр
Width - өргөн
Hspace – хөндлөн тэнхлэгийн хувьд урдаас авах зай
Vspace – босоо тэнхлэгийн хувьд дээрээс авах зай
<marquee > Текст эсвэл зураг </marquee>
- 7. ОБЪЕКТЫГ ХӨДӨЛГӨӨНД ОРУУЛАХ
Loop - хөдөн удаа давтахыг заана.
-1
Infinite хязгааргүй давтана гэсэн үг.
Loop шинж чанарыг бичиж өгөөгүй тохиолдолд мөн
хязгааргүй давтана.
Scrollamount – урагшаа шилжихдээ хэд гэсэн зайгаар
шилжихийг тодорхойлно.
Scrolldelay – хэр зэрэг хурдан шилжихийг
тодорхойно.
- 8. ОБЪЕКТЫГ ХӨДӨЛГӨӨНД ОРУУЛАХ
<Font color= face= size= >
Color – текстийн өнгө
Face – фонтны нэр /verdena, times new
roman/
Size – хэмжээг тодорхойлно.
• Size=“2”
• Size=“+2”
• Size=“-2”
- 9. IMAGE MAP ҮҮСГЭХ
Зургийг тэр чигээр нь холболт болгохоос гадна
зургийн нэг хэсгийг таслаж холболт хийж
болно. Вэб сайтад image map-ийг
байрлуулснаар хэрэглэгчид зургийн ялгаатай
хэсгүүдэд дарж ялгаатай вэб хуудсуудруу орох
боломжтой. Учир нь HotZone бүр URL –тэй
холбогдсон байдаг ба HotZone бүр графикийн
хэсэгт харъяалагдана.
- 10. IMAGE MAP ҮҮСГЭХ
Хэрэглэгч Вэб хуудсан дээрх Image map –ийн
хэсэг дээр дарахад Browser түүний
координатыг тодорхойлж хэрэглэгч аль Hot
Zone –д дарсныг тодорхойлно.
- 11. IMAGE MAP ҮҮСГЭХ
Hot Zone –ийн хэлбэрүүд
Rect – rectangle буюу тэгш өнцөгт үүсгэх
Rect (X, Y, X1, Y1) x, y- нь эхлэлийн цэг, x1,y1 –нь
төгсгөлийн цэг
Circle – дугуй Circle(x, y, r)
Poly – Polygon буюу олон өнцөгт үүсгэнэ.
Poly(X, Y, X1, Y1, X2, Y2 . . .. . . . . . . Xn, Yn)
энэ нь хамгийн ихдээ 100 цэгийг холбоно.
- 12. IMAGE MAP ҮҮСГЭХ
<map> tag-ийн тусламжтайгаар Imagemap-ийг
үүсгэнэ. /container tag/
<area> tag-ийн тусламжтайгаар зургийг хуваана.
<area> tag-ийн /empty tag/
Shape – шинж чанарт ямар хэсгээр холболт
хийхийг заана
Coords – шинж чанарт координатыг зааж өгнө
Alt – энд зураг дээр гарах тайлбарыг зааж өгнө
- 13. IMAGE MAP ҮҮСГЭХ
<img src=“url” width=400 heigth=400
usemap=“#ImageMapid”>
<map id=“ImageMapid”>
<area shape=“rect” coords=“0,0,150,100”
alt=“song” href=“song.html”>
<area shape=“circle” coords=“100,100,50”
alt=“dance” href=“dance.html”>
</map>
- 14. Жишээ: first.html
<html>
<head> <title> Web page </title> </head>
<body>
<a href=“#section1”> begin section1 </a><br>
<img src=“url” alt=“my name is…”>
<a href=“index.html”> Go to another page</a>
<a href=“*.jpg”><img src=“url”></a>
Text………
<a name=“section1”> begin section1 </a>
</body>
</html>
- 15. Жишээ: Index.html
<html>
<head> <title> Welcome to my web page </title>
<base target=“_blank”> </head>
<body width=600 height=800>
<p><h2><i> Today is my birthday </i> </h2> </p> <br>
<p><b><i>My birthday plan</i></b></p>
<ul>
<li><a href=“song.html”> go to song</a>
<li><a href=“dance.html”> go to dance</a>
<li> Contest
<li> Reception </ul>
- 16. Жишээ: Index.html
<img src=“url” alt=“It’s Birthday picture”>
<a href=“*.jpg” alt=“it’s big picture” >
<img src=“url” alt=“it’s small picture” height=300
width=200></a>
</body>
</html>
- 17. Хүснэгт үүсгэх
Хүснэгтийг <table> кодчилолоор
тодорхойлогддог ба мөрүүдээ бүрдэнэ. Мөрийг
<tr> кодчилолоор тодорхойлно. Мөр бүхэн
өгөгдөл агуулах хэсгүүдээс тогтоно. Үүнийг <td>
кодчилолоор тодорхойлно. Энэ хэсэгт текст зураг
гэх мэт бүх төрлийн өгөглийг оруулж болно.
- 19. Хүснэгт үүсгэх
<table border=1>
<tr> <td> A </td> <td> A </td> </tr>
<tr> <td> A </td> <td> A </td> </tr>
</table>
Хүснэгтийн хүрээг харагдуулахыг тулд border
шинж чанарт утга өгнө. Border
тодорхойлогдоогүй эсвэл 0 гэж утга өгсөн
байвал хүснэгт хүрээгүй харагдана.
- 20. Хүснэгт үүсгэх
Хүснэгтийн толгойг <th> кодчилолоор
тодорхойлно.
<html> <body>
<table border=1>
<tr> <th> head text </th> <th> head text</th> </tr>
<tr> <td> text </td> <td> text</td> </tr>
</table>
- 21. Хүснэгт үүсгэх
<table> tag-ийн шинж чанар
Align – хүснэгтийн байрлалыг тодорхойлно.
Border – хүснэгтийн хүрээний өргөн
Bgcolor – хүснэгтийн дэвсгэр өнгө
Background – хүснэгтийн ард дэвсгэр зураг оруулах
Width – хүснэгтийн өргөн
Height – хүснэгтийн өндөр
- 22. Хүснэгт үүсгэх
• Frame
• Void – гаднах хүрээг харагдуулахгүй
• Above – дээд хүрээг харуулна
• Below – доод хүрээг харуулна
• Hsides – хөндлөн шугамууд харуулна
• Vsides – босоо шугамууд харуулна
• Lhs – зүүн шугамыг харуулна
• Rls – баруун шугамыг харуулна.
• Box – бүх хуудсыг харуулна.
- 23. Хүснэгт үүсгэх
• Rules
• None – дотор шугамуудыг харуулахгүй
• Rows – хөндлөн шугамуудыг харуулна
• Cols – баганын шугамуудыг харуулна
• All – бүх шугамыг харуулна.
Cellspacing – хүснэгтийн нүд хоорондын зай
Cellpadding – хүснэгт дэх өгөгдөл
- 24. Хүснэгт үүсгэх
<tr> tag-ийн шинж чанарууд
Align – тухайн мөрийн өгөгдлийн байрлал
Bgcolor – мөрийн дэвсгэр өнгө
Height – мөрийн өндөр
Valign – тухан мөрөн дэх өгөгдлийн босоо
тэнхлэгийн байрлал
- 25. Хүснэгт үүсгэх
<th> <td> tag-ийн шинж чанарууд
Align – тухайн нүдэн дэх өгөгдлийн байрлал
Valign – тухан нүдэн дэх өгөгдлийн босоо
тэнхлэгийн байрлал
Bgcolor – нүдний дэвсгэр өнгө
Background – Нүдний дэвсгэр зураг
Width – баганын өргөн
Colspan – нэгтгэх баганын тоо
Rowspan – нэгтгэх мөрийн тоо
- 27. Хүснэгт үүсгэх
<table width="200" border="1">
<tr>
<td>A</td> <td rowspan="2">A</td> <td>A</td> </tr>
<tr>
<td rowspan="2“>A</td> <td>A</td> </tr>
<tr>
<td>A</td>
<td>A</td>
</tr>
</table>