| Autor | Zpráva | ||
|---|---|---|---|
| Avoš Profil |
#1 · Zasláno: 19. 6. 2011, 12:45:36
Ahoj, s tvorbou webu začínám, veškerý znalosti jsem našel na této stránce (díky Bohu za ni! :) ), dělám teď jeden (úplně první) web, ale dostal jsem se do problému, potřeboval bych poradit. Nevím, kde to najít, už jsem i nějaký rady našel, ale pořád mi to nefunguje. Tak tedy k "problému":
Ve stránce nějak "kombinuju" html s css, moje stránka se dělí na 3 oddíly - hlavičku, obsah a patičku. V obsahu mám obrázek s odkazy, kterej funguje v pohodě. Tyto 3 divy jsem napsal pomocí <style> - #header {position: absolute; top: 0px; margin-left: auto; margin-right: auto;}, v body potom pomocí <div id="header"> mi to funguje v pohodě, i obsah a patka. Ale bohužel, chci udělat jednu věc, a to dát obsahu a patce pozadí, na který bych potom mohl vložit libovolnej obsah. Vyzkoušel jsem už skoro vše, nefunguje ani background-image url("cesta"), vůbec nic. Možná, že je problém v hlavičce, protože tam mám jen <title> a <style> divů, na začátku a konci souboru <html>, nemá se nějak definovat styl css, aby mi to ten obrázek na pozadí divu "sežralo"? No a když už teda píšu, nemohl jsem ani nikde najít, jakým kódem změnit odkaz po najetí myši (odkaz mám obrázek, aby se mi ukázal jiný obrázek - např. text s jiným podsvícením, který udělám ve Photoshopu a nahraju na web). Díky moc za pomoc, v popisu fóra jsem četl "nebojte se zeptat na libovolnou blbost", takže i když vím, že to nakonec asi bude stupidní, raději se zeptám, než abych to dva dny hledal :) |
||
| jenikkozak Profil |
#2 · Zasláno: 19. 6. 2011, 12:58:10
Jedna živá ukázka je lepší než tisíc slov. :-)
Změnu obrázků můžeš udělat také pomocí CSS. Odkazům nastavíš nějaký obrázek na pozadí, pak využiješ pseudotřídy hover, kterou tento obrázek změníš. |
||
| Avoš Profil |
#3 · Zasláno: 19. 6. 2011, 14:02:41 · Upravil/a: Avoš
Dobře, udělal jsem tedy "živou ukázku", tak do mě :) K problémům se zobrazováním v prohlížečích jsem se ještě nedostal, kdyby to někomu nejelo a věděl proč, tak jsem jedno ucho, díky moc :)
Zapomněl jsem odkaz :D |
||
| jenikkozak Profil |
#4 · Zasláno: 19. 6. 2011, 14:09:47
Avoš:
Na odkázané stránce ale nejsou tři divy. Je tam jen jeden. Ona tak nějak celkově neodpovídá tomu psanému popisu. |
||
| Avoš Profil |
#5 · Zasláno: 19. 6. 2011, 14:17:54
Jakto? Jsou tam vlastně 4 divy, jeden je "obalovací" sloužící k vycentrování stránky. Když dáš zobrazit zdrojový kód, tak si odmyslíš reklamu WZ a vyjde ti docela krátkej zdroják.
<html> <head> <title>ČížekFest 2011 Dlouhomilov</title> <style> #header {position: absolute; top: 0px; margin-left: auto; margin-right: auto;} #obsah {position: absolute; top: 420px; margin-left: auto; margin-right: auto;} #patka {position: absolute; top: 1480px; left: 0px;} </style> </head> <body style="background-color: black"> <div style="width: 840px; margin-left: auto; margin-right: auto;"> <div id="header"><img src="images/header.jpg" align="center"> <a href="index.html"><img src="images/program.gif" align="center"></a> <a href="kapely.html"><img src="images/kapely.gif" align="center"></a> <a href="galerie.html"><img src="images/galerie.gif" align="center"></a> <a href="mapa.html"><img src="images/mapa.gif" align="center"></a></div> <div id="obsah"><img src="images/obsah.gif" align="center"></div> <div id="patka"><img src="images/patka.gif"></div> </div> </body> </html> Mám teď namysli jen hlavní stranu, ostatní budou skoro stejný. Do divů "obsah" a "patka" jsem dal pro představu ten obrázek, kterej chci, aby byl na pozadí divu. |
||
| okolojdouci Profil * |
#6 · Zasláno: 19. 6. 2011, 14:31:04
Avoš:
<html>
<head>
<title>ČížekFest 2011 Dlouhomilov</title>
<style>
</style>
</head>
<body style="background-image: url('images/bg.jpg'); background-repeat: repeat-x;">
<div style="width: 840px; margin-left: auto; margin-right: auto;">
<img src="images/header.jpg" align="center"><br>
<a href="index.html"><img src="images/program.gif" align="center"></a>
<a href="kapely.html"><img src="images/kapely.gif" align="center"></a>
<a href="galerie.html"><img src="images/galerie.gif" align="center"></a>
<a href="mapa.html"><img src="images/mapa.gif" align="center"></a>
</div>
</body>
</html> |
||
| Avoš Profil |
#7 · Zasláno: 19. 6. 2011, 14:46:21
Už jsem to spravil, zdroják by se měl zobrazovat správně, podle popisu. Díky za pomoc s těma odkazama, určitě to vyzkouším, snad to půjde.
Zkusil jsem ale do divu obsah vložit pozadí na stránce index.html, ale nezobrazuje se mi. Kód je takovej: #obsah {background-image: url("images/obsah.gif"); position: absolute; top: 420px; margin-left: auto; margin-right: auto;} Mám tam něco špatně nebo jakej je důvod, že to nejde? |
||
| jenikkozak Profil |
#8 · Zasláno: 19. 6. 2011, 15:04:57
Avoš:
„Mám tam něco špatně nebo jakej je důvod, že to nejde?“ Jde o to, že ten div má nulový rozměr, a tak se to pozadí nemá pod čím vykreslovat. Stačí tedy tomu divu „obsah“ nastavit nějaké rozměry, nebo do něj něco vložit. Nedoporučuji ale absolutní pozicování, kterým skládáš divy pod sebe. Budou-li divy mít nějaký obsah, budou se svými rozměry tomuto obsahu přizpůsobovat. Tím, že např. patička má přesně shora určenou pozici, v případě, že obsah stránky bude delší, bude se s patičkou překrývat. Řešení tohoto problému je jednoduché. Stačí vymazat to „position: absolute“ u záhlaví, obsahu i patičky. Dále se také mohou smazat definice polohy. |
||
|
Časová prodleva: 13 let
|
|||
0