Birinchi navbatda biz index.html php sahifasini yaratib olamiz. Bu bizda bosh sahifa hisoblanadi index.html yaratib bo’lingach biz still uchun alohida style.css faylini yaratib olamiz va biz bunga o’zimizga kerakli parametrlarni, shriftlarni, fon va boshqa narsalarni kiritib chiqamiz. html fayliga o’zgartrish va kodlarni kiritshimiz uchun biz NotePad ++ dasturidan foydalandik. Uning boshqa dasturlardan farqi va yaxshi tarafi siz agar html kodini kiritayotgn vaqtda xatolik bo’lsa, qizil bilan belgilab beradi va html teg va kodlari dastur ichiga kiritilgan.
Notepad++ dasturida bosh sahifa kodi:
1-rasm. Notepad++ da sahifaning ko’rinishi.
Qolgan barcha web sahifalarni yaratishda Javascript va css dokumentlar hamda html, css kodlaridan foydalandim.
2-rasm. CSS va JavaScript dokumentlarni bog’lash.
Style.css bu biz yaratib olgan css dokumentdir. Bu yerdan OK tugmasini bosamiz va css dokument bog’lanadi. Buni css dokumentni
teglari orasidagi kodlar yozilishidan bilib olsa bo’ladi.
Sayt novigatsiyasiga quyidagicha still berildi:
BOSH SAHIFA
li>YODGORLIKLAR
VIDEO
BUXORO ANTALOGIYASI
TUMANLAR
Brauzerdagi ko’rinishi quyidagicha:
5-rasm.
Saytimizning html kodi quyida keltirilgan:
Endi web saytimiz uchun birinchi o’zimizga kerakli bo’lgan menyu sahifalarini aniqlab olamiz va yaratamiz. Biz sahifalarimizani Notepad++ dasturida ochamiz va kerakli teg va kodlarni kirtib chiqamiz.
6-rasm. Bosh sahifaning html ko’rinishi.
Bosh sahifani yaratib bo’lingach qolgan sahifalarni ham sozlab chiqamiz.
Yaratmoqchi bo'lgan sahifalarimizning kodlarini teramiz. Kerakli rasm va matnlarni joylaymiz. So'ngra brauzerda ochip ko'ramiz:
Yodgorliklar sahifasiga “bosh sahifada” ham silka berilgan u yerdan read move tugmasini bosganimizda quydagi sahifa ochiladi. Buyerda buhoro obidalari haqida malumotlar har bitta obidaga alohida ma’lumot berilgan.
tegasini ichiga class atributi bilan berilgan va ularning hususiyatlari o’zgartirilgan.
Boqiy buhoro sahifasi saytning content qismidan tashqarida sahifaning o’ngtomoniga rBar kalonkasi ichiga suratga silka berib joylashgtirilgan. Suratning ustiga sichqonchani olib borganingzda qol rasmi chiqadi va bosilganda quydagi sahifaga ochiladi.
10
Boqiy buhoro sahifasi saytning content qismidan tashqarida sahifaning o’ngtomoniga rBar kalonkasi ichiga suratga silka berib joylashgtirilgan. Suratning ustiga sichqonchani olib borganingzda qol rasmi chiqadi va bosilganda quydagi sahifaga ochiladi.