Arkadaşlar merhabalar bu dersimizide html5 de başlıkta bulunan konuları görecez.
Fotoğraf ekleme etiketi
<img src="java.jpg" width="150px;" height="150px;"/>
Arkadaşlar burada src = source demek yani kaynak , bizim dosyamızın kaynağı nedir ? java.jpg . width = genişlik , height = yükseklik .
Arkaplan için :
<p style="background-color: blue;">Kerem</p><p style="background-color: rgb(202, 60, 21);">Kerem</p><p style="background-color: #a3a3a3;">Kerem</p>
Arkadaşlar burada p etiketi paragraph anlamına gelir yani paragraf demek . style d stil demek yani içeride arkaplan rengi,yazı rengi,yazı şekli gibi birçok işler orada dönüyor :) . background-color : Arka plan rengi demek ve biz yazdığımız kodların arka planı rengini ayarlayacağız.Ilk baştaki aqua rengi , diğerlerine bakalım rgb ne demek ? rgb = red,green,blue renkleri ve bu renklerin karıştırılma boyutunu yazıyorsunuz ve bunların max değeri 255. Yani siz red yukarıda yazdığımız 202 , green 60 , blue 21.Siz bunların sayısını arttırarak bunların renk baskınlığını da arttırabilirsiniz.En son kısım da ise # (sharp) işareti ile renk belirledik . Böyle bir kodun da olduğunu bilin ezberlemeyin ! Sizin renklere daha detaylı bakabilmeniz için online sayfa veriyorum.
Şimdi de yazı renklerine kısaca değinelim.Yukarıdaki arkaplan renk kısmını anladıysanız burası çok basit gelecektir.
<p style="color: red;">Junior Yazılım</p><p style="color: rgb(125, 255, 52);">Junior Yazılım</p><p style="color: #555555;">Junior Yazılım</p>
Arkadaşlar burada color tek yazdık başka bir şey yazmadık :) color = renk demek . Color ile yazı rengini değiştirebiliriz.Kodlarımızı birleştirelim.
<html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><img src="java.jpg" width="150px;" height="150px;"/><p style="background-color: blue;">Kerem Sarmış</p><p style="background-color: rgb(202, 60, 60);">Kerem Sarmış</p><p style="background-color: #a3a3a3;">Kerem Sarmı</p><p style="color: red;">Junior Yazılım</p><p style="color: rgb(125, 255, 52);">Junior Yazılım</p><p style="color: #555555;">Junior Yazılım</p></body></html>
Dersi daha iyi pekiştirmek için dersin videosunu alta atıyorum.