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.


What's Your Reaction?

love
0
love
hate
0
hate
win
0
win
geeky
0
geeky
omg
0
omg
lol
0
lol
fail
0
fail
fun
0
fun
Murat Bilginer
21 Şubat 1992'de doğdum. Endüstri Mühendisi olarak lisansımı 2016 yılında tamamladım. Industryolog Akademi - NGenius oluşumlarının kurucusuyum. Şu anda kendi şirketim Brainy Tech ile Web ve Mobil Geliştirme, AWS, Google Cloud Platform Sistemleri İçin DevOps, Big Data Analiz ve Görselleştirme hizmetleri sunmakta ve Online Eğitimler vermekteyiz.