Merhabalar, bu yazımda yine pek çok etiketin sahip olduğu attribute olan style’ı göreceğiz.
Html kodları oldukları haliyle çok düzdür. Daha öncede bahsettiğimiz gibi bir binanın iskeleti gibi bir görüntüye sahiptirler. Bu binayı boyamak istediğimiz tasarıma getirmek bizim elimizde. Html’de bunun olmasını style yani css kodları sağlar.
Css uygulayabileceğimiz her etiketin style attribute’u vardır. Amacımız burada CSS kodlarını göstermekten ziyade style attribute’ı yardımıyla CSS kodları nasıl yazılır bunu göstermek.
<p style=""> Murat Bilginer </p>Etiket içinde bu şekilde style dedikten sonra = “” içine CSS değerleri yazılır.
Şimdi elimizdeki yazının rengini değiştirelim. Bunun için kullandığımız CSS kodu color’dır.
Style içinde CSS kodları
Nitelik : Değer; şeklindedir.Yazılabilecek CSS niteliklerinin alabileceği belirli değerler vardır. Bunları yine kullandığımız CSS plugin’leri Emmet sayesinde kolayca görebiliriz.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p style="color:red;"> Murat Bilginer </p>
</body>
</html>Bu sayfanın çıktısına bakalım.
Bir değer daha ekleyelim ve font büyüklüğünü değiştirelim. Bunu font-size ile yaparız. Değerleri ise pixel türünden alabilir.
<p style="color:red; font-size: 45px;"> Murat Bilginer </p>
Bu şekilde satır içinde her etiket için ayrı ayrı style kodları yazabiliriz.
Her değer sonrası noktalı virgül koymayı unutmayınız.
Bir sonraki yazımda görüşmek üzere.
