Autor Zpráva
LosPivkos
Profil *
#1 · Zasláno: 6. 7. 2009, 20:23:46 · Upravil/a: Moderátor (editace znemožněna)
Odpovědět Citovat
Dobrý den, potřeboval bych poradit, chtěl bych mít určitou mezeru mezi obrázky, poradily jste mi, že mám použít příkaz margin, tak jsem to udělal takto, vše by bylo v pořádku, jen nevím jak udělat, aby fungovala jen šířka. Když to zadám, obrázky se rozhodí jak na výšku tak i na šířku.
Takto vypadá ten zápis: 
<table width="410" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
	<td align="center"><a href="cerpadla2.html" rel="lightbox" title="Čerpadla"><img src="obrazky\cerpadlo.jpg" alt="Čerpadla" width="210" height="170" border="2" style="float: right; margin: 188px"></a></td> 
	<td align="center"><a href="kolektory.html" rel="lightbox" title="Kolektory"><img src="obrazky\kolektory.jpg" alt="Plošné kolektory" width="210" height="170" border="2" style="float: none; margin: 188px" ></a></td>
	<td align="center"><a href="vzduch.html" rel="lightbox" title="Vzduchová"><img src="obrazky\vzduch.jpg" alt="Vzduchová" width="210" height="170" border="2"></a></td>
</tr>
</table>


Díky moc za rady.
panther
Profil
#2 · Zasláno: 6. 7. 2009, 20:45:16 · Upravil/a: panther
Odpovědět Citovat
LosPivkos
„Když to zadám, obrázky se rozhodí jak na výšku tak i na šířku. “
jak se rozhodí? Myslíš tím, že je mezera 188px ze všech stran?

Pokud ano, je vše v pořádku. 
margin: a b c d; => a - margin-top, b- margin-right, c - margin-bottom, d - margin-left
margin: a b c;   => a - margin-top, b - margin-right, margin-left, c - margin-bottom
margin: a b;     => a - margin-top a margin-bottom, b - margin-right a margin-left
margin: a;       => a - margin ze všech stran stejný

Jestli máš problém s něčím jiným, dodej odkaz na problematickou stránku nebo lépe popiš problém.
LosPivkos
Profil *
#3 · Zasláno: 7. 7. 2009, 10:15:55
Odpovědět Citovat
Ahoj, nevím si rady, proto raději dám celou stránku, snad to bude lepe pochopitelné.

<!DOCTYPE HTML PUBLIC "-//W3C/DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>PowerProject</title>
<meta name="keywords" content=" powerproject, teplo," />
</head>
<body bgcolor="yellow">
<div align="center" id="nadpis">
<font size="8" face="Cooper Black" color="#3300CC" "nazevstranky">Podle získávání tepla</font>
</div>
<br><br><br><br><br>
<strong><font size="7" color="#FF0000">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Vrt
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Plošný kolektor
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Vzduchový systém</font></strong>
<br><br><br><br>
<table width="410" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center"><a href="cerpadla2.html" rel="lightbox" title="Čerpadla"><img src="obrazky\cerpadlo.jpg" alt="Čerpadla" width="210" height="170" border="2" style="float: right; margin:"></a></td>
<td align="center"><a href="kolektory.html" rel="lightbox" title="Kolektory"><img src="obrazky\kolektory.jpg" alt="Plošné kolektory" width="210" height="170" border="2" style="float: none; margin:" ></a></td>
<td align="center"><a href="vzduch.html" rel="lightbox" title="Vzduchová"><img src="obrazky\vzduch.jpg" alt="Vzduchová" width="210" height="170" border="2" style="float: none; margin-right 25px"></a></td>
</tr>
</table>
</html>

Dělám si to v PSPaDu a pokud si tu stránku zobrazíte, tak bych potřeboval obrázek vrtu(obr.č1) aby byl pod názvem vrt, obrázek s kolektorem aby byl pod názvem Plošný kolektor a to samé i u obrázku č.3.
Předem díky moc.
Anika
Profil *
#4 · Zasláno: 7. 7. 2009, 10:47:54
Odpovědět Citovat
Přidělej si ještě jeden řádek tabulky nad řádek s obrázky a tam si vlož ty názvy.
Asi takhe:
<table>
<tr>
<td>
Vrt
</td>
<td>
Plošný kolektor
</td>
<td>
Vzduchový systém
</td>
</tr>
<tr>
<td>
obrázek
</td>
<td>
obrázek
</td>
<td>
obrázek
</td>
</tr>
</table>
LosPivkos
Profil *
#5 · Zasláno: 8. 7. 2009, 14:59:47
Odpovědět Citovat
Omlouvám se, že takhle otravuju, ale když jsem to udělal, tak ty názvy mám vedle sebe, čim mezi nimi udělám mezeru?
Posílám zápis:

<!DOCTYPE HTML PUBLIC "-//W3C/DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>PowerProject</title>
<meta name="keywords" content=" powerproject, teplo," />
</head>
<body bgcolor="yellow">
<div align="center" id="nadpis">
<font size="8" face="Cooper Black" color="#3300CC" "nazevstranky">Podle získávání tepla</font>
</div>
<br><br><br><br><br>
<table width="0" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td>Vrt</td>
<td> Plošný kolektor </td>
<td> Vzduchový systém </td>
</tr>
</table>
<br><br><br><br>
<table width="410" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center"><a href="cerpadla2.html" rel="lightbox" title="Čerpadla"><img src="obrazky\cerpadlo.jpg" alt="Čerpadla" width="210" height="170" border="2" style="float: right; margin:"></a></td>
<td align="center"><a href="kolektory.html" rel="lightbox" title="Kolektory"><img src="obrazky\kolektory.jpg" alt="Plošné kolektory" width="210" height="170" border="2" style="float: none; margin:" ></a></td>
<td align="center"><a href="vzduch.html" rel="lightbox" title="Vzduchová"><img src="obrazky\vzduch.jpg" alt="Vzduchová" width="210" height="170" border="2" style="float: none; margin-right 25px"></a></td>
</tr>
</table>
</html>
Anika
Profil *
#6 · Zasláno: 8. 7. 2009, 18:05:33
Odpovědět Citovat
Hlavní chyba je vtom, že tam máš dvě tabulky a ne jednu tabulku o dvou řádcích.
Zkus tohle:


<!DOCTYPE HTML PUBLIC "-//W3C/DTD HTML 4.01 Transitional//EN"
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">;
<title>Powerproject</title>
<style>
table {text-align:center}
img {margin-left:10px; margin-right:10px; margin-top:30px; width:210px; height:170px}
body {background-color:yellow}
h1 {color:#3300CC; font-size:300%}
#hlavni {margin-left:auto; margin-right:auto; width:750px}
</style>
</head>

<body>
<div style="text-align:center">
<div id="hlavni">
<h1>Podle získávání tepla</h1>
<table>
<tr>
<td><h2>Vrt</h2></td>
<td><h2> Plošný kolektor</h2> </td>
<td><h2> Vzduchový systém</h2> </td>
</tr>
<tr>
<td><a href="cerpadla2.html" rel="lightbox" title="Čerpadla"><img src="obrazky\cerpadlo.jpg" alt="Čerpadla" width="210" height="170" border="2" ></a></td>
<td><a href="kolektory.html" rel="lightbox" title="Kolektory"><img src="obrazky\kolektory.jpg" alt="Plošné kolektory" width="210" height="170" border="2" ></a></td>
<td ><a href="vzduch.html" rel="lightbox" title="Vzduchová"><img src="obrazky\vzduch.jpg" alt="Vzduchová" width="210" height="170" border="2" ></a></td>
</tr>
</div>
</div>
</body>
</html>

Mezera mezi obrázky se zvětší nebo zmenší, když upravíš hodnoty u margin-left a margin-right u img ve <style> v hlavičce, ale dej si pozor, ať všechny součty marginy + šířka obrázů + rámečků není víc než 750px, to je šířka stránky.
Margin-top:30px nastyví o kolik budou obrázky dole pod nadpisy, když napíšeš víc, odskočí dolů.
Snad jsem správně pochopila tvůj problém.

Nestačí k obrázkům napsat rel="lightbox" to nebude fungovat.
Float je tam nanic.
Do tabulky o šířce 410 se nemůžou vejít tři obrázky o šířce 210 a ještě mezery.
Používej pro nadpisy tagy <h1><h2> atd., je to dost důležité kvůli struktuře dokumentu, vyhledávačům, aby poznaly, co je důležité a podobně.
Anika
Profil *
#7 · Zasláno: 8. 7. 2009, 18:07:47
Odpovědět Citovat
Teď jsem si všimla, že jsem zapomněla smazat width="210" a height="170" u všech obrázků, to už je ve <style>, tady už je to zbytečné.
Anika
Profil *
#8 · Zasláno: 8. 7. 2009, 18:14:21
Odpovědět Citovat
Ještě omluva, v tom kódu jsem zapomněla uzavřít tabulku - za poslední </tr>
patří </table>. Jsem hlava děravá.
LosPivkos
Profil *
#9 · Zasláno: 8. 7. 2009, 20:04:07
Odpovědět Citovat
Díky moc, takhle jsem to přesně potřeboval, doufám, že jednou to budu umět jako ty, ještě jednou díky, moc mi to pomohlo.
Časová prodleva: 15 let

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0