|
O’zbekiston respublikasi axborot texnologiyalari va kommunikasiyalarini rivojlantirish vazirligi muhammad al-xorazmiy nomidagi
|
| bet | 6/9 | | Sana | 10.11.2023 | | Hajmi | 6.11 Mb. | | #97092 |
Bog'liq Induvidual loyiha Mirgulshanov Muhsinjon 1 Muhsinjon amaliy iahi 1 kompyuter animatisa fanidanII BOB. AMALIY QISM
2.1. VS Code dasturi muhitini ishga tayyorlash
Veb sahifa tayyorlash uchun VS Code dasturidan foydalanamiz. Buning uchun VS Code dasturini kompyuterimizga o‘rnatib olib dasturni ishga tushirib olamiz (2.1-rasm).
2.1-rasm. VS Code dasturi ishchi oynasi
Veb sahifani tayyorlashda quyidagi figma maketi orqali veb saytimizni tayyorlaymiz.
https://vvv.figma.com/file/QqoYD4q9n9v2qcaMGq5jZr/trafalgar-landing-page-for-figma?node-id=0%3A1
Ishni boshlashdan oldin o’zimiz uchun kerakli fayllarni yaratib olamiz. Veb sahifani html qismini yozish uchun “index.html”, css buyruqlarini yozish uchun “main.css”, rasm va veb sahifada ishlatilgan shriftlarimiz uchun alohida papkalar yaratib olamiz (2.2-rasm).
2.2-rasm. Fayllarni yaratib olish
Figmadan rasmlarni yuklab olish uchun figmaga kirib yuklab olmoqchi bo’lgan rasmimiz ustiga bosamiz va o’ng tarafdan Export bo’limiga o’tib yuklab olishimiz mumkin (2.3-rasm).
2.3-rasm. Figmadan rasmni yuklab olish jarayoni
Figma orqali veb sayt qilinayotgan paytda shriftlar yuklab olishga to’g’ri keladi. Shriftlarni yuklab olish uchun fonts.google.com sayti orqali o’zimizga kerakli shriftlarni yuklab olsak bo’ladi (2.4-rasm).
2.4-rasm. Shrift yuklab olish jarayoni
Fayllarni yaratib olib “index.html” faylimizga kiramiz. Va “!” belgisini qo’yib “Enter” tugmasini bosamiz. Bizga tayyor shablon yozib beradi (2.5-rasm).
2.5-rasm. HTML tanasi
Endi navbatda HTML faylimizga CSS faylimizni ulab olamiz. Buning uchun “HEAD” tegini ichida “link” tegidan foydalanamiz (2.6-rasm).
2.6-rasm. HTML ga CSS ni ulash
Veb sahifa qilish qilish davomida veb sahifamiz uchun umumiy bo’lgan stillar mavjud. Biz ularni CSS faylimizning eng tepasiga yozib olamiz. Bunga sabab CSS dagi stillar tatbiq bo’layotgan payt tepadan pastga qarab tatbiq bo’ladi. Umumiy stillarga veb sahifa shrifti, shrift qalinligi, yozuvlar rangi va shrift o’lchamlari kiradi (2.7-rasm).
2.7-rasm. CSS dagi umumiy stillar
|
|
Bosh sahifa
Aloqalar
Bosh sahifa
O’zbekiston respublikasi axborot texnologiyalari va kommunikasiyalarini rivojlantirish vazirligi muhammad al-xorazmiy nomidagi
|
