O‘zbekiston respublikasi oliy va o‘rta maxsus ta’lim vazirligi guliston davlat universiteti yuldashev Ulmasbek Abdubanapovich

---

148 
3.6. DREAMWEAVER DASTURIDA SAYT DIZAYNI BILAN ISHLASH 
 
Adobe Dreamweaverning kaskadli ko‘rinishlar jadvali (CSS) bilan ishlashda 
asosiy uskunasi – uslublar (stillar) paneli hisoblanadi. «Стили CSS» paneli joriy 
sahifa elementini (режим «Текущий») yoki butun hujjatni (режим «Везде») aks 
ettirishga ta’sir etadigan CSS qoidalari va xususiyatlarini nazorat qilish imkonini 
beradi. Orasidagi chegarani sudrash orqali istalgan sohani o‘lchamini o‘zgartirish 
mumkin. CSS bilan ishlashda, shuningdek, Xususiyatlar nazoratchisi (Инспектор 
свойств) dan foydalanish ham mumkin.
«Стили CSS» panelini ochish uchun:
• 
«Окно» > «Стили CSS» menyu bandi tanlanadi.
• 
«Shift» + «F11» klavishalari birgalikda bosiladi.
• 
Xususiyatlar nazoratchisi panelida «CSS» tugmasi bosiladi.
«Стили CSS» paneli CSS stillarini ko‘zdan kechirish, yaratish, tahrirlash, 
o‘chirish hamda tashqi ko‘rinishlar jadvalini hujjatga ulash uchun qo‘llaniladi.
59-rasm. Adobe BrowserLab oynasi 
Panelning yuqori qismida joylashgan «Везде» va «Текущий» tugmalari 
rejimlarni almashtirish imkonini beradi..
«Текущий» rejimida «Стили CSS» paneli uchta sohaga ega bo‘ladi: «Сводка 
по выделению» sohasida hujjatning joriy elementi uchun CSS xususiyatlarini aks 
ettiradi, «Правила» sohasi tanlangan xususiyatlarning joylashuvini aks ettiradi, 
«Свойства» sohasi qo‘llangan CSS xususiyatlarini tahrirlash imkonini beradi.

---

149 
«Везде» (Все) pejimida «Стили CSS» paneli ikki sohaga ega bo‘ladi: «Все 
правила» (верхняя область) va «Свойства» (нижняя область). «Все правила» 
sohasi joriy hujjatdagi yoki hujjatga ulangan tashqi ko‘rinishlar jadvalidagi qoidalar 
ro‘yxatini aks ettiradi. «Свойства» sohasi «Все правила» panelida tanlangan 
istalgan qoida uchun CSS xususiyatini tahrirlashga imkon beradi.
«Везде» (Все) va «Текущий» rejimlarida «Стили CSS» paneli «Свойства» 
(нижняя область) sohasida ko‘rinishlarni o‘zgartirish uchun uchta tugmaga ega:
А. «Категория» ko‘rinishi Dreamweaverda quvvatlanadigan CSS 
xususiyatlarni sakkiz toifaga saralaydi: shrfit, fon, bo‘lak, chegara, maydon, ro‘yxat, 
joylashuv va kengaytmalar. Har bir toifadagi ro‘yxatni toifa nomi yonida joylashgan 
«Plyus» (+) belgisiga ega tugmani bosish orqali yoyish mumkin. Berilgan 
xususiyatlar ro‘yxatning yuqori qismida aks etadi.
B. 
«Список» 
ko‘rinishi 
Dreamweaverda 
mavjud 
barcha 
CSS 
xususiyatlarini alfavit tartibda aks ettiriadi.
C. 
Faqat foydalanilgan xususiyatlarni aks ettiradi.
«Везде» va «Текущий» rejimlarida «Стили CSS» paneli yana quyidagi 
tugmalarga ega bo‘ladi:
A. 
Tashqi ko‘rinishlar jadvalini ulash uchun qo‘llaniladi.
B. 
Yangi CSS qoidasini yaratadi.
C. 
Qo‘llanilgan stillarni tahrirlaydi.
D. 
CSS xususiyatini o‘chirish yoki ishga tushirish
E. 
CSS qoidasini o‘chirish.
Bu buyruqlardan «Стили CSS» paneli ustida sichqoncha o‘ng tugmasini 
bosib kontekst menyudan foydalanish ham mumkin.

---

150 
«Обработка стиля» (odatda ko‘rinmas holatda bo‘ladi) tashuvchiga bog‘liq 
ko‘rinishlar jadvalidan foydalanilganida turli tashuvchilarda hujjatning ko‘rinishini 
ko‘zdan kechirishga imkon beruvchi tugmalarga ega. Shuningdek, CSS ni o‘chirib 
qo‘yish tugmasi ham mavjud.Uskunalar panelini ko‘rinadigan holatga keltirish 
uchun menyudan «Просмотр» > «Панели инструментов» > «Обработка стиля» 
buyrug‘i tanlanadi.
Bu uskunalar panelidan hujjatda tashuvchiga bog‘liq ko‘rinishlar jadvali 
qo‘llanilganida foydalanish mumkin. Masalan, ko‘rinishlar jadvalida hujjat tanasi 
uchun ikki qoida aniqlangan bo‘ishi mumkin: qog‘ozda va smartfon ekranida chop 
etish. Odatda, Dreamweaver kompyuter ekrani uchun maketni aks ettiradi.
• 
Обработать стиль для вывода на экран – sahifaning kompyuter 
ekranida qanday aks etishini ko‘zdan kechirish.
• 
Обработать стиль для вывода на печать – sahifaning qog‘ozda 
qanday aks etishini ko‘zdan kechirish.
• 
Обработать стиль для вывода на мобильное устройство – 
sahifaning mobil telefonda qanday aks etishini ko‘zdan kechirish.
• 
Обработать стиль для отображения на проекторе – sahifaning 
proyektorda qanday aks etishini ko‘zdan kechirish.
• 
Обработать стиль для вывода на консоль TTY – sahifaning TTY 
konsolida (teletayp) qanday aks etishini ko‘zdan kechirish.
• 
Обработать стиль для вывода на ТВ – sahifaning TV da qanday aks 
etishini ko‘zdan kechirish.
• 
Переключить отображение стилей CSS – sahifaning CSS qoidalari 
o‘chirib qo‘yilganida qanday aks etishini ko‘zdan kechirish.
• 
Таблицы стилей времени разработки - sahifaning dasturlash 
jarayonida aks etishini ko‘zdan kechirish.
CSS panelida quyidagi xususiyatlar uchun qalquvchi panel mavjud:
• 
text-shadow
• 
box-shadow

---

151 
• 
border-radius
• 
border-image
60-rasm. “body” xususiyati
Qalquvchi paneldagi parametrlar berilgan xususiyatlarni to‘g‘ri qo‘llanilishini 
ta’minlaydi. Rasmda border-image xususiyati uchun qalquvchi panel (chapda) 
berilgan.
CSS xususiyatlari bir nechta qiymatga ega bo‘ishi mumkin: Masalan: text-
shadow: 3px 3px #000,-3px-3px #0f0;
CSS xususiyatlarini o‘zgartirish «Дизайн» rejimida aks etmaydi. Buning 
uchun interfaol ko‘zdan kechirish rejimiga o‘tiladi. Bu rejimda quyidagi 
xususiyatlar quvvatlanadi:
• 
text-shadow;
• 
border-radius;
• 
-webkit-box-shadow;
• 
-webkit-border-image.