Hogyan tudnék egy képre szöveget írni? (HTML, CSS)
A következő a kód:
<table>
<tr>
<td>
<a href="#">
<h2>Ez a szöveg</h2>
<img src="valami.png" />
</a>
</td>
</tr>
</table>
Így a h2 és img taget egymás alá teszi. Én azt szeretném, hogy a h2 tag rajta legyen a képen. Megoldható?
válasza:<img src="valami.png" />
Ebben a formában max úgy, ha a "valami.png"-re képszerkesztővel (Paint, Gimp, PH) ráírsz.
Ahogy szeretnéd csak úgy ha az a kép maga az oldal háttérképe.
válasza:CSS:
background: url("valami.png");
Ezt állítod be annak a dolognak, amiben a szöveg van.
Vagy pedig:
CSS:
position: absolute;
left: 0px;
top: 0px;
A képnek is, és a szövegnek is ezt állítod be, az értékekkel még játszhatsz, hogy elérd a kívánt eredményt. Ha a kép kerül fölülre, akkor adnod kell nekik egy-egy z-index -et is.
válasza:Az első hozzászóló pedig hülyeséget írt, mert nem csak háttérképre lehet szöveget írni.
Csak, hogy lásd! Itt van rá egy példa:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#pozicio{
position:absolute;
top:0px;
left:0px;
}
img{
width:300px;
height:600px;
z-index:-1;
}
</style>
</head>
<body>
<h1>Szöveg a képen</h1>
<img src="keped.jpg" id="pozicio" />
</body>
</html>
Másik lehetőség a CSS background tulajdonság használata:
válasza: válasza:A kérdésben benne volt:
"(HTML, CSS)"
És te nem az írtad, hogy HTML-lel sehogy sem tudja a kérdező megoldani.
Te azt írtad, hogy abban a formában ahogy ő kéri "(HTML, CSS)" csak háttérként lehet, és ez így nem igaz!
válasza:Hát ha már mindenképp html+css kell (pedig php-val könnyebb lenne), akkod
<table>
<tr>
<td>
<a href="#">
<div class="szoveg"><h2>Ez a szöveg</h2></div>
<img src="valami.png" class="kep"/>
</a>
</td>
</tr>
</table>
és a css
.kep{
position:absolute;
z-index:-1;
}
.szoveg{
position:absolute;
top:234px;/*A toppot és a leftet állítgasd be te.*/
left:542px;
}
válasza:szerintem a táblázat a kérdésben lévő kódnál felesleges. Egyszerűen egy div-et csinálsz, háttere a kép és beleírsz valamit.
<div style="background: url(valami.png) no-repeat"><h2>Szöveg</h2></div>
válasza:Kapcsolódó kérdések:
Minden jog fenntartva © 2024, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!