Texnika CSS ilə icra et
Bir veb sayt hazırlayırsanız, veb səhifəsində sabit bir fon şəkil və ya su nişanı yaratmağı öyrənmək maraqlı ola bilər. Bu məşhur bir dizayn müalicəsidir ki, bu, çox vaxt internetdə məşhurdur. Web-dizayn çantanıza tövsiyələr vermək üçün əlverişlidir.
Bunu əvvəlcədən etmədiyiniz və ya əvvəllər şans olmadan cəhd etmədiyiniz təqdirdə proses qorxuducu görünə bilər, amma əslində çox çətin deyil. Bu qısa tutorial ilə, CSS'yi istifadə edərək, bir neçə dəqiqəlik bir üsulla texnika sahibi olmaq üçün lazım olan məlumatları əldə edəcəksiniz.
Başlanğıc
Arka plan şəkilləri və ya su nişanı (həqiqətən, yalnız çox işıqlı fon şəkilləri olan) bədii dizaynda tarixə malikdir. Sənədlər kopyalanmasını maneə törətmək üçün uzun müddət su nişanlarını da daxil etmişlər. Bundan əlavə, bir çox əlavələr və broşürlər çap olunmuş parça üçün dizaynın bir hissəsi kimi böyük fon şəkillərindən istifadə edir. Web dizaynı çapdan və fon şəkillərindən uzun çəkilmiş üslublara malikdir, bu borclu üslublardan biridir.
Bu böyük fon şəkilləri aşağıdakı üç CSS stil xüsusiyyətindən istifadə edərək yaradır:
- background-image
- fon-təkrarlama
- arxa planda
- fon ölçüsü
Arka plan-Şəkil
Filigranınız kimi istifadə ediləcək təsvirləri müəyyən etmək üçün arxa fondan istifadə edəcəyiniz. Bu üslub sadəcə olaraq "şəkillər" adlı bir kataloqda sitenizde olan bir şəkil yükləmək üçün bir fayl yolu istifadə edir.
background-image: url (/images/page-background.jpg);
Şəkilin özü normal görünüşdən daha yüngül və ya şəffaf olması vacibdir. Bu yarı şəffaf bir görünüşün mətnin, qrafikin və veb səhifənin digər əsas elementlərinin arxasında olduğu "su nişanı" yaradır. Bu addım olmadan, fon şəkilləri səhifənizdə olan məlumatlarla rəqabət aparacaq və oxumağı çətinləşdirir.
Adobe Photoshop kimi hər hansı bir redaktə proqramında fon imicini dəyişə bilərsiniz.
Arka plan-təkrarlayın
Arka plan təkrar əmlakı növbəti gəlir. Görünüşünüzün böyük bir filigran stili grafiği olmasını istəyirsinizsə, bu görüntüyü yalnız bir dəfə göstərmək üçün istifadə edin.
background-repeat: no-təkrar;
"Təkrar təkrar" mülkiyyəti olmadan, u mənim görüntü təkrarlanan səhifənin təkrarlanmasıdır. Bu, ən müasir veb səhifə dizaynlarında arzuolunmazdır, buna görə də bu stil CSS-də vacib hesab edilməlidir.
Arka plan-əlavə
Background-attachment bir çox veb-dizaynerləri unutduğu bir xüsusiyyətdir. Bu "sabit" əmlakı istifadə etdiyiniz zaman fon şəklinizi yerində sabit saxlayır. Bu görünüşü sayfada sabit bir filigrana çevirir.
Bu əmlak üçün standart dəyər "kaydır". Arka plan əlavə dəyəri göstərmirsinizsə, arka plan səhifənin qalan hissəsi ilə birlikdə hərəkət edəcəkdir.
background-attachment: sabit;
Arxa ölçüsü
Arxa ölçüsü yeni CSS xüsusiyyətidir. Bu, göründüyü görünüşün görünüşü əsasında bir fonun ölçüsünü təyin etməyə imkan verir. Bu fərqli ölçülərdə fərqli cihazlarda görünəcək cavab verən saytlar üçün çox faydalıdır.
fon ölçüsü: örtük;
Bu əmlak üçün istifadə edə biləcəyiniz iki faydalı dəyərlər bunlardır:
- Cover - Tam genişliyi və ya tam hündürlüyü göstərildiyi üçün fon ölçüsünü ölçür. Bu, əksər hissələrin ekranda görünməyəcəyini, lakin bütün sahənin əhatə ediləcəyini bildirir.
- Contain - Görünüşü tərəzi, həm də bütün genişlik və boyu üslubda olan ərazidə göstərilir. Təsvir kəsilmir, lakin saldıqda sahənin hissəsi görüntülə örtülməyəcəkdir.
CSS-yə səhifəniz əlavə olundu
Yuxarıda göstərilən xüsusiyyətləri və onların dəyərlərini başa düşdükdən sonra, bu üslubları veb saytınıza əlavə edə bilərsiniz.
Bir səhifəlik sayt yaratdığınız təqdirdə veb səhifənin HEAD ünvanına aşağıdakıları əlavə edin. Çox səhifəli bir site qurarkən xarici bir stilin gücünü istifadə etmək istəyirsinizsə xarici üslubun CSS üslublarına əlavə edin.