7. Kenarlıklar (Borders)

KENARLIK TANIMLAMA

  • 5 piksel kalınlığında düz çizgi siyah kenar çizgisi yaratma

<div style=“border:5px solid black; width:250px; height:100px”>

</div>


Solid yerine kullanılabilecek diğer parametreler.

KENARLIKLARIN KENARLARINI YÖNETME

border-top : 5px solid black;              : üst kenara özellik atar.
border-bottom :5px solid black;      : alt kenara özellik atar.
border-left: 5px solid black;               : sol kenara özellik atar.
border-right :5px solid black ;          : sağ kenara özellik atar.

KENARLIK ÖZELLİKLERİNİ AYRI AYRI TANIMLAMA

border : 5px solid black;    style’ini aşağıdaki gibi aynı şekilde parça parça da tanımlayabiliriz.

border-width: 5px;
border-style : solid;
border-color : black;

border-bottom :5px solid black;

border-bottom-width: 5px;
border-bottom-style : solid;
border-bottom-color : black;

DIV KENARLARINI OVALLEŞTİRME

Aşağıdaki style ile divin kenarlarını ovalleştirebiliriz.

 <div style=border-radius:10px; background-color:aquamarine; width:250px; height:100px”>

Aşağıdaki style ile divin sol üst köşesini ovalleştirebiliriz.

<div style=border-top-left-radius:10px; background-color:aquamarine; width:250px; height:100px”>