Změna pozadí
Checete si dát nějaký svůj obrázek na pozadí vaší stránky nebo jen nějakou barvu? Postupujte podle tohoto návodu:
Kompatibilita
Současná verze eStránek: | ANO | |
Nová verze eStránek: | NE | - Jiná struktura CSS šablon. Návod pro novou verzi eStránek zde. |
Testováno 26. srpna 2009
Barva na pozadí
Šablona A
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font-family: Arial, sans-serif; color: black; text-align: center; font-size: small; fo\nt-size: middle; background-color: white; } |
2. Změň na:
body { font-family: Arial, sans-serif; color: black; text-align: center; font-size: small; fo\nt-size: middle; background-color: barva; } |
barva - Místo toho vložte HTML kód barvy.
3. Uložte a máte hotovo
Šablona B
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font-family: Tahoma, Arial, sans-serif; color: black; text-align: center; font-size: small; fo\nt-size: middle; background: #A4D5FF url("<!-- cssimgroot -->02background.png") repeat-x; } |
2. Změň na:
body { font-family: Tahoma, Arial, sans-serif; color: black; text-align: center; font-size: small; fo\nt-size: middle; background: barva; } |
barva - Místo toho vložte HTML kód barvy.
3. Uložte a máte hotovo
Šablona C
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font-family: Tahoma, Arial, sans-serif; color: black; text-align: center; font-size: small; fo\nt-size: middle; background: #F5FDD9 url("<!-- cssimgroot -->03background.png") repeat-x; padding-bottom: 20px; } |
2. Změň na:
body { font-family: Tahoma, Arial, sans-serif; color: black; text-align: center; font-size: small; fo\nt-size: middle; background: barva; padding-bottom: 20px; } |
barva - Místo toho vložte HTML kód barvy.
3. Uložte a máte hotovo
Šablona D
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
#bgobsah { background: #653808 url("<!-- cssimgroot -->04h_background.gif") 50% 0 repeat-y; } |
2. Změň na:
#bgobsah { background: barva; } |
barva - Místo toho vložte HTML kód barvy.
3. Uložte a máte hotovo
Šablona E
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font-family: Tahoma, Arial, sans-serif; color: #9EE5EB; text-align: center; font-size: small; fo\nt-size: middle; background: #223034 url("<!-- cssimgroot -->05background.gif") repeat-x; } |
2. Změň na:
body { font-family: Tahoma, Arial, sans-serif; color: #9EE5EB; text-align: center; font-size: small; fo\nt-size: middle; background: barva; } |
barva - Místo toho vložte HTML kód barvy.
3. Uložte a máte hotovo
Šablona F
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font-family: Tahoma, Verdana, Arial, lucida, sans-serif; background: #c7d9a5 url("<!-- cssimgroot -->06g_body.gif"); color: #000; font-size: x-small; text-align: center; min-width: 760px; line-height: 1.5; } |
2. Změň na:
body { font-family: Tahoma, Verdana, Arial, lucida, sans-serif; background: barva; color: #000; font-size: x-small; text-align: center; min-width: 760px; line-height: 1.5; } |
barva - Místo toho vložte HTML kód barvy.
3. Najdi
#page { padding-top: 15px; height: 100%; background: url("<!-- cssimgroot -->06g_back.gif") repeat-x; } |
fialově - Toto smažte
4. Uložte a máte hotovo
Šablona G
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font: small/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; color: black; text-align: center; background: #393b3d url('<!-- cssimgroot -->g/body.gif') repeat-x; } |
2. Změň na:
body { font: small/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; color: black; text-align: center; background: barva; } |
barva - Místo toho vložte HTML kód barvy.
3. Uložte a máte hotovo
Šablona H
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font-family: Tahoma, Verdana, Arial, lucida, sans-serif; background: #B49E75 url("<!-- cssimgroot -->h/bg.png"); color: #000; font-size: x-small; text-align: center; min-width: 760px; line-height: 1.5; } |
2. Změň na:
body { font-family: Tahoma, Verdana, Arial, lucida, sans-serif; background: barva; color: #000; font-size: x-small; text-align: center; min-width: 760px; line-height: 1.5; } |
barva - Místo toho vložte HTML kód barvy.
3. Uložte a máte hotovo
Šablona I
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
#page { background: #d2ebf2; padding-top: 15px; height: 100%; font-size: 90%; } |
2. Změň na:
#page { background: barva; padding-top: 15px; height: 100%; font-size: 90%; } |
barva - Místo toho vložte HTML kód barvy.
3. Uložte a máte hotovo
Šablona J
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
#text { clear: both; margin-top: 20px; background: #18436b url('<!-- cssimgroot -->j/5/content_wrap.jpg') top left repeat-x; } |
2. Změň na:
#text { clear: both; margin-top: 20px; background: barva; } |
barva - Místo toho vložte HTML kód barvy.
3. Uložte a máte hotovo
Obrázek na pozadí
Šablona A
1. Nahraj na stránky svůj obrázek
2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font-family: Arial, sans-serif; color: black; text-align: center; font-size: small; fo\nt-size: middle; background-color: white; } |
3. Změň na:
body { font-family: Arial, sans-serif; color: black; text-align: center; font-size: small; fo\nt-size: middle; background: white url("urlobrazku"); } |
urlobrazku - Změň na URL vašeho obrázku
4. Uložte a máte hotovo
Šablona B
1. Nahraj na stránky svůj obrázek
2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font-family: Tahoma, Arial, sans-serif; color: black; text-align: center; font-size: small; fo\nt-size: middle; background: #A4D5FF url("<!-- cssimgroot -->02background.png") repeat-x; } |
3. Změň na:
body { font-family: Tahoma, Arial, sans-serif; color: black; text-align: center; font-size: small; fo\nt-size: middle; background: #A4D5FF url("urlobrazku"); } |
urlobrazku - Změň na URL vašeho obrázku
4. Uložte a máte hotovo
Šablona C
1. Nahraj na stránky svůj obrázek
2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font-family: Tahoma, Arial, sans-serif; color: black; text-align: center; font-size: small; fo\nt-size: middle; background: #F5FDD9 url("<!-- cssimgroot -->03background.png") repeat-x; padding-bottom: 20px; } |
3. Změň na:
body { font-family: Tahoma, Arial, sans-serif; color: black; text-align: center; font-size: small; fo\nt-size: middle; background: #F5FDD9 url("urlobrazku"); padding-bottom: 20px; } |
urlobrazku - Změň na URL vašeho obrázku
4. Uložte a máte hotovo
Šablona D
1. Nahraj na stránky svůj obrázek
2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
#bgobsah { background: #653808 url("<!-- cssimgroot -->04h_background.gif") 50% 0 repeat-y; } |
3. Změň na:
#bgobsah { background: #653808url("urlobrazku"); } |
urlobrazku - Změň na URL vašeho obrázku
4. Uložte a máte hotovo
Šablona E
1. Nahraj na stránky svůj obrázek
2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font-family: Tahoma, Arial, sans-serif; color: #9EE5EB; text-align: center; font-size: small; fo\nt-size: middle; background: #223034 url("<!-- cssimgroot -->05background.gif") repeat-x; } |
3. Změň na:
body { font-family: Tahoma, Arial, sans-serif; color: #9EE5EB; text-align: center; font-size: small; fo\nt-size: middle; background: #223034 url("urlobrazku"); } |
urlobrazku - Změň na URL vašeho obrázku
4. Uložte a máte hotovo
Šablona F
1. Nahraj na stránky svůj obrázek
2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font-family: Tahoma, Verdana, Arial, lucida, sans-serif; background: #c7d9a5 url("<!-- cssimgroot -->06g_body.gif"); color: #000; font-size: x-small; text-align: center; min-width: 760px; line-height: 1.5; } |
3. Změň na:
body { font-family: Tahoma, Verdana, Arial, lucida, sans-serif; background: #c7d9a5 url("urlobrazku"); color: #000; font-size: x-small; text-align: center; min-width: 760px; line-height: 1.5; } |
urlobrazku - Změň na URL vašeho obrázku
4. Najdi
#page { padding-top: 15px; height: 100%; background: url("<!-- cssimgroot -->06g_back.gif") repeat-x; } |
fialově - Toto smažte
5. Uložte a máte hotovo
Šablona G
1. Nahraj na stránky svůj obrázek
2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font: small/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; color: black; text-align: center; background: #393b3d url('<!-- cssimgroot -->g/body.gif') repeat-x; } |
3. Změň na:
body { font: small/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; color: black; text-align: center; background: #393b3d url('urlobrazku'); } |
urlobrazku - Změň na URL vašeho obrázku
4. Uložte a máte hotovo
Šablona H
1. Nahraj na stránky svůj obrázek
2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
body { font-family: Tahoma, Verdana, Arial, lucida, sans-serif; background: #B49E75 url("<!-- cssimgroot -->h/bg.png"); color: #000; font-size: x-small; text-align: center; min-width: 760px; line-height: 1.5; } |
3. Změň na:
body { font-family: Tahoma, Verdana, Arial, lucida, sans-serif; background: #B49E75 url("urlobrazku"); color: #000; font-size: x-small; text-align: center; min-width: 760px; line-height: 1.5; } |
urlobrazku - Změň na URL vašeho obrázku
4. Uložte a máte hotovo
Šablona I
1. Nahraj na stránky svůj obrázek
2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
#page { background: #d2ebf2; padding-top: 15px; height: 100%; font-size: 90%; } |
3. Změň na:
#page { background: #d2ebf2 url('urlobrazku'); padding-top: 15px; height: 100%; font-size: 90%; } |
urlobrazku - Změň na URL vašeho obrázku
4. Uložte a máte hotovo
Šablona J
1. Nahraj na stránky svůj obrázek
2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:
#text { clear: both; margin-top: 20px; background: #18436b url('<!-- cssimgroot -->j/5/content_wrap.jpg') top left repeat-x; } |
3. Změň na:
#text { clear: both; margin-top: 20px; background: #18436b url('urlobrazku'); } |
urlobrazku - Změň na URL vašeho obrázku
4. Uložte a máte hotovo
Nepohyblivé pozadí
Pokud chcete mít nepohyblivé pozadí, jako je na těchto stránkách.
Za url ('urlobrazku'); vložte background-attachment: fixed;
Komentáře
Přehled komentářů
Funguje to-Díky!
Pepa - dotaz
Ahoj Tome, zkus vložit na nějaké nové šabloně do fotoalba video z YouTube, při slideshow je video nad fotkou ... :-( Dalo by se s tím něco udělat? Existují kody html či CCS aby srovnali zobrazování vrstev či tak něco? Už jsem to psal na podporu eStránek, anyd s tím něco udělají. Blbne to IE a Opeře ...
Tomáš Hypeš - Re: pomoc pozadá
body { text-align: center; font: 80%/1.5 Tahoma, \"Lucida Grande CE\", lucida, sans-serif; color: #000; background:#FCFE9A url(\'/img/picture/4/pozadi.jpg\') center top repeat-y; background-attachment: fixed; }
hr { display: none; }
Pepa - pomoc pozadá
Ahoj Tome,
pleas help,
zkoušel jsem dle Tvé rady udělat nepohyblivé pozadí, zastavilo se mi ale zrušilom mi příkaz top center. Posílám kus kodu viz níže, jak tam správně vepsat kod pro fixní pozadí? Předem díky
body { text-align: center; font: 80%/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; color: #000; background:#FCFE9A url('/img/picture/4/pozadi.jpg') center top repeat-y; }
hr { display: none; }
Tomáš Hypeš - Re: nepohyblivé pozadie
Musíte si stáhnout novější IE, ono několik let starý prohlížeč není dobré používat. Je snad jasné, že vám toho tam hodně fungovat nebude.
zajo - nepohyblivé pozadie
tak máte pravdu, tento problem je len pri IE pri opere je to ok, v tomto prípade si asi nepomôžem , alebo áno ?
zajo - nepohyblivé pozadí
to pozadie nie je nepohyblivé ale zložené z viacerých textúr , vidno medzi nimi prechody
Mám operu i IE
zajo - nepohyblivé pozadí
Zdravím použil som vaš návod na zmenu v šablóne I som zmenil textúru a následne som chcel znehybniť pozadie ako u vás ale veta background-attachment: fixed;nefunguje . Viete mi poradiť ? Ďakujem
Tomáš Hypeš - Re: Změna barvy pozadí
Co je odborného na "Jméno již existuje."??? Řešení se samo nabízí - přece ho změním!!! Mě udivuje, že na to nepříjdete sami. Promiň, ale si miliontá, kdo s tím má problém.
Přichystalová Mila - Změna barvy pozadí
Postupuji podle návodu a změna pozadí prostě nejde.Vždy se mě ukáže nad tabulkou s kódy,že název již existuje.Kde je prosím chyba.
Ještě mám dotaz,zda se dá změnit šablona,dříve jsem to bez úspěchu zkoušela,také se mě ukazovalo,že název již existuje.Měla bych dodat,že jsem samouk,takže neznám některé odborné názvy.Chtěla bych nějaká vylepšení na mých stránkách a potřebuji poradit,bylo by to možné emailem?
Děkuji za odpověď.
Tomáš Hypeš - Re: fotka na pozadie
Protože to CSS neumí. Na pozadí by měli být textury a ne fotky.
Martin - fotka na pozadie
ked si vlozim fotku na pozadie tak cela nezkryje pluchu co by mala....preco?
Tomáš Hypeš - RE:www.denko94.estranky.sk
Nebo na VIP proram jako mám já. Na zdarma to jde taky, ale je to ZBYTEČNĚ SLOŽITÉ.
Denko94 - www.denko94.estranky.sk
Ahoj,vložiť svoj obrázok na pozadie tak ako máš ty tie lebky sa dá iba tomu,kto má estranky platené???
Georgia - Dík-nepohyblivé pozadí