CSS hərflərini oxuyanda ağlınıza veb dizayn gəlirsə, doğru yerdəsiniz. CSS Cascading Style Sheets deməkdir. Cascading Style Sheets ifadəsinin türkcə mənası Cascading Style Sheets-dir. CSS türk dilində Stil Şablonu kimi təyin olunur. Veb dizaynını öyrənməyi düşünürsünüzsə, ilk qarşılaşacağınız şey CSS anlayışıdır. Əgər biz CSS-ni təyin etmək istəyiriksə, onu əsasən veb səhifələrin dizaynını və təqdimatını idarə edən dil kimi müəyyən edə bilərik. CSS kodlarından istifadə etmək üçün sizə HTML kodları lazımdır, çünki CSS veb səhifələrin məzmununu emal edən HTML ilə birlikdə işləyir. HTML dizayn etdiyiniz saytın mətn formatı üçün bir çox alternativ təklif edir. CSS proqramı sayəsində dizayn etdiyiniz sayt daxilində hər səhifə üçün daha böyük və unikal şablonlar hazırlaya bilərsiniz. Qısacası CSS kodları ilə dizayn etdiyiniz internet səhifəsində HTML elementlərinin ölçüsü, mətni, rəng xarakteri kimi müxtəlif vizual xüsusiyyətlərini dəyişə bilərsiniz.
HTML yoxsa CSS? Hansı?
Əgər siz veb dizaynla maraqlanırsınızsa və veb dizaynı öyrənmək istəyirsinizsə, bilməlisiniz ki, bir vebsayt bir neçə struktur təbəqədən ibarətdir. Bu təbəqələr üç sinfə bölünür: məzmun qatı, vizuallaşdırma qatı və qarşılıqlı əlaqə. HTML məzmun qatını, CSS vizuallaşdırma qatını, Javascript isə qarşılıqlı əlaqə qatını təşkil edir. HTML təbəqəsi hər bir veb-səhifədə mövcuddur. HTML qatını yaradaraq hazırladığınız vebsayta daxil olanlara çatdırmaq istədiyiniz məlumatları çatdıra bilərsiniz. Müasir internet səhifələri əsasən mətn olsa da, şəkillər, animasiyalar və videolar kimi müxtəlif məzmunlardan da istifadə olunur. Məzmunun məzmun qatında necə göstəriləcəyi barədə məlumat yoxdur. Vizuallaşdırma təbəqəsi, yəni CSS, məzmunun səhifəni ziyarət edən şəxsə necə göstəriləcəyini müəyyənləşdirir. Veb saytına yüklədiyiniz məzmunu ekran ölçüsünə uyğun tənzimləməli, şrift ölçüsünü təyin etməli və bu təbəqədə rəng və ağ boşluq kimi vizual elementləri təyin etməlisiniz. Vizuallaşdırma təbəqəsi üçün tövsiyə olunan və istifadə olunan proqramlaşdırma dili CSS-dir. Bu zaman CSS kodlarından niyə istifadə etməli olduğunuz aydın olur.
Niyə CSS Proqramından istifadə etməlisiniz?
İndi CSS proqramının HTML ilə etiketlənmiş məzmunu necə göstərəcəyini izah etdikdən sonra CSS proqramından niyə istifadə etməli olduğunuzu izah etməyin vaxtı gəldi. HTML məzmunun səhifədə necə göstərildiyini və yerləşdirildiyini müəyyən etmir. HTML proqramının işi məzmunu təsvir etmək və məzmunun sırasını müəyyən etməkdir. Başqa sözlə, HTML-in işi suallara cavab verməkdir: Səhifənin adı nədir, səhifədəki keçidlər nədir, bir-birinin altında düzülmüş sətirlər siyahı və ya adi bir paraqrafdır. Bütün bunlara baxmayaraq, HTML loqonun ölçüsü, səhifədəki yeri, başlığın rəngi kimi məsələlərə müdaxilə etmir. CSS-in rolu buradan başlayır. Veb sayt dizaynında CSS kodları nəyin, harada və necə göstərilməsinə dair tam səlahiyyətdir. Məsələn, CSS loqonun səhifənin yuxarı sağ küncündə yerləşdirilməsini təmin etmək üçün məsuliyyət daşıyır. Bir müddət sonra müştəriniz loqonun yuxarı sol küncdə, bütün ekranı əhatə etməklə göstərilməsini istədikdə, HTML koduna və ya loqotipi ehtiva edən fayla toxunmadan bunu CSS ilə edə bilərsiniz. Bundan əlavə, CSS proqramı bir neçə faylda vizual məlumat topladığı üçün sayt yeniləmələrini və texniki xidmətini asanlaşdırır. Vizuallaşdırma məlumatları bir neçə faylda toplandığı üçün məlumat trafikinə qənaət edir.
CSS kodlarından istifadənin üstünlükləri
Cavab verən dizayn tətbiqlərinin əvəzsiz proqramlarından biri olan CSS-dən istifadə bir çox üstünlüklərə malikdir. Bu üstünlükləri saysaq, ilk növbədə məlumat trafikinə qənaət edə bilərik. CSS proqramının bütün üslubları yalnız bir neçə CSS faylına daxil edildiyi üçün məlumat trafiki saxlanılır. Üstəlik, onu ölçə bilərsiniz. CSS faylını ayrıca kodladığınız zaman faylı endirdikdən sonra o, brauzer tərəfindən saxlanılır. Eyni CSS faylını digər səhifələrdə istifadə edərkən brauzer tərəfindən saxlanılan bu fayldan istifadə edə bilərsiniz. Eyni faylı yenidən yükləməli olmayacaqsınız. CSS kodlarından istifadənin üstünlüklərindən biri məzmunun çevikliyini təmin etməsidir. Məzmunu və vizual dizaynı ayırdığınız zaman eyni məzmunu müxtəlif mühitlərdə istifadə etmək asanlaşır. Məsələn, eyni məzmunu ana səhifədə, eləcə də daxili səhifələrdə və RSS lenti üçün istifadə edə bilərsiniz. Eyni məzmunu ekran oxuyucuları üçün də istifadə edə bilərsiniz. Proqramın digər üstünlüyü onun yenilənməsinin asanlığıdır. Siz bütün saytın vizual məlumatlarını bir və ya bir neçə CSS faylında saxlaya bilərsiniz. Məsələn, 1000 səhifədən ibarət bir saytınız var. Saytınızdakı başlıqları bir nöqtə böyütmək istədiyiniz zaman CSS sayəsində tək bir faylda bir sətir yeniləyirsiniz. Bundan əlavə, CSS proqramı müasir kodlaşdırma strategiyalarına imkan verir.
CSS üslubları əlavə etmək üçün neçə alternativ var?
Veb saytınıza CSS üslublarının əlavə edilməsi
üçün 3 alternativ var. Əvvəlcə General CSS-dən istifadə edə bilərsiniz. <head> bölməsinə CSS qaydaları əlavə etməklə
HTML sənədi ilə siz bütün CSS qaydalarını ehtiva edən xarici .css faylına keçid edə bilərsiniz. Bundan əlavə, veb saytınıza qaydaları tətbiq etmək istəyirsinizsə, yerli CSS-dən istifadə edə bilərsiniz. Əvvəlcə ümumi CSS kodundan danışaq. Ümumi CSS kodlarını təyin etdiyiniz səhifənin <head> bölməsinə yerləşdirin. Siz CSS kodunu təyin etmək üçün siniflərdən və identifikatorlardan istifadə edə bilərsiniz, lakin qlobal CSS yalnız onun əlavə olunduğu xüsusi səhifədə aktiv olacaq. Bu yolla tətbiq etdiyiniz CSS üslubları səhifə hər dəfə yükləndikdə yüklənəcək, beləliklə yükləmə müddəti arta bilər. Siz onu ümumi CSS <style> </style> teqləri arasında yerləşdirməlisiniz. Veb saytınıza CSS proqramını əlavə etməyin ən əlverişli yolu veb saytınızı xarici .css faylı ilə əlaqələndirməkdir. Beləliklə, veb saytınıza bağladığınız xarici CSS faylında etdiyiniz hər hansı dəyişiklik veb saytınızda qlobal olaraq əks olunacaq. Xarici CSS faylına keçidi səhifənin <head> bölməsinə yerləşdirməlisiniz. Son seçim, yerli CSS proqramı, müəyyən bir HTML etiketi üçün istifadə olunur. Doğma CSS-dən istifadə tövsiyə edilmir, çünki hər bir HTML elementi doğma CSS proqramında fərdi şəkildə tərtib edilməlidir. Yalnız yerli CSS-dən istifadə etdiyiniz zaman veb saytınızı idarə etməkdə çətinlik çəkə bilərsiniz. Doğma CSS-dən istifadə, CSS fayllarına girişiniz olmadığı və ya yalnız bir elementi üslubladığınız zaman faydalı ola bilər.
CSS kodları nədir?
Proqram proqramını yazmağa imkan verən siqnallara kod deyilir. CSS kodları iki əsas komponentdən ibarətdir. Bu komponentlərdən biri elementləri və üslubları ayıran seçimdir. Digər komponent ifadə hissəsidir, burada biz bir və ya bir neçə xassə elan edirik. Seçim tez-tez tərtib edəcəyiniz HTML elementidir. Məsələn, h1, bədən, p, a s. İfadə hissəsi davamlı xüsusiyyətdir: dəyər; aşağıdakı kimi sadalanır. Xüsusiyyətlər və dəyərlər { } işarələri arasında verilmişdir. CSS kodları həmişə nöqtəli vergül (;) ilə bitir. İfadələr kvadrat mötərizə içərisindədir. Nümunə olaraq CSS kodlarının bir nümunəsini paylaşaq:
p {rəng: mavi; mətni düzün: mərkəz; }
CSS proqramında ən çox istifadə olunan kodlar hansılardır?
Hər bir proqram proqramında olduğu kimi, CSS proqramında da tez-tez istifadə olunan kodlar var. Ən çox istifadə olunan CSS kodlarına link xassələri, formatlaşdırma, siyahı xüsusiyyətləri, təbəqə xüsusiyyətləri, şrift xüsusiyyətləri, mətn xüsusiyyətləri, kursor xüsusiyyətləri, fon xüsusiyyətləri və cədvəl xüsusiyyətləri daxildir. Misal üçün; Cədvəl xüsusiyyətlərini təyin edən CSS kodları arasında olan sərhəd kodu cədvəlin kənarlarının formalaşdırılmasına imkan verir. Link xassələrinə baxdığımızda linkə tıklandıqda aktiv kodun vəziyyəti nəzərdə tutulur. CSS proqramının veb səhifəni təşkil edən təbəqələr arasında olduğunu bildirdik. CSS kodları vizuallaşdırma qatını təşkil etdiyi üçün şrift xüsusiyyətləri və formatla bağlı kodlar da CSS kodları arasındadır. Şrift xüsusiyyətləri ilə əlaqəli kodlar arasında olan fomnt ailəsi şrift tipini (times roman, verdana kimi) təyin edir. CSS kodları HTML kodlarının içərisinə yerləşdirilir, yəni yazılır. CSS kodları asanlıqla başa düşülən və öyrənilən bir dil quruluşuna malikdir. Bir çox kodlaşdırma sistemlərində olduğu kimi, CSS kodlaşdırmasında da ingilis dilindən istifadə olunur. Ona görə də kod yazısına əlavə olunacaq ingiliscə sözləri bilmək kifayətdir.