Ders 5

CSS ve HTML Dersleri | Dreamweaver Kurulumu | CSS Programlama Dersleri

Bu dersimizde "<div>" etiketini kullanmayı öğreneceğiz. Bu etiket ile bir tablo gibi bir kutucuk ekleyeceğiz. Bu kutucuk ile sayfamızı bölümlere ayırabiliriz.

"<div>" etiketini kapatmak zorundayız.

Etiketin içine '<div style="">' görüldüğü gibi "style" yazıp kutucuğumuz özelleştirebiliriz. Öncelikle kutucuğun rengini, boyutunu ve yazı işlemlerini göstereceğim. Diğer dersimizde farklı özellikler vereceğim.

style="width:290px; height:165px;" ile kutucuğun boyutunu ayarlarız.
style="color: #03C; font: bold 20px verdana;" ile kutunun içine yazacağımız yazının rengi ve stilini ayarlayabiliriz.
style="text-align:center;" ile yazının sağ-sol taraflarından yerini ayarlarız.(center, left, right)
style="background-color: #999;" ile kutucuğun rengini belirleriz.
style="border:5px dashed #000000;" ile kutucuğun kenarlığının kalınlığını, rengini ve türünü ayarlarız. Ben "dashed" yazarak çizgili kenarlık yaptım.

Örnek Kod:

<!doctype html>

<html>

<head>

<title>div etiketi uygulama</title>

</head>

<body>

<div style="width:300px; height:300px; color: #03C; font: bold 20px verdana; text-align:center; border:5px dashed #000000; background-color: #999;

kutu1</div>

</body>

</html>

Page updated

Google Sites

Report abuse