Saytingizning ko'rinishini yaxshilashni o'rganing
CSS bilan formalarni qanday qilib o'rganish sizning veb-saytingizning ko'rinishini yaxshilashning ajoyib usuli hisoblanadi. HTML shakllari ko'pincha veb-sahifalardagi eng yomon narsalar orasida. Ular tez-tez zerikarli va fayzli va uslub uslubida ko'p taklif qilmaydilar.
CSS bilan o'zgarishi mumkin. CSS-ni yanada rivojlangan formalar bilan birlashtirish ba'zi go'zal ko'rinishdagi shakllarni taqdim etishi mumkin.
Ranglarni o'zgartiring
Matnda bo'lgani kabi, ariza elementlarining old va orqa fonlarini o'zgartirishingiz mumkin.
Taxminan har bir ariza elementining orqa fon rangini o'zgartirishning eng qulay usuli - kirish yorlig'idagi fon rangini ishlatishdir. Masalan, ushbu kod barcha elementlarda ko'k fon rangini (# 9cf) qo'llaydi.
kiritish {
fon-rang: # 9cf;
rang: # 000;
}
Faqat ma'lum bir ariza elementlarining orqa fon rangini o'zgartirish uchun faqat matn maydonini qo'shing va uslubni tanlang. Masalan:
kirish, matn maydonini tanlash,
fon-rang: # 9cf;
rang: # 000;
}
Agar fon rangi qorong'i bo'lsa, matn rangini o'zgartirganingizga ishonch hosil qiling. Kontrast ranglar ariza elementlarini yanada aniqroq qilishda yordam beradi. Masalan, matn rangi oq bo'lsa, quyuq qizil fon rangidagi matn ancha oson o'qiladi. Masalan, bu kod oq matni qizil fonga o'rnatadi.
kirish, matn maydonini tanlash,
fon-rang: # c00;
rang: #fff;
}
Hatto ariza rangini ham forma yorlig'i ustiga qo'yishingiz mumkin. Formadagi yorliq blok elementi ekanligini unutmang, shuning uchun rangi elementlarning joylashuvini emas, balki butun to'rtburchakni to'ldiradi.
Blok elementiga sariq rangli fonni qo'shishingiz mumkin:
shakl {
fon-rang: #ffc;
}
Chegara qo'shish
Ranglardagi kabi turli formadagi elementlarning chegaralarini o'zgartirishingiz mumkin. Butun shaklga bir tekis chegara qo'shishingiz mumkin. To'ldirishni qo'shishga ishonch hosil qiling, yoki ariza ma'lumotlaringiz chegara yonida o'ngga siljiydi.
Quyida, 1 pikselli qora chegara kodi 5 pikselli plomba bilan ko'rsatilgan:
shakl {
chegarasi: 1px qattiq # 000;
to'ldirish: 5px;
}
Chegaralarni faqat ariza shakliga nisbatan ko'proq joylashtirishingiz mumkin. Ularni ajratish uchun kirish elementlarining chegarasini o'zgartiring:
kiritish {
border: 2px dashed # c00;
}
Cheklovlarni kirish qutilariga qo'yganda ehtiyotkorlik bilan kirish qutilariga o'xshab ko'rinadi, va ba'zi odamlar shaklni to'ldirishni bilmasligi mumkin.
Uslublar xususiyatlarini birlashtirish
Ariza ma'lumotlaringizni fikr va ba'zi CSS-lar bilan birlashtirib, sizning saytingizning dizayni va tartibini to'ldiradigan go'zal ko'rinadigan shaklni o'rnatishingiz mumkin.