myNotlar Logo

borderTopColor


Internet Explorer Firefox Opera

borderTopColor özelliği, elementin üst kenarlık (border top) renginin belirlenmesini sağlar.

DOM Sözdizimi

element.style.borderTopColor = "renk"

CSS Sözdizimi

border-top-color: renk
renktransparent, HTML Renk Tablosunda belirtilen isimlendirilmiş HTML Renklerinden birini veya aşağıda gösterilen RGB renk belirleme varyasyonları ile belirtilebilen bir renk değeri alarak üst kenarlık rengini belirler.

HTML RGB Renk Değerlerinin Belirlenmesi

borderTopColor özelliğinin alabileceği renk değerleri temelde üç çeşittir. Bunlardan ilki kenarlığın sayfa üzerinde yer kaplamasına rağmen kendine ait rengi olmayıp altındaki elementin rengini gösteren transparent değeridir. İkincisi isimlendirilmiş HTML Renk değerleridir. Üçüncü tür renk değerleri ise RGB renkleri ile dört farklı şekilde belirtilebilen renklerdir. Bu renklerin belirlenmesi aşağıdaki tabloda kısaca gösterilmiştir. Renklerle ilgili biraz daha geniş bilgiyi HTML Renkleri konusunda bulabilirsiniz.

border-top-color: transparent;           // Kenarlığı saydam yapar.
border-top-color: red;                   // Ön tanımlı HTML Renk İsimlerinden biri

border-top-color: #fff;                  // #rgb
border-top-color: #ffffff;               // #rrggbb
border-top-color: rgb(255, 255, 255);    // 0 - 255 arası tamsayı
border-top-color: rgb(100%, 100%, 100%); // 0.0% - 100.0% arası kayar noktalı sayı

Aşağıdaki örnek, bir DIV elementinin üst kenar renginin CSS border-top-color ile renk ismi atayarak ve RGB renk belirtimlerinin farklı varyasyonları ile belirlenmesini göstermektedir.

<style type="text/css">
.ornekDiv1, .ornekDiv2, .ornekDiv3, .ornekDiv4, .ornekDiv5
{
    border-width: 10px;
    border-style: solid;    
    width: 80px;
    height:60px;
}
.ornekDiv1 {
    border-top-color: blue;    
}
.ornekDiv2 {
    border-top-color: #00F;
}
.ornekDiv3 {
    border-top-color: #0000FF;    
}
.ornekDiv4 {
    border-top-color: rgb(0, 0, 255);
}
.ornekDiv5 {
    border-top-color: rgb(0%, 0%, 100%);
}
#ornekTablo tr td
{
    width: 20%;
    text-align:center;
    font-size:.8em;
}
</style>

<table id="ornekTablo" border="0">
<tr><td>
    <div class="ornekDiv1"></div> <br/> blue
</td><td>
    <div class="ornekDiv2"></div> <br/> #00F
</td><td>
    <div class="ornekDiv3"></div> <br/> #0000FF
</td><td>
    <div class="ornekDiv4"></div> <br/> rgb(0,0,255)
</td><td>
    <div class="ornekDiv5"></div> <br/> rgb(0%,0%,100%)
</td></tr></table>
Canlı Sonuç

blue

#00F

#0000FF

rgb(0,0,255)

rgb(0%,0%,100%)
İlgili Başlıklar
 
myNotlar Hakkında
Telif Hakkı © 2007-2009 mynotlar.com Tüm Hakları Saklıdır. Kopyalanamaz. Yayınlanamaz.
E-Posta : support@myNotlar.com

| Tek Kişilik Oyunlar | Sudoku | YasinKa |