Html Renk Kodları
Html renk kodları içeren temel bir liste oluşturup aşağıda sizlerle paylaşacağım ve bu listeyi gün geçtikçe zenginleştirilecektir.
Renk Kodu | Renk | Ton |
#000000 | Siyah | |
#f00000 | Kırmızı | |
#ffffff | Beyaz | |
#3300ff | Mavi | |
#ff6600 | Turuncu | |
#003300 | Yeşil | |
#009531 | İslam Yeşili | |
#ffff00 | Sarı | |
#a22ea2 | Mor | |
#ff00ff | Pembe | |
#ff66ff | Ela | |
#66ffff | Turkuaz | |
#66ff00 | Fıstık Yeşili | |
#611919 | Kahverengi | |
#660000 | Koyu Kahverengi | |
#808080 | Gri | |
#808080 | Koyu Gri |
HTML Yazı Rengi Belirleme
Html yazı rengi belirlemenin bir kaç yolu vardır bu yolları aşağıda maddeler halinde vereceğim ve her biri için ayrı ayrı örnekler yapacağım.
- Font özelliğine parametre vermek
- HTML etiketi içine stil girmek
- CSS dosyasında tanımlayarak renk vermek
Font Özelliğine Parametre Vermek
HTML içinde Font özelliği bulunmaktadır ve bu özellik diğer etiketlerden bağımsız mantıkta çalışmaktadır. Kendine özgü parametreleri vardır ve etiket içinde yazı yazılabilirdir. Aşağıda örneğini inceleyelim.
Kod:
<font color="blue">Bu yazı mavidir!</font>
Açıklama: Font etiketini kullanarak color parametresine blue isim olarak renk girdik ancak #0ff renk kodu girerek de yazıya renk verebilirsiniz.
HTML Etiketi İçine Stil Girmek
Font özelliğine parametre verme işlemi inline css diye adlandırdığımız bölümdür. Aşağıda örneğini göreceksiniz.
Kod:
<div style="color:#f00;">Bu yazı kırmızıdır!</div>
Açıklama: Bu yazı için yazı rengini style içinde inline olarak belirledik ve yazı rengi kırmızıdır.
CSS Dosyasında Tanımlayarak Renk Vermek
CSS Dosyası içersinde tanımalama yapılarak yazılara renk verilebilir. Kapsayıcıya bir sınıf veya id verilerek bu işlem başarılı bir şekilde yapılabilir. Alt bölümde CSS ve HTML bölümleri ayrı ayrı yazacağım. Aşağıdaki örneğe bir göz atalım.
HTML Kod:
<div class="renkTuruncu">Bu yazı turuncudur!<div>
CSS Kod:
<style> .renkTuruncu{color:orange;} </style>
Açıklama: Bu örnekteki HTML bölümünde bir div oluşturup bu div içinde sınıf tanımladık bu sınıfın adı “renkTuruncu” bu sınıfı .css dosyamızın içinde yukardaki gibi tanımladık. Ardından örneği çalıştırdıktan sonra yazının turuncu olduğunu göreceksiniz.