Etiket: css

CSS border-top-width

border-top-width:

Elementin üst kenarlık genişliğini  ayarlamak  için kullanılır.

Not: Her zaman için önce border-top-width  özelliklerini ayarlayınız. Rengi değiştirmek için önce border elementiniz olması gerekir.

Örnek

#borderTop{
    border-style: dotted;
    border-top-width: 5px;
    padding: 10px;
}

Codepen Ön izleme

Css Sözdizimi

Değer Açıklama
medium Kenarlık genişliğini orta olarak ayarlar.
thin İnce bir sağ kenarlık belirtir.
thick Kalın bir sağ kenarlık belirtir.
length Elementin px,cm,pt,yüzdeli vs. değerler alabileceğini belirtir.
İnital
İnherit

Tarayıcı Desteği
1.0 1.0 4.0 1.0 3.5
Posted on by Samed GÖZÜTOK 2

CSS border-top-style

Border-top-style :

Elementin üst kenarlık stilini  ayarlamak  için kullanılır.

Örnek

#borderTop{
    border-style: dashed;
    border-top-style: dotted;
    padding: 10px;
}

Codepen Ön izleme

 

Css Sözdizimi

Değer Açıklama
none Kenarlık stilinin olmadığını belirtir.
hidden Kenarlığı gizlemek için kullanılır.
dotted Elementin px,cm,pt,yüzdeli vs. değerler alabileceğini belirtir.
dashed kesik çizgili bir kenarlık olduğunu belirtir.
double çift kenarlıklı bir kenarlık olduğunu belirtir.
solid düz bir kenarlık olduğunu belirtir.
groove düz kenarlıklı bir kenarlık olduğunu belirtir.
inset 3D gömme kenar tanımlar. Efekt border-color değerine bağlıdır.
ridge 3D oluklu kenar tanımlar. Efekt border-color değerine bağlıdır.
outset 3D outset kenar tanımlar. Efekt border-color değerine bağlıdır.
İnital
İnherit

Tarayıcı Desteği
1.0 1.0 5.5 1.0 9.2
Posted on by Samed GÖZÜTOK 1

CSS border-top-right-radius

border-top-right-radius :

Elementin sağ üst yuvarlak bir görünüm vermek için kullanılır.

Örnek

#borderRightRadius{
    border: 5px solid blue;
    border-top-right-radius: 20px;
    padding: 10px;
}

Codepen Ön izleme

 

Css Sözdizimi

Değer Açıklama
length Elementin px,cm,pt,yüzdeli vs. değerler alabileceğini belirtir.
İnital
İnherit

Tarayıcı Desteği
5.0
4.0-webkit		 4.0
3.0-moz		 9.0 5.0
3.1-o		 10.5
Posted on by Samed GÖZÜTOK 1

CSS border-top-left-radius

border-top-left-radius :

Elementin sol üst yuvarlak bir görünüm vermek için kullanılır.

Örnek

#borderLeftRadius{
    border: 2px dashed;
    border-top-left-radius: 5px;
    padding: 10px;
}

Codepen Ön izleme

Css Sözdizimi

Değer Açıklama
length Elementin px,cm,pt,yüzdeli vs. değerler alabileceğini belirtir.
İnital
İnherit

Tarayıcı Desteği
5.0
4.0-webkit		 4.0
3.0-webkit		 9.0 5.0
3.1-webkit		 10.5
Posted on by Samed GÖZÜTOK 0

CSS border-top-color

border-top-color :

Elementin üst kenarlık rengini ayarlamak  için kullanılır.

Not: Her zaman için önce border-top-color  özelliklerini ayarlayınız. Rengi değiştirmek için önce border elementiniz olması gerekir.

Örnek

#borderTop{
      border-style: dotted;
    border-top-color: blue;
}

Codepen Ön izleme

 

Css Sözdizimi

Değer Açıklama
color üst kenarlık rengini belirtmek için kullanılır.
transparent üst kenarlık renginin transparan yapmak için kullanılır.
İnital
İnherit

Tarayıcı Desteği
1.0 1.0 4.0 1.0 3.5
Posted on by Samed GÖZÜTOK 0

CSS border-top

border-top :

Elementin üst kenarlık özelliklerini ayarlamak  için kullanılır.

Örnek

#borderTop{
      border-style: solid;
    border-top: 2px dashed blue;
}

Codepen Ön izleme

Css Sözdizimi

Değer Açıklama
border-top-width üst kenarlık genişliğini ayarlamak için kullanılır.
border-top-style üst kenarlık stilini ayarlamak için kullanılır.
Border-top-color üst kenarlık rengini ayarlamak için kullanılır.
İnital
İnherit

Tarayıcı Desteği
1.0 1.0 4.0 1.0 3.5
Posted on by Samed GÖZÜTOK 0

CSS border-style

border-style :

Elemente kenarlık görünüşünün nasıl olacağını ayarlamak için kullanılır.

Not: Eğer tek değer verilirse bu tüm kenarlar için geçerlidir, iki değer atanırsa ilki yatayda boşluk için ikincisi dikey de boşluk vermek için tanımlanmıştır.

Örnek

#borderStyle{
    border-style: dotted;
}

Codepen Ön izleme

 

Css Sözdizimi

Değer Açıklama
none Kenarlığını olmayacağını belirtmek için kullanılır.
hidden Kenarlığı gizlemek için kullanılır.
dotted noktalı bir kenarlık olduğunu belirtir.
dashed kesik çizgili bir kenarlık olduğunu belirtir.
double çift kenarlıklı bir kenarlık olduğunu belirtir.
groove düz kenarlıklı bir kenarlık olduğunu belirtir.
inset 3D gömme kenar tanımlar. Efekt border-color değerine bağlıdır.
ridge 3D oluklu kenar tanımlar. Efekt border-color değerine bağlıdır.
outset 3D outset kenar tanımlar. Efekt border-color değerine bağlıdır.
İnital
İnherit

Tarayıcı Desteği
1.0 1.0 4.0 1.0 3.5
Posted on by Samed GÖZÜTOK 1

CSS border-image-slice

border-image-slice

border-image-slice özelliği, border ‘ ın belirtilen boyutlar içinde tekrarlanmasını sağlar.

Örnek

border: 10px solid transparent;
    padding: 15px;
    -webkit-border-image: url(http://w3tr.com/file/border.png) round; /* Safari 3.1-5 */
    -o-border-image: url(http://w3tr.com/file/border.png) round; /* Opera 11-12.1 */
    border-image: url(http://w3tr.com/file/border.png) round;
    border-image-slice: 20%;

Codepen Ön izleme

 

Css Sözdizimi

 

Değer Açıklama Örnek
stretch Varsayılan değer. Görüntü alanını kaplayacak şekilde genişletilir.
repeat Görüntü alanını sınırlanan bölge kadar tekrar eder.
round Görüntünün iki noktası arasındaki bölgesi tekrarlanmasını sağlar.
initial
inherit
Posted on by Samed GÖZÜTOK 1

CSS border-spacing

Border-spacing :

Elemente kenar boşluğu vermek için kullanılır.

Not: Eğer tek değer verilirse bu tüm kenarlar için geçerlidir, iki değer atanırsa ilki yatayda boşluk için ikincisi dikey de boşluk vermek için tanımlanmıştır.

Örnek

#borderSpacing{
  border-collapse: separate;
  border-spacing: 5px 20px;
}

Codepen Ön izleme

 

Css Sözdizimi

Değer Açıklama
length Elementin px,cm,pt,yüzdeli vs. değerler alabileceğini belirtir.
İnital
İnherit

Tarayıcı Desteği
1.0 1.0 8.0 1.0 4.0
Posted on by Samed GÖZÜTOK 0

CSS border-right-width

border-right-width :

Elementin Sağ kenarlık genişliğini  ayarlamak  için kullanılır.

Not: Her zaman için önce border-right-width  özelliklerini ayarlayınız. Rengi değiştirmek için önce border elementiniz olması gerekir.

Örnek

#borderRight {
      border-style: solid;
    border-right-width: 15px;
    padding: 10px;
}

Codepen Ön izleme

 

Css Sözdizimi

Değer Açıklama
medium Kenarlık genişliğini orta olarak ayarlar.
thin İnce bir sağ kenarlık belirtir.
thick Kalın bir sağ kenarlık belirtir.
length Elementin px,cm,pt,yüzdeli vs. değerler alabileceğini belirtir.
İnital
İnherit

Tarayıcı Desteği
15.0 15.0 11.0 6.0 15.0
Posted on by Samed GÖZÜTOK 1