Aşağıda görülebileceği gibi, web sayfanızdaki HTML ve CSS kullanılarak herhangi bir metnin etrafında bir sınır oluşturulabilir. Aşağıdaki örnekte bir paragrafı () kırmızı kenarlıkla çevreledik.
İlk önce kırmızı kenarlıkla çevrili metin.
Bu örnekte ayrıca birden çok satır var.
Yukarıdaki örneği oluşturmak için aşağıdaki kod kullanılmıştır.
İlk önce kırmızı kenarlıkla çevrili metin.
Bu örnekte ayrıca birden çok satır var.
Yukarıdaki kodda, stil sınır boyutunu (piksel için kısa px), stil türünü ve kenarlık rengini tanımlar. Kenarlığın stili, kenarlığın ekranda nasıl göründüğüdür. Diğer sınır stilleri arasında noktalı, kesikli, çift, oluk, çıkıntı, iç içe geçme ve öteleme bulunur. Kenarlık rengi, kenarlık için kullanmak istediğiniz rengi tanımlar. Yukarıdaki örnekte, kırmızı için renk kodu olan # FF0000 renk kodu kullanılmıştır.
CSS kullanarak stil tanımlama
Bir web sayfasındaki öğelerin görünümü ayrıca satır içi CSS ile tanımlanabilir. Satır içi CSS, HTML belgenizde, öğede tanımlanır. Veya, CSS'yi .css uzantısıyla harici bir dosyada tanımlayabilirsiniz. Ardından, bu dosyaya herhangi bir HTML belgesinden bağlanabilirsiniz; bu belgedeki öğeler CSS stillerine erişebilir. Örneğin, aşağıdaki CSS koduyla, başka bir HTML etiketine uygulanabilecek "borderexample" adlı yeni bir sınıf oluşturuluyor.
.borderexample {border-style: katı; border-color: # 287EC7; }
Yukarıdaki kodu kullanarak, bu kenarlık stilini bir HTML paragrafına uygulamak istiyorsanız, aşağıdaki örneğe benzer bir şey yazabilirsiniz.
İşte CSS kullanılarak oluşturulan bir sınır örneği