Şəkillər və ya mətnlərin ətrafına qoyulmuş çərçivələr saytı bəzəyir və dizaynına müxtəliflik qatır. Haşiyələr yaratmaq üçün cədvəllərdən istifadə edirsinizsə, hər bir sərhəd üçün kod çox yer tutacaqdır. Ayrıca, bu vəziyyətdə, hər bir çərçivə üçün HTML kodunu yenidən yazmalı olacaqsınız. CSS ilə bu sərhədlə əhatə olunacaq bütün elementlər üçün bir dəfə sadə bir kod yazaraq istədiyiniz qalınlıqda və rəngdə bir sərhəd yarada bilərsiniz. Bu texnologiya, lazım olduqda, bir neçə dəqiqə ərzində saytdakı çərçivələrin növünü dəyişdirməyə imkan verəcəkdir.
Vacibdir
- - öz veb saytınız olmalıdır;
- - CSS-nin nə olduğunu və bu üslubların saytda yazıldığını bilmək.
Təlimat
Addım 1
Haşiyə yaratmaq üçün əvvəlcə CSS-də aşağıdakı kodu yazın:
ramka {}
Addım 2
Haşiyəni istədiyiniz ölçüdə etmək üçün sətir genişliyini piksellərlə təyin edən sərhəd genişliyi parametrindən istifadə edin. Məsələn, çərçivə xətti 3 piksel enində olmalıdırsa, giriş belə görünür:
ramka {sərhəd genişliyi: 3px;}
Addım 3
İndi sərhəd üslubu parametrindən istifadə edərək sərhəd stilini müəyyənləşdirin. Tərəfləri müntəzəm qatı xəttlərdən ibarət bir sərhəd yaratmaq istəyirsinizsə, kodu aşağıdakı işarəni qıvrım aşırma arasına qoyun - sərhəd tərzi: möhkəm.
Addım 4
Nöqtəli bir sərhəd belə yazmaqla əldə edilə bilər: sərhəd tərzi: nöqtəli. Sərhəd tərzini yoxlamaq: kəsikli sizə kəsikli bir haşiyə verəcəkdir.
Addım 5
Haşiyəni bu şəkildə ikiqat möhkəm bir xətt edə bilərsiniz: sərhəd tərzi: ikiqat. Sərhəd stili istifadə edin: yiv və ya sərhəd stili: Mətn və ya şəkilləri 3D yan təsirləri ilə çərçivələrə salmaq üçün silsilə. Bu iki seçim arasındakı fərq, birinci vəziyyətdə çərçivənin girintili xətlərdən, ikincisində isə qabarıq olanlardan ibarət olmasıdır.
Addım 6
Sayt kodunun hüdudu ilə daxilolma effekti yaratmaq üçün bu kodu istifadə edin: border style: inset. Haşiyənin məzmununu sərhədlə yanaşı əksinə qabarıq etmək üçün haşiyə tərzi yazın: başlanğıc.
Addım 7
Haşiyə rəng parametrindən istifadə edərək çərçivəyə istədiyiniz rəngi əlavə edə bilərsiniz, həmçinin buruq mötərizələr arasında yerləşdirilir. Haşiyəni qırmızı etmək istəyirsinizsə, haşiyə rəngini yazın: qırmızı, mavi - haşiyə rəngi: mavi, narıncı - haşiyə rəngi: narıncı.
Addım 8
Bütün seçimlər daxil olmaqla CSS sərhəd kodu belə görünür:
ramka {sərhəd genişliyi: 3px; sərhəd tərzi: möhkəm; haşiyə rəngi: mavi;}
Addım 9
İndi HTML dilində bunu yazın:
Çerçeve içeriği "Çerçeve içeriği" ifadəsi əvəzinə istədiyiniz şəklin mətnini və ya kodunu daxil edin.
Addım 10
Beləliklə, saytda sınırsız sayda element dizayn edə bilərsiniz. Çərçivənin görünüşünü dəyişdirmək üçün yalnız CSS kodunu dəyişdirməlisiniz.
