Genelde bir resmin üzerine yazı yazmanın iki yöntemi var;
1. html etiketi olarak img oluşturup oluşturduğumuz img etiketinin içerisine h,p ,span etiketiyle yazı yazarak resime yazı ekleyebilir daha sonra css de align ,padding ile ortalayabiliriz.
2.bu yöntem ise html den veya css den resim eklenir img veya bacground olarak akabinde position özelliği ile üzerine getiririz buradaki işin sırrı ise positionda üstüne getirmekistedimiz şeye relativ diğerine ise absulute veririz.
İyi günler.
Çözüm: CSS POSİTİON PROPERTY(POZİSYON ÖZELLİĞİ)
İlk öncelikle mantık olarak div in css position özelliğine "relative" vermen gerek. Div'in içerisindeki alt etiketlere <img> ve <h1></h1> etiketlerinin css position özellelliklerine absolute değerini vermelisin. Relative burada ilişkilendirme görevi görür. Yani div tagının altındaki position özellikleri absolute verilmiş nesneleri sınırlandırır. Bu sayede ilgili css özellikleri vererek(margin,padding,left,right) yazı ve resimi birbirinden bağımsız olarak konumlandırabilirsin.
Yardımcı olabilecek kaynaklar:
https://www.w3schools.com/css/css_positioning.asp
https://gelecegiyazanlar.turkcell.com.tr/konu/web-programlama/egitim/201-html5-css/css-zemin-ozellikleri
