Printerlar va ularni narxlari turlarini joylashtirilgan sayit ishlaymiz. Buning uchun sayitimizning birinchi betini ishlab olamiz buning uchun Sublime textda quydagi kodlarni yozib olamiz.
Natija bizda 4 blok hosil bo’ladi va bu boklarni nomladik. Bunda div tegiga nomlash uchun id atributidan foydalandim. Birinchi blokmi “bosh” , ikkinchi blokni “menu” ,uchinchi blokni “orta” , to’rtinchi blokni “past”deb nomladim.
Birinchi blokda sayt nomi joylashgan boladi.
Ikkinchi bolkda giper silkarda printr ishlab ciquvchi kampanyalar nomi tagma-tag chiqishi kerak. Bu ishni bajarish ucun CSS dan foydalanmiz va quydagi teglari yozamiz. Undan oldin index nomli css fayl ochamiz va uni HTML faylga birlashtramiz.
qismiga
kodni yozamiz. Bu yerda rel atributi caqirilyotgan faylni qanda turda ekanligini bildiradi.
Uchinchi blok orta blok bolib u menu blokini yonida ciqishi kerak. Buni uchun menu blokini flaot hususiyatini left, orta bloknikini esa right qilamiz. Orta blokimizda kun yangiliklari korsatiladi.
Tortinchi blok past nomli blok unga ozimiz haqimizda (yaratuvchi haqida) malumot kiritamiz. Ya’ni TATUNF-2020 va saytimizni bosh sahifasi quydagicha korinishga keladi.
Endi 2-betni yani “canon” tugmasini bosganda ochilishi kerak bo’lgan betni yaratamiz.
Bosh blokda kampanya nomi , menu blokida printer rusimlari giper silka korinishda va orta blokda ulani rasimlari ostida rusimi. Bunda foydalanuvchi rasimlarin koradi va oziga yoqqan printer rasmi ostida rusimni oqiydi va menu blokidan uni tanlaydi, foydalanuvchiga o’sha printer haqidagi sahifani chiqarib beradi. Past blok undagi hech narsa ozgarmay bosh sahifadidiga oxshab qolveradi. Orta blogida joylashgan rasimlarga fon berish uchun img nomli css fayla yaratdik.
Natija quydagicha bo’ldi.
Bu yerdagi “ORQAGA” tugmasini bosganda 1-betga qaytadi.
Endi printer haqida malumot beruvchi sahifalarni yaratamiz.
Bu yerda 3 ta blok bolim bosh blokda printer rusimi orta blokda printerni rasmi va uni ostida u haqida mulomotlar boladi va u quydagi ko’rinishga keladi