HTML

18
Танилцуулга Шинэ зууны амьдралын хэв маягыг тодорхойлох болсон интернэт дээр єєрийн гэсэн орон зайгаа бататгах тань туслах нь манай хуудасны гол зорилго болноТаныг НТМL код буюу вэбийг їїсгэх гол хэлийг мэднэ гэж би таамаглаж байна. Хэрвээ мэдэхгїй бол та яг зєв газраа одоо ирээчихээд байна. Энэ хуудас эхлэн суралцагчаас дунд зэргийн мэдлэгтэй вэб мастѐруудад тохиромжтой. Мэргэжлийн вэб мастѐруудад бол зїгээр давталга маягаар ашиглахад хэрэг болж болох юм. Элдэв янзын санаа нийлэхгїй зїйл тааралдваас намайг уучлаарай , би хїн болгоны санаанд хїрсэн бїтээл хийж чадахгїй нь ойлгомжтой. Илт буруу мэт бол надтай холбоо тогтооно уу. Асуулт , санал хїсэлт, зєвлємж мэтийн таны зїгээс ирэх їйлдэлд тухай бїрд нь хариу єгч байхыг хичээх болно. Энэ хуудас голчлон вэбдизайн болон праграмчлалтай холбоотой асуудалд анхаарах болно. Хэрэгтэй мэдээллээ олоход тань, олон хїний зорчих дуртай вэб хуудас хийхэд тань амжилт хїсье. Вэбдизайн гэж юувэ? Вэб дизайны талаар хїмїїс олон ондоо бодолтой байдаг. Бараг хїн бїрт ямар нэг энэ талаар ойлголт байвч яг ийм тийм гээд тодорхойлоход тєвєгтэй сэдэв бол вэбдизайн. Гэхдээ ихэнх вэб мастерууд Мэдээлэл, Технологи, Їзэмж, Зорилго гэсэн 4гол хэсгїїд вэбийн їндэс болдог гэж їздэг. Тэгэхээр нэг бїрээр нь задлаад їзье. 1.Мэдээлэл - хэрэглэгчийг єєртєє татах, тэдний хэрэгцээг хангах. 2. Технологи - вэбийн дотоод їйл ажилгааг хурдан, шуурхай найдвартай байлгах. 3. Їзэмж - вэбийн гадаад дїр тєрх. 4. Зорилго - ашиг олох. гэсэн хэсгїїдээс бїтнэ. Гэхдээ тухайн вэб хуудасны зорилгоос хамаараад эдгээр хэсгїїдийн тухайн вэб хуудсанд эзлэх байр суурь нь харилцан адилгїй байдаг. Хэрэглэгчдийн вэб-г ашиглахын цаад зорилго нь вэбмастертай ижил ашиг олох байдаг. Иймээс тэд вэбийн мэдээллийг ашиглан амжилтад хїрдэг. Вэбмастерийн хувьд бол мэдээллийг цаг алдалгїй хуудаст оруулж байх нь гол їїрэг. Товчхондоо бол мэдээллийн солилцоо гэсэн гол асуудал байдаг. Гэтэл яагаад вэбдизайнд Технологи ба Їзэмж хэрэгтэй вэ гэсэн асуудал гарч ирнэ. Сайн технологийн тусламжтайгаар вэбмастер мэдээллээ хуудаст цаг алдалгїй оруулах боломжтой болдог. Харин їзэмж бол цэвэр хэрэглэгчийн нїдийг хуурах, сэтгэлийг татах зорилготой байдаг. Энэ 4гол хэсгийг хэрхэн зєв тохируулж чадсанаараа вэб хуудас амжилтад хїрдэг. Хэрвээ аль нэгийг нь орхигдуулбал тэгээд тэр хуудаст мєхєхєєс ондоо зам байдаггїй. Вэбдизайны хєдєлмєр 4ондоо чиглэлийн зїйлийг нэгтгэж байдаг тул хялбар зїйл биш гэдэгтэй та санал нийлэх биз дээ. Зохион байгуулалт Вэбийг барьж эхлэхээсээ ємнє зарим зїйлїїдийг урьдчилан хийх буюу шийдвэрлэх шаардлагатай байдаг.Юуны тїрїїнд ямар технологи хэрэглэх асуудал байдаг. Ямарч байсан одоогоор тїгээмэл байгаа 2 ондоо тєрлийн вэб бїтцийг харъя.Идэвхитэй, идэвхигїй гэж байдаг . Эдгээрийн хооронд асар их ялгаа бий. Анх вэб 1990-ээд онд їїсэж байхад "Static " вэбїїд их элбэг байсан нь хийхэд цаг авдаггїй. Хялбар энгийн бїтэцтэй байв. Яваандаа вэбмастерууд мэдээллийг тусгай кодын тусламжтайгаар агшин зуурт шинэчилж болох тэхнологийг ашиглах болсноор вэбийн амьдралд "Dynamic" гэгдэх ойлгоход арай тєвєгтэй ч їр дїн сайтай шинэ арга барил хэрэглэгдэх боллоо. "Dynamic " вэб хийхэд тохиолдох саад бэрхшээл элбэг, зам бартаатай. Хамгийн гол проблем нь таны вэбсэрвер технологийн дээд тївшинд, орчин їеийн вэбийн шаардлагыг хангасан байх ѐстой. Хэрвээ энэ асуудал шийдэгдсэн нєхцєлд таны НТМl хэлний мэдлэг бас л гологдох болно. Иймээс бас л нэг праграммчлалын хэл сурах хэрэгтэй болно. Цоо шинэ ертєнц ажиллах арга барил шаардана. Ер нь їнэтэй тусна гэдгийг ойлгоход хангалттай. Static вэбийг хийхэд голчлон хямд тусдаг. Учир нь тусгай технологи болон техникийн зардал бараг шаарддаггїй. Нэг интернэттэй жирийн РС тэгээд нэг юм бичдэг программ ( word. Notepad гэх мэт) бас жаахан НТМl хэл мэддэг байхад л гїйцээ. Энэ тєрлийн вэб нь ихэвчлэн эхлэн сонирхогчдоор хийгдсэн байдаг. Хамрах цар хїрээ нь бага бєгєєд мэдээллийн шинэчлэл сайндаа www.zaluu.com www.zaluu.com

Transcript of HTML

www.zaluu.com www.zaluu.com L . . . . , . . , , . . , . ? . . , , , 4 . . 1. - , . 2. - , . 3. - . 4. - . . . - . . . . . . , . 4 . . 4 . . . 2 ., . . 1990- "Static " . . "Dynamic" . "Dynamic " , . , . l . . . . Static . . (word. Notepad ) l . .

www.zaluu.com www.zaluu.com 2 3 . "Static" . "Dynamic" . "Dynamic" . . "Static" . "Static" . "Static" "Dynamic" . . .

(link ) 2 HTML , , . . . - . . 2 . 1. 2. 30.70 20.80- . , . . . 1

. . . . , . ( ) . HTML , . , "Under Construction" " " . "Static" . . , , . . . HTML . . DREAMWEAVER ADOBEGOLIVE MS FRONTPADE HTML . . . (, , ) .

2- HTML

www.zaluu.com www.zaluu.com . 2- . . HTML Java Script HTML . "Dynamic" ASP,CFML,PHP,JSP,PERL,PYTHON, . HTML - HTML - . HTML . HTML - . " " . 2- HTML

HTML- HTML "Hyper Text Markup Languaga" . "Markup Languaga" "" ( ) . HTML " " . . . . . , , , . , . . . . . . . , , . . , . . , . 10.20 - , . . . .

4 , , . , . . , . 4 . 2 "Static" " Dynamic" . "Static" "Dynamic"

www.zaluu.com www.zaluu.com , . . "Static" "Dynamic" . 2 . . . HTML 2 . " " . . . , 10-20 , . .

-1 . (HTML)-HTML . (HEAD)- . (TITLE)- . (BODY) - "" . . (HTML) (BODY) HTML Tag HTML . HTML- . (center) ,( dody ) . . (/ CENTER) , (/ Dody) , 2 . - . "View Source" . . . HTML . . .

www.zaluu.com www.zaluu.com . (Windows- otepad 8 Macintosh - Simple Text . . HTML , , - . . . . Desktop , anhniih . html . (Microsoft IE Netscape) "File" "Open" . "Browse" anhniih.html - . . 3 . " " . "" " ? " . "Address" C/WINDOWS/DESKTOP/anhniih.html URL- . URI http// . , . . URL - (Uniform Resource Locator - ) - HTML - . . Internet Explorer, Netscape 2 . Desktop - Notepad - - "HTML" . . - FILE- OPEN .

-1 . . . (b) (/b) . (b) (/b) - . . (b)- (I) - . (i) (I) . =>

. HTMLTAG "ENTER" . HTML . (bi)TAG- .

www.zaluu.com www.zaluu.com(bi) (bi) . . .. 2 . (b)(u) (u)(/b) - (b)(u) (/b)(/u) .

.

TAG (br). (/br) (p)TAG- TAG (p) (p)TAG- . . . (br)TAG- (p)tag- . 2(br)= 1(p) HTML- www.Asuult.net Mongoliansky.com .

-2 , , (FONT COLOR =RED ) (/FONT) - (FONT SIZE=4 ) (/FONT)

. (body text)=" " . browser - 3 . . (font size=+4) (font size=-2) . . browsir - 3 . (font size=+4 ) (font size =-2) . 2 . 1. . ( ol ) ( li ) ( li ) ( li )

www.zaluu.com www.zaluu.com(/ui ) 1. 2. 3. . 2.. (ul) (li) (li) (li) (/ui) . . ------------------------------------ . "anchor tag " ()((a href="URL")..(/a ) - 3 , , . (div aligh = " left") (/div) (div ahign="center") (/div) T CSS(Cascading Style Sheet) . BODY ( font 10.pt Font - family . Serif , Color . black Background . white) P (text . internet . 0.5pn Margin -right 50 px Margin -left 50 px ) TEXT CSS . (html)(head) (title )STYLE SHEET (/title) (Link rel= "stylesheet "href= text.css =type="text/css" (body) (body) (/html) . CSS 3- 100- . 2 . 1.Netscape CSS - . Internet Explorer . 2. . 2- . 3 . CSS (href = "text css")

www.zaluu.com www.zaluu.com , . HTML . ( STYLE TYPE="text css") (.. .. ...) (/STYLE) (/HEAD)

, . MOSAIC . (IMG SRC +ZURAG ) 2 . 1.JPEG JPG 2.PNG GIF , . . . 1. 2. (GIF gif ) 3. . . 4. BITMAP (JPG ) , . (VECTR ) 5. , . 6. (animatian) , . 7. . 5 . ,HTML 10 - 5 . " " . 100% . . . 1. Commpression 2. , 3. , . 4. , . . . .

www.zaluu.com www.zaluu.com ICON . ICO . . MICROANGELO . FAQ- 1- v v. , 90% . . mongoliatown.com T v . v. . :

www.zaluu.com www.zaluu.com. - .

vv v . 1- v . 2- .

v

HTML o Table v . v v "" , v "" . v v .. . v v : v : v vvv vv : 3 , 2 v v: A1 B1 C1 A2 B2 C2

v v : v vv vv (A1) v vv A1 v (A2) v vv A2 v 2 vv 2 v 1 vv B1 v B2 v vv B2 v vv 3 v C1vv C1 v C2 v vv

www.zaluu.com www.zaluu.com C2 v v

vv v v ( border ) . v v border ="" . "" v v v v border = 0 . v border=5 v: 1 1 1 2 2 2 .

v v bgcolor . : A1 B1 C1 A2 B2 C2

v v v . ( ) v vv : : (Yv "width" , "height" ) Cellpadding vv "cellpadding" vvv v ( ) . : A1 A2 B1 B2 C C2 A1 A2 B1 B2 C1 C2

www.zaluu.com www.zaluu.comCellspacing "ellspacing" vvv ( ) . . A1 B1 C1 A2 B2 C2

A1 B1 C1 A2 B2 C2

v . : 1- 2- A B C D :

www.zaluu.com www.zaluu.com1- A C , 2- B D v

vv v v v ( ) vv vv . , , : (vv, , ) align :(left, center, right) : ( , , ) valign : (top, center, bottom) : v v , . Cell Spanning v cell spanning . Yv : v .

, vv . : v 2 v 1 A B C font size="2"> v 1 v 2

www.zaluu.com www.zaluu.com v B C D 2 A

2A c

b d

v v , , vv, v vv .

"" "Frame"- . v v . HTML . . v . , . 20% -

80% -

vv HTML v .

www.zaluu.com www.zaluu.com . HTML :

2 20% - 80% . :

50%

40%

. vv " * " v . , , 100 , 50 v v . : 150 Y v

. "frame src" v HTML vvv . :

www.zaluu.com www.zaluu.com

v.

2 150 "menu.htm"- , "main1.htm"- vvv .

. Yv "name" "frame src" . p v a : : "" . , Y HTML "frameset" .htm .html . HTML frameset . Scroll bar, Border v v "scrollbar"- v v ( ) "frame src" "scrolling=no" . : v v v "frameborder=0" . marginwidth="", marginheight="" . "frame src" . ? : :

www.zaluu.com www.zaluu.com Frame Test v () vv 4 vv ,