ЎЗБЕКИСТОН АЛОҚА ВА АХБОРОТЛАШТИРИШ АГЕНТЛИГИ
ТОШКЕНТ АХБОРОТ ТЕХНОЛОГИЯЛАРИ УНИВЕРСИТЕТИ
бакалавриатуранинг 5523600 - «Электрон тижорат» йўналиши учун
“ВЕБ – ИЛОВАЛАРНИ ЯРАТИШ”
фанидан
лаборатория ишларини бажариш бўйича
УСЛУБИЙ КЎРСАТМАЛАР
Тошкент - 2012
“Веб – иловаларни яратиш” фанидан лаборатория ишларини бажариш
бўйича услубий кўрсатма
“Веб – иловаларни яратиш” фанидан лаборатория ишларини бажариш бўйича услубий кўрсатмалар кафедра мажлисида кўриб чиқилди ва тасдиқланди. (2012 йил 5 январь 17 - сонли баённома).
Тузувчилар: т.ф.д.,проф. Якубов М.С.,
катта ўқитувчи О.Н. Джураев
Услубий кўрсатма ТАТУ илмий-услубий кенгашида муҳокама қилинган
ва чоп этишга тавсия этилган 19 январ 2012 йил. Баённома № 46
Маъсул таҳрирчи: Умаров А.В.
Мухаррир: М.С.Якубов
Тақризчи: ТАТУ АТ кафедраси, т.ф.н. В.Каримова.
Мусаххих: О.Н.Джураев
МУНДАРИЖА
|
Кириш............................................................................................................... |
4 |
|
|
№
|
Тажриба иши номи |
бет |
|
1. |
Хужжат танасининг контейнерлари ва графикаларини тажрибада ишлатиш………............................................................................................ |
5 |
|
2. |
HTML-жадвал ва HTML-шаклларни тажрибада ишлатиш……………... |
9 |
|
3. |
Фреймларни тажрибада ишлатиш…………………..........……………… |
13 |
|
4. |
Браузер дарчаси хусусиятларини дастурлаш…………………………….. |
16 |
|
5. |
Шакллар ва графикларни дастурлаш……………………………………... |
19 |
|
6. |
Гиперматн ўтишларни дастурлаш………………………………………… |
23 |
|
7. |
Кадр орқасида дастурлаш……………………………………………….. |
26 |
|
8. |
Блокли ва сатрли элементларни тажрибада ишлатиш…………………... |
29 |
|
9. |
Ранг ва шрифт ҳамда матн ва руйхатларни тажрибада ишлатиш…… |
32 |
|
|
Адабиётлар …….....………………………………………………………... |
38 |
КИРИШ
Бу услубий кўрсатмаларнинг мақсади “Веб – иловаларни яратиш” фани бўйича ўтказилган маъруза дарсларидан олинган назарий билимларни мустаҳкамлаш ҳамда веб сайтларни яратиш бўйича амалий кўникмаларни ҳосил қилиш ва ошириш ҳисобланади.
Ушбу услубий кўрсатмаларда хужжат танасининг контейнерлари ва графикалари, HTML-жадваллар ва HTML-шакллар, фреймлар, блокли ва сатрли элементлар, ранг ва шрифт ҳамда матн ва руйхатларни тажрибада ишлатиш ҳамда браузер дарчаси хусусиятлари, шакллар ва графиклар, гиперматн ўтишлар, кадр орқасида дастурлаш масалалари бўйича тажриба ишлари амалга оширилади.
1 - Тажриба иши
Мавзу: Хужжат танасининг контейнерлари ва графикаларини тажрибада ишлатиш (2 соат)
Ишнинг мақсади:
Хужжат танасининг контейнерлари, <P> теги, <BIG> ва <SMALL> теглари, пастки ва юқорги индекслар, рўйхатлар, горизонтал чизиқ, гиперматнлар, графика, <IMG> теги, актив тасвирлар билан ишлаш амалий кўникмаларини ҳосил қилиш.
Зарурий назарий маълумотлар:
Хужжат танаси тегларининг тавсифини BODY тегидан бошлаш керак. BODY теги атрибутларга эга. BACKGROUND атрибути хужжат матни аксланадиган фонни аниқлайди. BGCOLOR атрибути фон рангини аниқлайди. TEXT атрибути матн рангини аниқлайди. LINK атрибути гиперматн рангини аниқлайди. ALINK атрибути актив гиперматн рангини аниқлайди, VLINK атрибути ташриф буюрилган гиперматннинг рангини аниқлайди.
<P> теги матнни параграфларга ажратиш учун ишлатилади. Унда ALIGN атрибути ишлатилади. ALIGN атрибути матнни теккислашга имкон беради. Сукут бўйича матн чап чегарадан теккисланади. Ушбу атрибут графика ва жадвалларга ҳам тегишли.
ALIGN=justify - матнни чап ва ўнг чегарадан теккислайди.
ALIGN=left – матнни чап чегара бўйича теккислайди.
ALIGN=right – матнни ўнг чегара бўйича теккислайди.
ALIGN=center – матнни марказга жойлаштиради.
<BIG> ва <SMALL> теглари ичида жойлашган матн мос равишда кичиклашади ёки катталашади.
Юқорги ва пастки индекслар. <SUP> ва <SUB> теглари ёрдамида юқорги ва пастки индексларни бериш мумкин.
HTML да рўйхатлар яратиш. HTMLда қуйидаги турдаги рўйхатлар мавжуд: рақамланмаган (Unordered Lists <UL), рақамланган (Ordered Lists <OL>) ва аниқланишлар рўйхати.
Рақамланмаган рўйхат - <UL> теги. Рақамланмаган рўйхатда TYPE атрибутини ишлатиш мумкин. TYPE атрибути DISK, CIRCLE ва SQUARE қийматларини қабул қилиши мумкин.
Рақамланган рўйхат - <OL> теги. Рақамланган рўйхатда TYPE атрибутини ишлатиш мумкин. TYPE атрибути 1, А, а, I қийматларини қабул қилиши мумкин.
Аниқланишлар рўйхати - <DL> теги. Аниқланишлар теги терминлар ва уларнинг аниқланишларини яратиш учун ишлатилади. Тегнинг ишлатилиш схемаси: <DL> <DT> Термин </DT> <DD> Аниқланиш </DD> </DL>
Горизонтал чизиқ - <HR> теги.
Гиперматнни яратиш учун <A> теги ишлатилади. <A> теги бир неча атрибутларга эга. Шулардан асосийси HREF атрибутидир.
<A HREF=http://www.tuit.uz> Тошкент ахборот технологиялари университети </A>
Веб саҳифага расм жойлаштириш учун <IMG> теги ишлатилади. <IMG> теги қуйидаги атрибутларга эга.
SRC атрибути. Тасвир файл ва унга йўлни кўрсатади.
ALT атрибути. Графикани кўрсата олмайдиган браузерларнинг расмлари ўрнига кўрсатилган матнни кўрсатади.
ALIGN атрибути. Тасвирнинг уни ўраб турган матнга нисбатан вазиятини кўрсатади.
BORDER атрибути. Аргументнинг бутун қиймати тасвир атрофидаги рамканинг қалинлигини аниқлайди. Агар қиймат 0 га тенг бўлса рамка мавжуд эмас.
HSPACE атрибути. Аргументнинг бутун қиймати тасвир ва саҳифанинг вертикал чегараси ҳамда тасвир ва матн орасидаги горизонтал масофани аниқлайди.
VSPACE атрибути. Аргументнинг бутун қиймати тасвир ва саҳифанинг горизонтал чегараси ҳамда тасвир ва матн орасидаги вертикал масофани аниқлайди.
WIDTH ва HEIGHT атрибутлари. Ушбу атрибутлар мос равишда тасвирнинг горизонтал ва вертикал ўлчамларини аниқлайди.
Назорат саволлари:
1. Веб узелни яратиш тамойиллари.
2. Тескари алоқа.
3. Тузилиш.
4. Логотип.
5. Навигация панели.
6. Графика.
7. Каналларнинг ўтказувчанлик қобилияти.
8. Саҳифаларни янгилаш усуллари.
9. HTML нинг яратилиш тарихи.
10. HTML–хужжатнинг структураси.
11. HEAD теги.
12. TITLE теги.
13. BASE теги.
14. META теги.
15. LINK теги.
16. SCRIPT теги.
17. Хужжат танасининг контейнерларлари.
18. ВОDY контейнери.
19. Сарлавхалар.
20. Р теги.
21. HTML да графикадан фойдаланиш.
22. График файлларнинг форматлари.
23. Актив тасвирлар.
Топшириқ вариантлари:
1. Кўк фонли, оқ матнли, яшил гепперматнли веб саҳифа яратинг.
2. Қизил фонли, кўк матнли, яшил гепперматнли веб саҳифа яратинг.
3. Сариқ фонли, яшил матнли, қизил гепперматнли веб саҳифа яратинг.
4. 3 та абзацли, 1-абзац чапдан, 2-абзац ўнгдан, 3-абзац ўртадан теккисланган веб саҳифа яратинг.
5. 4 та абзацли, 1-абзац ўнгдан, 2-абзац чапдан, 3-абзац ўртадан, 4-абзац кенглик бўйича теккисланган веб саҳифа яратинг.
6. Тасвири мавжуд веб саҳифа яратинг.
7. 3 та абзац горизонтал чизиқлар билан ажратилган веб саҳифа яратинг.
8. HEAD тегидан фойдаланиб веб саҳифа яратинг.
9. TITLE тегидан фойдаланиб веб саҳифа яратинг.
10. BASE тегидан фойдаланиб веб саҳифа яратинг.
11. META тегидан фойдаланиб веб саҳифа яратинг.
12. LINK тегидан фойдаланиб веб саҳифа яратинг.
13. SCRIPT тегидан фойдаланиб веб саҳифа яратинг.
14. WIDTH ва HEIGHT атрибутларидан фойдаланиб веб саҳифа яратинг.
15. HSPACE ва VSPACE атрибутларидан фойдаланиб веб саҳифа яратинг.
16. BORDER атрибутидан фойдаланиб веб саҳифа яратинг.
17. ALIGN атрибутидан фойдаланиб веб саҳифа яратинг.
18. Актив тасвирли веб саҳифа яратинг.
19. Эни 300 пиксел, бўйи 200 пиксел бўлган тасвирли веб саҳифа яратинг.
20. HSPACE, VSPACE, BORDER ва ALIGN атрибутларидан фойдаланиб веб саҳифа яратинг.
Ишни бажариш тартиби:
1. Ихтиёрий матн мухарририни очиш.
2. Унга HTML кодни киритиш.
3. Файлни .html ёки .htm кенгайтмаси билан сақлаш.
4. Файлни ишга тушириш.
5. Натижа кутилгандек бўлса қоғозда ва электрон кўринишда ҳисобот тайёрлаш.
2 - Тажриба иши
Мавзу: HTML-жадвал ва HTML-шаклларни тажрибада ишлатиш (2 соат)
Ишнинг мақсади:
HTML-жадвал, жадвал сатрлари, жадвал катакчалари, HTML-шакллар, <FORM> теги, <INPUT> теги, <SELECT> теглари билан ишлаш амалий кўникмаларини ҳосил қилиш.
Зарурий назарий маълумотлар:
Жадвалларни тавсифлаш учун <TABLE> теги ишлатилади.
Сатрни яратиш учун <TR> (Table Row) теги ишлатилади. Барча матн ва бошқа тегларни битта сатрга жойлаштирмоқчи бўлсангиз уларни <TR> </TR> теглари орасида жойлаштиринг.
Катакчани яратиш учун <TD> тегидан фойдаланилади. Ихтиёрий матн ёки тасвир битта катакчага жойлашиши учун <TD> </TD> теглари орасига жойлаштирилмоғи лозим.
COLSPAN (Column Span – устунларни бирлаштириш) атрибути сатрдаги устунларни бирлаштиради.
ROWSPAN (Row Span – сатрларни бирлаштиш) атрибути битта устунда жойлашган сатрларни бирлаштиради.
WIDTH атрибути. Ушбу атрибутни икки ҳолатда ишлатса бўлади. Биринчиси жадвалнинг энини ўрнатиш учун <TABLE> тегида ҳамда фақатгина битта сатрнинг энини ўрнатиш учун <TR> тегида. Энни пикселларда ёки фоизларда бериш мумкин.
CELLPADDING атрибути. Ушбу атрибут катакча чегараси билан унинг таркиби орасидаги масофани ўрнатади, яъни катакча ичидаги майдонни аниқлайди.
ALIGN ва VALIGN атрибутлари. Ушбу атрибутлар мос равишда горизонтал ёки вертикал бўйича теккислайди.
BORDER атрибути. <TABLE> тегида кўпинча жадвалнинг рамкаси қалинлигини BORDER атрибути ёрдамида аниқлаш мумкин.
CELLSPACING атрибути. Ушбу атрибут катакчалар орасидаги масофани пикселларда ўрнатади.
BGCOLOR атрибути. Ушбу атрибут жадвал фон рангини ўрнатади. У <TABLE>, <TR> ва <TD> теглари билан ишлатилиши мумкин.
BACKGROUND атрибути жадвал ёки катакчанинг фондаги тасвирини ўрнатади.
Шакллар фойдаланувчилар ҳақида маълумотлар йиғиш учун WWW да ишлатилади.
Шаклни ўрнатиш учун <FORM> теги ишлатилади. <FORM> теги таркибида <INPUT> ва <SELECT> тегларининг кетма-кетлиги жойлашган.
Шакл элементларини аниқлаш учун <INPUT> теги ишлатилади. Улар фойдаланувчи томонидан киритиладиган маълумотлар учун майдонларни шакллантиради. Бу матнли майдонча, опция, тасвир ёки тугма бўлиши мумкин. Майдоннинг кўриниши TYPE атрбути ёрдамида аниқланади.
TYPE=text атрибути. Қачонки фойдаланувчига матнли маълумот киритиш лозим бўлса, TYPE=text ёрдамида бир сатрли киритиш майдонини яратиш мумкин.
Масалан: <INPUT TYPE=”text” NAME=”Ism”>
TYPE=checkbox атрибути. Кўпинча фойдаланувчидан Ҳа ёки Йўқ кўринишидаги жавобни олиш керак бўлиб қолади. Мустақил белгилаш майдончаларини яратиш учун TYPE=checkbox атрибути ишлатилади.
TYPE=radio атрибути. Мустақил бўлмаган белгилаш майдончаларини яратиш учун TYPE=radio атрибути ишлатилади.
TYPE=password атрибути. Парол киритиш лозим бўлиб қолса TYPE=password атрибутидан фойдаланиш мумкин.
TYPE=reset атрибути. Ушбу атрибут бошланғич ҳолатга ўтказувчи тугма яратади.
TYPE=submit атрибути. Ушбу атрибут киритилган қийматларни қайта ишлайдиган тугмани яратади.
<TEXTAREA> теги кўп сатрли майдонни яратади. Ушбу тег 3 та атрибутга эга. MULTIPLE атрибути биттадан ортиқ қийматни танлаш имконини беради. NAME атрибути объект номини аниқлайди. SIZE атрибути рўйхатдаги кўринадиган пунктлар сонини аниқлайди.
<SELECT> теги ичида <OPTION> теги ишлатилади. Ушбу теги иккита атрибутга эга: SELECTED сукут бўйича элементнинг бошланғич қийматини аниқлайди. VALUE майдоннинг қийматини аниқлайди.
Назорат саволлари:
1. HTML да жадвал.
2. HTML да жадвалларни яратиш воситалари.
3. <ТАВLЕ> теги.
4. <ТR> теги.
5. <ТD> теги.
6. <ТН> теги.
7. <САРТIОN> теги.
8. СОLSPAN ва ROWSPAN атрибутлари.
9. СЕLLРАDDING ва CELLSPACING атрибутлари.
10. BGCOLOR ва BACKGROUND атрибутлари.
11. Сахифа дизайнида жадваллардан фойдаланиш.
12. HTML-шакллар.
13. FORM элементи.
14. <INPUT> элементи.
15. <SELECT> элементи.
16. <TEXTAREA> теги
Топшириқ вариантлари:
1. Кўк фонли жадвал яратинг.
2. Яшил фонли жадвал яратинг.
3. 3 устунли 4 сатрли жадвал яратинг.
4. 5 устунли 3 сатрли жадвал яратинг.
5. 2 устунли 4 сатрли жадвал яратинг. Биринчи устуни қизил, иккинчиси яшил.
6. WIDТН атрибутидан фойдаланиб жадвал яратинг.
7. АLIGN атрибутидан фойдаланиб жадвал яратинг.
8. VALIGN атрибутидан фойдаланиб жадвал яратинг.
9. BORDER атрибутидан фойдаланиб жадвал яратинг.
10. СОLSPAN атрибутидан фойдаланиб жадвал яратинг.
11. ROWSPAN атрибутидан фойдаланиб жадвал яратинг.
12. СЕLLРАDDING атрибутидан фойдаланиб жадвал яратинг.
13. CELLSPACING атрибутидан фойдаланиб жадвал яратинг.
14. BGCOLOR атрибутидан фойдаланиб жадвал яратинг.
15. BACKGROUND атрибутидан фойдаланиб жадвал яратинг.
16. TYPE=text бўлган ҳолдаги элемент яратинг.
17. TYPE=checkbox бўлган ҳолдаги элемент яратинг.
18. TYPE=radio бўлган ҳолдаги элемент яратинг.
19. TYPE=image бўлган ҳолдаги элемент яратинг.
20. TYPE=password бўлган ҳолдаги элемент яратинг.
21. TYPE=reset бўлган ҳолдаги элемент яратинг.
22. TYPE=submit бўлган ҳолдаги элемент яратинг.
23. <TEXTAREA> тегидан фойдаланиб элемент яратинг.
24. <SELECT> тегидан фойдаланиб элемент яратинг.
Ишни бажариш тартиби:
1. Ихтиёрий матн мухарририни очиш.
2. Унга HTML кодни киритиш.
3. Файлни .html ёки .htm кенгайтмаси билан сақлаш.
4. Файлни ишга тушириш.
5. Натижа кутилгандек бўлса қоғозда ва электрон кўринишда ҳисобот тайёрлаш.
3 – Тажриба иши
Мавзу: Фреймларни тажрибада ишлатиш (2 соат)
Ишнинг мақсади:
Бу тажриба ишининг асосий мақсади талабаларда фреймлар билан ишлаш амалий кўникмаларини ошириш ҳисобланади.
Зарурий назарий маълумотлар:
Фрейм бу расм атрофидаги рамка, дераза ёки саҳифа маъноларини англатади. Бир мисолни кўриб чиқсак фреймларни тушуниш осон бўлади.
1-мисол
<HTML>
<HEAD>
<TITLE>
Misol Freym </TITLE>
</HEAD>
<FRAMESET COLS=”25%, 75%”>
<FRAME SRC=”menu.html” name=”menu”>
<FRAME SRC=”main.html” name=”main”>
</FRAMESET>
</HTML>
2-мисол
<HTML>
<HEAD>
<TITLE>
Misol Freym </TITLE>
</HEAD>
<FRAMESET ROWS=”25%, 75%”>
<FRAME SRC=”menu.html” name=”menu”>
<FRAME SRC=”main.html” name=”main”>
</FRAMESET>
</HTML>
ROWS атрибути сатрлар ўлчами ва сонини аниқлайди.
COLS атрибути устунлар ўлчами ва сонини аниқлайди.
FRAME теги фрейм таркибини аниқлайди. Унда 6 та атрибут мавжуд.
NAME атрибути фрейм номини аниқлайди.
MARGINWIDTH атрибути жадваллардаги CELLPADDING каби ишлайди. У фрейм чегаралари ва таркиби орасидаги горизонтал масофани ўрнатади.
MARGINHEIGHT атрибути MARGINWIDTH каби ишлайди. У фреймнинг юқорги ва пастки бўлимлардаги майдонни аниқлайди.
SCROLLING атрибути фреймда саҳифалаш тасмасидан фойдаланиш имконини беради.
NORESIZE атрибути фреймнинг ўлчамини ўзгартиришга имкон бермайди.
SRC атрибути фреймга қайси саҳифа юкланишини аниқлайди.
TARGET атрибути саҳифа қайси фрейм ёки дарчага юкланишини кўрсатади.
Назорат саволлари:
1. Фреймлар.
2. Фреймларнинг ишлаш тартиби.
3. Фреймлар билан оддий сахифаларни яратиш.
4. Фреймли структурани яратиш.
5. <NOFRAMES> тегидан фойдаланиш.
6. <FRAMESET> тегидан фойдаланиш.
7. ROWS атрибути.
8. СОLS атрибути.
9. <FRАМЕ> теги.
10. МАRGINWIDTH атрибути.
11. МАRGINHEIGHT атрибути.
12. SCROLLING атрибути.
13. NORESIZE атрибути.
14. SRС атрибути.
Топшириқ вариантлари:
1. Фреймлардан фойдаланиб веб саҳифа яратинг.
2. <NOFRAMES> тегидан фойдаланиб веб саҳифа яратинг.
3. <FRAMESET> тегидан фойдаланиб веб саҳифа яратинг.
4. ROWS атрибутидан фойдаланиб веб саҳифа яратинг.
5. СОLS атрибутидан фойдаланиб веб саҳифа яратинг.
6. <FRАМЕ> тегидан фойдаланиб веб саҳифа яратинг.
7. МАRGINWIDTH атрибутидан фойдаланиб веб саҳифа яратинг.
8. МАRGINHEIGHT атрибутидан фойдаланиб веб саҳифа яратинг.
9. SCROLLING атрибутидан фойдаланиб веб саҳифа яратинг.
10. NORESIZE атрибутидан фойдаланиб веб саҳифа яратинг.
11. SRС атрибутидан фойдаланиб веб саҳифа яратинг.
Ишни бажариш тартиби:
1. Ихтиёрий матн мухарририни очиш.
2. Унга HTML кодни киритиш.
3. Файлни .html ёки .htm кенгайтмаси билан сақлаш.
4. Файлни ишга тушириш.
5. Натижа кутилгандек бўлса қоғозда ва электрон кўринишда ҳисобот тайёрлаш.
4 – Тажриба иши
Мавзу: Браузер дарчаси хусусиятини дастурлаш (2 соат)
Ишнинг мақсади:
Бу тажриба ишининг асосий мақсади браузер дарчаси хусусиятини дастурлаш билан ишлаш амалий кўникмаларини ошириш ҳисобланади.
Зарурий назарий маълумотлар:
Window объекти JavaScript объектлар иерархиясининг асосий объекти ҳисобланади. Window объектининг хусусиятлари, методлари ва ходисалари.
|
Хусусиятлар |
Методлар |
Ходисалар |
|
Status |
open() |
Ходисалар йўқ |
|
location |
close() |
|
|
History |
focus() |
|
|
navigator |
|
status ни дастурлаш. Холатлар сатри дарчанинг энг паст қисмида жойлашган.
<A HREF=”#status onMouseover=window.status=’Jump to status description’; return true; ” onMouseout=”window.satus=’Status bar programming’; return true;”> window.status </A>
defaultStatus ни дастурлаш. defaultStatus хеч қандай ходиса рўй бермаганида холатлар сатрида аксланадиган матнни аниқлайди.
<BODY onLoad=”window.defaultStatus=’Status bar programming’;’”
location майдонида юкланган веб-саҳифанинг URLи аксланади.
Ташрифлар тарихи (History). Бунда фойдаланувчи ташриф буюрган сахифаларнинг манзиллари сақланади.
Дарчаларни бошқаришга мўлжалланган методлар.
- window.alert(). Огоҳлантириш дарчасини чиқаришга имкон беради.
- window.confirm(). Фойдаланувчига ижоий ёки салбий жавоб бериш имконини берувчи дарча яратади.
- window.prompt(). Фойдаланувчига маълумот киритиш имконини берувчи дарча яратади.
- window.open(). Янги дарча яратади. Унда бошқа методларга нисбатан атрибутлари кўп.
Унинг синтаксиси: open(“URL”, “param, param, …”, replace)
бу ерда: URL – янги дарчага юкланувчи сахифа, window_name – дарча номи, replace – history билан бошқариш имконини беради, param лар ўрнига қуйидагилар қўйилади.
width – дарчанинг пикселлардаги эни;
height – дарчанинг пикселлардаги баландлиги;
toolbar – дарчани қуроллар панели билан яратади;
location – дарчани манзиллар сатри билан яратади;
status – дарчани холатлар сатри билан яратади;
menubar – дарчани меню билан яратади;
scrollbar – дарчани сахифалаш тасмаси билан яратади.
window.close() – дарчани ёпади.
window.focus() – дарчага фокус беради.
Назорат саволлари:
1. JavaScript нинг қўлланилиши.
2. JavaScript да қўлланиладиган объект моделининг тавсифи.
3. Хусусиятлар.
4. Ходисалар.
5. JavaScript нинг URL схемаси.
6. Ходисаларни кайта ишловчилар.
7. Классларнинг иерархияси.
8. Браузер дарчаси хусусиятини дастурлаш.
9. Холатлар сатри.
10. Location майдони.
11. Хусусиятлар.
12. Усуллар.
13. History.
14. Браузер тури.
15. Фреймлар иерархияси.
16. Фреймларни номлаш.
17. Фреймга фокусни жунатиш.
Топшириқ вариантлари:
1. Холатлар сатри (status)ни дастурлаш.
2. Холатлар сатри (defaultStatus)ни дастурлаш.
3. Location майдонини дастурлаш.
4. Ташрифлар тарихи (History)ни дастурлаш.
5. alert() дан фойдаланиш.
6. confirm() дан фойдаланиш.
7. prompt() дан фойдаланиш.
8. open() дан фойдаланиш.
9. close() дан фойдаланиш.
10. focus() дан фойдаланиш.
11. setTimeout() дан фойдаланиш.
12. clearTimeout() дан фойдаланиш.
13. Фреймлар (Frames)ни дастурлаш.
14. Фреймларни номлаш.
15. Фреймга фокусни жўнатиш.
Ишни бажариш тартиби:
1. Ихтиёрий матн мухарририни очиш.
2. Унга HTML кодни киритиш.
3. Файлни .html ёки .htm кенгайтмаси билан сақлаш.
4. Файлни ишга тушириш.
5. Натижа кутилгандек бўлса қоғозда ва электрон кўринишда ҳисобот тайёрлаш.
5 – Тажриба иши
Мавзу: Шакллар ва графикларни дастурлаш (2 соат)
Ишнинг мақсади:
Ушбу тажриба ишининг асосий мақсади талабаларга шакллар ва графикларни дастурлаш амалий кўникмасини ҳосил қилиш ҳисобланади.
Зарурий назарий маълумотлар:
JavaScriptда биринчи бўлиб дастурлаш шакллардан бошланган. Шакллар учун form объекти яратилган. Form объектининг хусусиятлари, методлари ва ходисалари.
|
Form объекти |
||
|
Хусусиятлар |
Методлар |
Ходисалар |
|
Action |
reset() |
onReset |
|
Method |
submit() |
onSubmit |
|
Target |
|
|
|
elements[] |
|
|
|
encoding |
|
|
Text объекти (матнли киритиш майдони) қуйидаги хусусиятлар, методлар ва ходисаларга эга.
|
Text объекти |
||
|
Хусусиятлар |
Методлар |
Ходисалар |
|
defaultValue |
blur() |
onBlur |
|
Form |
focus() |
onChange |
|
Name |
select() |
onFocus |
|
Type |
|
|
|
Value |
|
|
Select ва Option объектларининг хусусиятлари, методлари ва ходисалари.
|
Select объекти |
||
|
Хусусиятлар |
Методлар |
Ходисалар |
|
Form |
blur() |
onBlur |
|
Length |
click() |
onChange |
|
Name |
focus() |
onFocus |
|
Options[] |
|
|
|
selectedindex |
|
|
|
Type |
|
|
|
Option объекти |
||
|
Хусусиятлар |
Методлар |
Ходисалар |
|
defaultSelected |
Йўқ |
Йўқ |
|
Index |
||
|
selected |
||
|
Text |
||
|
selectedIndex |
||
|
Value |
||
Тугмалар. Тугмаларни WWW да ишлатиш JavaScriptсиз маъносиз бўлиб қолади.
<FORM>
<INPUT TYPE=”button” VALUE=”HISOBLASH”
onClick=”window.alert(‘Darchani ochish’);”>
</FORM>
Image объекти. Графика билан ишлаганда JavaScript да кўзга кўринадиган эффектларга эришилади. Image объектининг хусусиятлари, методлари ва ходисалари.
|
Image объекти |
||
|
Хусусиятлар |
Методлар |
Ходисалар |
|
border |
blur() |
onAbort |
|
complete |
click() |
onError |
|
Height |
focus() |
onLoad |
|
Hspace |
|
|
|
Name |
|
|
|
Src |
|
|
|
Vspace |
|
|
|
Width |
|
|
|
Lowsrc |
|
|
Назорат саволлари:
1. FORM контейнери.
2. Киритиш майдонини химоялаш.
3. Киритиш майдонининг кийматини узгартириш.
4. Руйхатлар.
5. Option объекти.
6. Тугмалар.
7. Расмлар.
8. Маълумотлар билан алмашиш.
9. Submit тугмаси.
10. submit() усули.
11. Cookies.
12. Графикларни дастурлаш.
13. Image объекти.
14. Расмни узгартириш.
15. Мультипликация. onLoad() ходисаси.
16. Юкланишни оптималлаштириш.
17. Расмни кесиш.
18. Графика ва жадваллар.
Топшириқ вариантлари:
1. form контейнерини дастурлаш.
2. form.action ни дастурлаш.
3. form.elements[] ни дастурлаш.
4. form.reset() ни дастурлаш.
5. form.submit() ни дастурлаш.
6. form.onReset ни дастурлаш.
7. form.onSubmit ни дастурлаш.
8. Маълумотлар билан алмашиш.
9. text объектини дастурлаш.
10. Киритиш майдонини химоялаш.
11. Киритиш майдони қийматини ўзгартириш.
12. Image объектидан фойдаланиб дастурлаш.
13. Веб саҳифадаги расмни ўзгартириш.
14. onLoad() ходисасидан фойдаланиб дастурлаш.
15. Мультипликацияни ишга тушириш ва тўхтатиш.
16. Тасвирни оптималлаштириш.
Ишни бажариш тартиби:
1. Ихтиёрий матн мухарририни очиш.
2. Унга HTML кодни киритиш.
3. Файлни .html ёки .htm кенгайтмаси билан сақлаш.
4. Файлни ишга тушириш.
5. Натижа кутилгандек бўлса қоғозда ва электрон кўринишда ҳисобот тайёрлаш.
6 – Тажриба иши
Мавзу: Гиперматн ўтишларни дастурлаш (2 соат)
Ишнинг мақсади:
Тажриба ишининг асосий мақсади талабаларга гиперматн ўтишларни дастурлаш, URL объекти билан ишлаш амалий кўникмаларини ҳосил қилиш.
Зарурий назарий маълумотлар:
Гиперматн ҳавола URL объектларининг синфига мансуб. Ушбу объектлар синфига мансублар:
- Location
- Area
- Link
URL нинг HTMLда фойдаланилиши кенг. Кўпинча биз улар билан дастурлаш дуч келамиз:
- графиклар (IMG тегининг SRC атрибути);
- шакллар (FORM тегининг ACTION атрибути);
- ҳаволалар (A тегининг HREF атрибути);
- сезувчи графиклар (AREA тегининг HREF атрибути).
URL объекти. URL объекти URL схемасида аниқланган хусусиятларга эга. Мисол сифатида IMG тегининг SRC атрибутининг қўлланилишида кўриб чиқамиз.
http://tuit.uz/help/index.html
Хусусиятнинг қийматлари:
|
href: |
http://tuit.uz/help/index.html |
|
protocol: |
http: |
|
hostname: |
tuit.uz |
|
host: |
tuit.uz:80 |
|
port: |
80 |
|
pathname: |
help/index.html |
|
Search: |
|
|
hash: |
|
Уларга мурожаат қуйидагича бўлади:document.links[0].hrefdocument.location.hostdocument.links[2].hash
Назорат саволлари:
1. Гиперматн ўтишларни дастурлаш.
2. Location объекти
3. Area объекти
4. Link объекти
5. URL объекти.
6. HREF атрибути.
7. Гиперматнларга бириктирилган массивлар
8. URL қисмини алмаштириш
9. Mouseover ва Mouseout ходисалари.
10. Click ходисаси.
11. URL схемаси.
Топшириқ вариантлари:
1. Location объектини ишлатиб дастурлаш
2. Area объекти объектини ишлатиб дастурлаш
3. Link объекти объектини ишлатиб дастурлаш
4. URL объекти объектини ишлатиб дастурлаш.
5. HREF атрибутидан фойдаланиб дастурлаш.
6. Гиперматнларга бириктирилган массивларни ишлатиш
7. URL қисмини алмаштириш.
8. Mouseover ва Mouseout ходисаларидан фойдаланиб дастурлаш.
9. Click ходисасидан фойдаланиб дастурлаш.
10. URL схемасидан фойдаланиб дастурлаш.
Ишни бажариш тартиби:
1. Ихтиёрий матн мухарририни очиш.
2. Унга HTML кодни киритиш.
3. Файлни .html ёки .htm кенгайтмаси билан сақлаш.
4. Файлни ишга тушириш.
5. Натижа кутилгандек бўлса қоғозда ва электрон кўринишда ҳисобот тайёрлаш.
7 – Тажриба иши
Мавзу: Кадр орқасида дастурлаш (2 соат)
Ишнинг мақсади:
Тажриба ишининг асосий мақсади талабаларни кадр орқасида дастурлаш амалий кўникмаларини ҳосил қилиш.
Зарурий назарий маълумотлар:
Қуйидагилар кўриб чиқилади:
· Маълумотлар тури ва структураси
· Тил операторлари
· Фойдаланувчи функциялари
· Кодни жойлаштириш усуллари
· Фон режимидаги дастур бажарилишинининг имконияти
· Фокусни бошқариш
· Хавфсизлик муаммолари
Маълумотлар тури ва структураси қуйидагиларга бўлинади.
- литераллар ва ўзгарувчилар
- массивлар, функциялар ва объектлар
Литераллар. Улар дастурда бевосита ишлатилади. Уларга сонлар ва сатрлар киради.
Мисоллар: 10, 2.310, 2.3е+2, “Бу сатрли литерал”
Ўзгарувчилар. Улар JavaScriptда тайинлаш ёки var оператори ёрдамида аниқланади.
Мисоллар: i=10; var i; var i=10; var id = window.open(); var a = new Array();
Массивлар. Массивлар ички ва фойдаланувчи томнидан аниқланадиганларга бўлинади. Массивлар учун бир-қанча методлар берилган.
- join();
- reverse();
- sort();
ва length хусусияти. Массивни аниқлаш учун махсус конструктор мавжуд:
a = new Array();
b = new Array(10);
c = new Array(10,"Бу қиймат");
Мисол:
<SCRIPT>
c = new Array(30,"Это значение");
</SCRIPT>
<FORM><INPUT SIZE=& {c[0];};
value=& {c[1];};
onFocus="this.blur();">
</FORM>
Функциялар. Дастурлаш тили дастур кодини бир-қанча фойдаланиш механизмисиз ишлай олмайди. Бунинг учун албатта функциялар лозим. JavaScriptда функциялар маълумотлар тури сифатида ишлатилади. Бир вақтнинг ўзида функциялар билан биргаликда Function объекти ишлатилади.
Умумий холда ихтиёрий объект функция орқали аниқланади. Объектни яратиш учун конструктор лозим. Шундай қилиб функциялар JavaScriptда қуйидаги калит саволлар билан боғлиқ.
· функция — маълумотлар тури;
· функция — объект;
· функция — объектлар конструктори.
Объектлар – JavaScriptнинг асосий маълумот тури ҳисобланади. У методлар ва хусусиятларнинг тўпламидир.
Назорат саволлари:
1. Кадр орқасида дастурлаш.
2. Маълумотлар структураси ва турлари.
3. Литераллар.
4. Узгарувчилар.
5. Массивлар.
6. join() методи.
7. reverse() методи.
8. sort() методи.
9. Функциялар.
10. Объектлар.
11. Объект тушунчаси.
12. Прототип.
13. Тил операторлари.
14. Фокусни бошкариш.
15. Фреймларда фокусни бошкариш.
Топшириқ вариантлари:
1. Маълумотлар структураси ва турларидан фойдаланиб дастур яратиш.
2. Литераллардан фойдаланиб дастур яратиш.
3. Ўзгарувчилардан фойдаланиб дастур яратиш.
4. Массивлардан фойдаланиб дастур яратиш.
5. join() методидан фойдаланиб дастур яратиш.
6. reverse() методидан фойдаланиб дастур яратиш.
7. sort() методидан фойдаланиб дастур яратиш.
8. Функциялардан фойдаланиб дастур яратиш.
9. Объектлардан фойдаланиб дастур яратиш.
10. Прототиплардан фойдаланиб дастур яратиш.
11. Тил операторларидан фойдаланиб дастур яратиш.
12. Фокусни бошкаришдан фойдаланиб дастур яратиш.
Ишни бажариш тартиби
1. Ихтиёрий матн мухарририни очиш.
2. Унга HTML кодни киритиш.
3. Файлни .html ёки .htm кенгайтмаси билан сақлаш.
4. Файлни ишга тушириш.
5. Натижа кутилгандек бўлса қоғозда ва электрон кўринишда ҳисобот тайёрлаш.
8 – Тажриба иши
Мавзу: Блокли ва сатрли элементларни тажрибада ишлатиш (2 соат)
Ишнинг мақсади:
Тажриба ишининг асосий мақсади талабаларни блокли ва сатрли элементларни тажрибада ишлатиш амалий кўникмаларини ҳосил қилиш.
Зарурий назарий маълумотлар:
HTML тилида элементларни тавсифлашнинг сатрли (in-line) ва блокли (block) элементларга бўлинади. Расмий улар HTML тилиybyu DTD SGML тавсиқида берилган. Блокли ва сатрли элементларнинг фарқини қуйидаги мисол билан тушунтириш мумкин:
- параграф – бу блокли элемент;
- курсив билан белгилаш – бу сатрли элемент.
Блокли ва сатрли элементларни бир-бирини ичига жойлаштирса бўлади, аммо улар кесишмаслиги керак.
DIV ва SPAN элементлари блокли ва сатрли элементларнинг умумлашган элементлари ҳисобланади.
DIV элементи. DIV умумлашган блок вазифасини бажаради. Блокли элемент доимо сахифанинг бошқа элементларидан бўш сатр билан ажратилади. DIV хеч қандай мазмунни ўзига юкламайди. Кўпинча DIV бу сахифанинг бўлаги хисобланади. Аммо уни қўллаш фақатгина CSS да мазмунга эга. DIVни акслантириш учун сукут бўйича хеч қандай қоидалар мавжуд эмас. Бу фақатгина матннинг янги сатридир.
Мисол:
<DIV STYLE="border-color:#003366; border-width:1px; margin:20px;padding:10px;">Блокли элемент, DIV элементи билан берилган.
<P>У ва унинг ичидаги элементлар учун чегара ва ташлашлар аниқланган.</P>
</DIV>
Ушбу мисолда браузер дарчасининг ичида DIV элементи жойлаштирилган Агар матн CSSни қўллаб қувватламайдиган браузер билан кўрилса натижа чиқмайди.
SPAN элементи. SPAN – бу умумлаштирилган сатрли элемент ҳисобланади. У FONT, I, B, U, SUB, SUP ва бошқа элементлар ўрнини босиши мумкин. Ушбу мосликларга мисол келтирамиз:
|
HTML-элемент |
CSS-аналог |
|
<FONT COLOR=red> ...</FONT> |
<SPAN STYLE="color:red; ">...</SPAN> |
|
<I>...</I> |
<SPAN STYLE="font-style:italic; ">...</SPAN> |
|
<B>...</B> |
<SPAN STYLE="font-weight:bold; ">...</SPAN> |
|
<U>...</U> |
<SPAN STYLE="text-decoration:underline; ">...</SPAN> |
Блоклар хусусияти
Блокли элементлар матнни тўғритўртбурчак шаклида тахрирлаш имконини беради. Шу аснода матн блоки сахифанинг дизайни бўлиб қолади.
Матн блоки қуйидаги хусусиятларга эга: баландлик (height), эн (width), чегара (border), ташлаш (margin), бўлиш (padding), ихтиёри жойлашув (float), бўяшни бошқариш (clear).
Назорат саволлари:
1. Блокли ва сатрли элементлар.
2. DIV Элементи.
3. SPAN Элементи.
4. Блоклар хусусияти.
Топшириқ вариантлари:
1. <FONT> функциясини SPAN ёрдамида бажаринг.
2. <I> функциясини SPAN ёрдамида бажаринг.
3. <B> функциясини SPAN ёрдамида бажаринг.
4. <U> функциясини SPAN ёрдамида бажаринг.
5. DIV да баландлик (height)ни ишлатиб дастур яратиш.
6. DIV да эн (width)ни ишлатиб дастур яратиш.
7. DIV да чегара (border)ни ишлатиб дастур яратиш.
8. DIV да ташлаш (margin)ни ишлатиб дастур яратиш.
9. DIV да бўлиш (padding)ни ишлатиб дастур яратиш.
10. DIV да ихтиёрий жойлашув (float)ни ишлатиб дастур яратиш.
11. DIV да бўяшни бошқариш (clear)ни ишлатиб дастур яратиш.
Ишни бажариш тартиби:
1. Ихтиёрий матн мухарририни очиш.
2. Унга HTML кодни киритиш.
3. Файлни .html ёки .htm кенгайтмаси билан сақлаш.
4. Файлни ишга тушириш.
5. Натижа кутилгандек бўлса қоғозда ва электрон кўринишда ҳисобот тайёрлаш.
9 – Тажриба иши
Мавзу: Ранг ва шрифт ҳамда матн ва руйхатларни тажрибада ишлатиш
(2 соат)
Ишнинг мақсади:
Тажриба ишининг асосий мақсади талабаларни ранг ва шрифт ҳамда матн ва руйхатларни тажрибада ишлатиш амалий кўникмаларини ҳосил қилиш.
Зарурий назарий маълумотлар:
CSSда рангларни бошқариш
CSS(стилларнинг) каскад жадваллари биринчи навбатда матннинг хусусиятини тавсифлайди. Биз хозир матн ранги (color) ва матн аксланадиган фон ранги (background-color)ни ўрганамиз.
Бундан ташқари матн ранги (color) ва матн аксланадиган фон ранги (background-color) матн блокининг чегара рангини аниқлашга имкон беради.
Матн ранги
HTMLда матн рангини бошқариш учун FONT элементи ишлатилади. Унинг аналоги сифатида CSSда color атрибути ҳисобланади. Ушбу атрибутни блокли ва сатрли элементларга ишлатса бўлади.
Мисол: TD { color:darkred; }
P { color:darkred; }
I { color:#003366;font-style:normal; }
Матн фони ранги
HTMLда фон рангини бошқариш учун фақатгина аниқ бир блокли элемент учун ишлатиш мумкин. Бундай элемент сифатида бутун бир сахифа бўлиши мумкин:
<BODY BGCOLOR=...>...</BODY> ёки жадвал <TABLE BGCOLOR=...>...</TABLE>
Қуйидаги мисолда матннинг ранги ва фон рангини белгилаш кўрсатилган.
<SPAN STYLE="background-color:black;color:white;"> сатрли элементлар каби</SPAN>
Internet Explorer 4.0. версиясидан бошлаб элементлар фони билан ишловчи бир неча атрибутлар мавжуд. Улар background-image; background-repeat; background-attachment; background-position.
Мисол:
P { background: gray http://tuit.uz/tuit.gif no-repeat fixed center center; }
Шрифт
Шрифтларга компьютер графикасида катта эътибор берилган, шу аснода World Wide Web хам катта эътибор берган.
Шрифтларни ўзгартирувчи атрибутлар:
font-family – шрифтнинг чизилишлар оиласи (гарнитура);
font-style – текис чизилиш ёки курсив;
font-weight - "кучайтириш" шрифтнинг (қалинлиги);
font-size – шрифт ўлчами (кегль). Пикселлар (px) ва типографик пунктлар (pt)да берилади.
font-variat – чизилишлар варианти (оддий ёки кичик харфлар билан).
Юқоридаги барча атрибутларни битта font атрибутида фойлаштирса бўлади: font:bold 12pt sans;
Мисоллар:<INPUT STYLE="font-family:Courier;" VALUE="Узбек тили">
<INPUT STYLE="font-family:Courier New" VALUE=" Узбек тили">
<P ALIGN=left STYLE="font-size:24px; font-family:serif;color:darkred;"> МАТН </P>
<P ALIGN=left STYLE="font-size:24px; font-family:sans-serif;color:darkred;"> МАТН </P>
<P ALIGN=left STYLE="font-size:24px; font-family:monospace;color:darkred;"> МАТН </Р>
<SPAN STYLE="font-family:symbol; padding-left:65px;"> N </SPAN><BR>
<SPAN STYLE="font-family:symbol; font-size:24px;"> A <SUB>x,y</SUB>=е(y<SUB>a</SUB>+x<SUB>a</SUB>)
</SPAN><BR><SPAN STYLE="font-family:symbol; padding-left:60px; font-size:20px;"> a=1 </SPAN>
<P STYLE="font-size:12pt;"> МАТН </P>
<P STYLE="font-size:12px;"> МАТН </P>
<P STYLE="font-size:120%;"> МАТН </P>
<P STYLE="font-size:large;"> МАТН </P>
<P STYLE="font-size:small;"> МАТН </P>
<P STYLE="font-size:x-small;"> МАТН </P>
<P STYLE="font-size:xx-small;"> МАТН </P>
<P STYLE="color:darkred;font-style:normal;"> МАТН </P>
<P STYLE="color:darkred;font-style:italic;"> МАТН </P>
<P STYLE="color:darkred;font-style:italic; font-weight:bold;"> МАТН </P>
Матн фрагментининг хусусиятлари: харфлараро масофа, сатрлар баландлиги, теккислаш, парагравнинг биринчи сатрида жой ташлаш.
Харфлараро масофа Харфлараро масофа шрифт ўлчамига боғлиқ ҳолда бошқарилади. Шрифт ўлчами қанчалик катта бўлса улар орасидаги масофа ҳам катта бўлади.<P STYLE="font-family:monospace; letter-spacing:5pt; color:darkred"> Харфлараро масофа 5pt</P>
<P STYLE="font-family:monospace;letter-spacing:10pt;color:darkred"> Харфлараро масофа 10pt </P>
Теккислаш Сукут бўйича параграфдаги барча сўзлар чап томондан теккисланади. Шу сабабли чап томон теккисланган бўлади. Ушбу натижага келиш учун HTML да <P ALIGN=justify>...</P> дан фойдаланилади. CSSда эса text-align атрибути ёрдамида ушбу натижага келинади.
<P STYLE="text-align:right;color:darkred;"> МАТН </P>
<P STYLE="text-align:justify;color:darkred;"> МАТН </P>
Назорат саволлари:
1. Ранг ва шрифт.
2. CSSда рангларни бошқариш.
3. Матн ранги.
4. Матн фони ранги.
5. Шрифт.
6. Матн ва руйхатлар.
7. Матн.
8. Теккислаш.
9. Шрифтни қайта ишлаш.
10. Параграфнинг биринчи сатри.
11. Сатрлараро масофа.
12. Руйхатлар.
Топшириқ вариантлари:
1. Матн ранги (color)дан фойдаланиб дастур яратиш.
2. Матн фони ранги (background-color)дан фойдаланиб дастур яратиш.
3. Матн блоки чегараси ранги (border-color)дан фойдаланиб дастур яратиш.
4. font-family дан фойдаланиб дастур яратиш.
5. font-style дан фойдаланиб дастур яратиш.
6. font-weight дан фойдаланиб дастур яратиш.
7. font-size дан фойдаланиб дастур яратиш.
8. font-variat дан фойдаланиб дастур яратиш.
9. text-align дан фойдаланиб дастур яратиш.
10. text-transform дан фойдаланиб дастур яратиш.
11. text-decoration дан фойдаланиб дастур яратиш.
12. text-indent дан фойдаланиб дастур яратиш.
13. line-height дан фойдаланиб дастур яратиш.
14. list-style-type дан фойдаланиб дастур яратиш.
15. list-style-image дан фойдаланиб дастур яратиш.
Ишни бажариш тартиби:
1. Ихтиёрий матн мухарририни очиш.
2. Унга HTML кодни киритиш.
3. Файлни .html ёки .htm кенгайтмаси билан сақлаш.
4. Файлни ишга тушириш.
5. Натижа кутилгандек бўлса қоғозда ва электрон кўринишда ҳисобот тайёрлаш.
АДАБИЁТЛАР
1. Cascading Style Sheets, level 1 (CSS1) W3C Recommendation 17 Dec 1996, revised 11 Jan 1999. Рекомендация WWWC для СSS1. Фактически, -это стандарт.
2. HTML в примерах. Как создать свой Web-сайт. Самоучитель. 2003 г.
3. Ахромов. Я.В.Технологии Web-дизайна и Flash-технологии. Феникс. 2004 г.
4. Виртуальный университет Евразии - http://virtual-university-eurasia.org/
5. П.Б.Храмцов, С.А.Брик и др. Основы web-технологий. 2003 г.
Босишга рухсат этилди 23.01.12
Бичими 60х84 1/16. Босма табоғи 2, 55
Адади 50. Буюртма - № 2
Тошкент ахборот технологиялари университети
“Нашр-матбаа” бўлимида чоп этилди.
Тошкент ш., Амир Темур кўчаси, 108 уй.
 |