Změna pozadí
(Pro novou verzi eStránek)
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: | NE | - Jiná struktura CSS šablon. Návod pro současnou verzi eStránek zde. |
Nová verze eStránek: | ANO |
Testováno 5. září 2009
Šablona A
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { background-color:#bc56a3; font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; text-align: center; color: #000; font-size: 70%;} |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
#document {background-image:url(<!--/ img_root /-->bg.jpg); background-position:top center; background-repeat:no-repeat; border-top:1px solid #fc6edc;padding-top:40px;} #in-document {position:relative; width:960px; margin:0px auto; text-align:left; background: url(<!--/ img_root /-->bg-body.gif) repeat-y; background-position:200px 45px;} |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona B
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { font: 70%/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; text-align: center; color: #FFF; background: #A4D5FF url(<!--/ img_root /-->body.gif) top left repeat-x; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona Byznys - aqua
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { font: small/1.5 "trebuchet ms", arial, helvetica, sans-serif; text-align: center; background: url('<!--/ img_root /-->bg.gif') repeat; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona C
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { color: black; margin-bottom: 10px; background: #ff6b19 url('<!--/ img_root /-->03e_bg.jpg') repeat-x; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona D
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body{background:#CCEA81;text-align:center;font-family:Tahoma,Arial,sans-serif;font-size:.8em;margin:0px;padding:0px} |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
#document{width:810px;background:url(<!--/ img_root /-->bkg.jpg) repeat-y white} #in-document{margin:0 25px;} |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona E
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { font: 70%/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; text-align: center; color: #FFF; background-color: #223034; font-size: 0.8em; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona F
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body{font:medium/1.5 sans-serif;_font-size:small;text-align:center;color:#FFF;background:#b9b9b9 url(<!--/ img_root /-->body.gif) top left;} |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
#document{padding:20px 0;color:#565656;background:url(<!--/ img_root /-->document.gif) top left repeat-x;} #in-document{width:710px;margin:0 auto;text-align:left;background-color:#fff;} |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona G
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body{font:70%/1.5 Tahoma,"Lucida Grande CE",lucida,sans-serif;text-align:center;color:#fff;background:#393b3d url(<!--/ img_root /-->body.gif) top left repeat-x;} |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona H
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
html, body { color: #7f675c; background: #17100c url(<!--/ img_root /-->bg_body.png) repeat-x; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
.column { background: url(<!--/ img_root /-->bg_column.png) repeat-x; } .column h2, #articles .article h2, .folder-info h3 { font-size: 150%; font-weight: normal; text-align: left; } |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona I
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body{background-color:#eae5ce; font-family:"Trebuchet MS",Verdana,Arial,Helvetica,sans-serif; text-align:center; color:#6c4c29;} |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
#document{background:url(<!--/ img_root /-->bg.gif) repeat-x top left;} #in-document{position:relative; width:780px; margin:0px auto;text-align:left; padding-top:110px;} |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona J
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { height: 100%; background: #292929; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
#whole-page { background: #3a3a3a; position: relative; min-height: 100%; height: auto; _height: 100%; =overflow: hidden; _overflow: visible; } #document { background: url('<!--/ img_root /-->document.jpg') left top repeat-x; padding: 45px 0 0px 0; } |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona K
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
html, body {background: #2d2823;} body { font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; text-align: center; color: #ffffff; font-size: 75%; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
/* 2. Layout -------------------------------------------------------------*/ #whole-page {position:relative;background: url(<!--/ img_root /-->bg.gif) repeat-y top center;} |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona L
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { background: #33251b; font: 75%/1.5 Tahoma, sans-serif; text-align: center; color: black; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
#document { background: url("<!--/ img_root /-->body.jpg") repeat-x; } #document #in-document { background: url(<!--/ img_root /-->document.jpg) right top no-repeat; position: relative; width: 752px; _width: 762px; padding-right: 10px; margin: 0 auto; text-align: left; } |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona M
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { text-align: center; font: 80%/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; color: #000; background: #4e4e4e url('<!--/ img_root /-->body.gif') center top repeat-y; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona N
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body {margin: 0px; padding: 0px; background: url('<!--/ img_root /-->bkg.jpg') #393939; text-align: center; font-family: Verdana; font-size: .7em; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona O
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { font: 70%/1.5 Verdana, "Geneva CE", lucida, sans-serif; text-align: center; color: #050505; background: #484848 url('<!--/ img_root /-->bg.gif'); margin: 0px; padding: 0px; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona P
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
html, body { color: #787876; background: white; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
#whole-page { width: 100%; } #document { background: #fefef4; } #document #in-document{ } |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona Q
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { background: #1a242e; font: 75%/1.5 "trebuchet ms", arial, helvetica, sans-serif; text-align: center; color: #3f5057; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
#document { background: url('<!--/ img_root /-->bg.jpg') repeat-x; padding: 20px 0; } #document #in-document { position: relative; width: 799px; margin: 0 auto; text-align: left; } |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona R
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { text-align: center; font: 80%/1.5 sans-serif; color: #fff; background: #000 url('<!--/ img_root /-->body.jpg') center top no-repeat; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona S
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { background: #252525; font-family: sans-serif; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
#whole-page { position: relative; min-width: 910px; background: #343434; border: solid 1px black; border-width: 1px 0 0 0; text-align: center; } |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona Světla
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { background: #023353 /*url('<!--/ img_root /-->bgbody.jpg')*/; /*023351*/ font-family: "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif; text-align: center; color: #fff; font-size: 12px; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
#whole-page { background: url("<!--/ img_root /-->bg_main.jpg") no-repeat top center; position: relative; } |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona T
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { margin: 0px; padding: 0px; background: url('<!--/ img_root /-->bodyBkg.png') #ebe8e3; text-align: center; font-family: Verdana; font-size: 11px; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona U
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { background:url('<!--/ img_root /-->pattern.png'); } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona V
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { margin: 0; padding: 0px; background: url('<!--/ img_root /-->pageBkgBottom.png') repeat-x #EFC72A 50% 100%; text-align: center; font-family: Verdana; font-size: 11px } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
#page-bkg { background: url('<!--/ img_root /-->pageBkg.png') repeat-x transparent; } |
červeně - Toto smažte.
4. Uložte a máte hotovo
Šablona W
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { position:relative; font: 80%/1.5 Tahoma, sans-serif; text-align: center; background:#fff url(<!--/ img_root /-->bg-body.gif) repeat-y center top; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona Y
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
html { /*background: #2c1d12 url(<!--/ img_root /-->bg_footer.png) 50% 100% no-repeat; */ background: #2c1d12; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona Z
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
html, body { background: #183846; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Uložte a máte hotovo
Šablona Zeleň - černý
1. V CSS (Nastavení - Vzhled - Design - Upravit CSS) najdi toto:
body { text-align: center; font: 75%/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; color: #9c9c9c; background: #282828 url('<!--/ img_root /-->body.jpg') 0 0; } |
2. Změň modrou část na:
background: barva url(urlobrazku); |
barva - Vložte HTML kód barvy.
urlobrazku - Vložte URL obrázku na pozadí. Pokud chcete mít na pozadí pouze barvu, tak smažte url(urlobrazku).
3. Dále najdi:
#whole-page { overflow: hidden; width: 100%; background: url('<!--/ img_root /-->wholepage.jpg') 0 0 repeat-x; } |
červeně - Toto smažte.
4. Uložte a máte hotovo
Nepohyblivé obrázkové 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ářů
Ahoj Tomáši!
Na stránkách www.mrhanky.estranky.cz nemohu po převedení na novou verzi celé zobrazení stránek dostat do středu,stále se to zarovnává zleva. Když udělám jakoukoli úpravu CSS, vše se srovná dle středu, ale zase zmizí pozadí (obrázek)v lastní header (obrázek)a některé moduly např. toplist. Protože jsem měl původní šablonu J zcela změněnu v nastavení šablony i v CSS, telefonicky jsem domluvil s operátorkou estranek, že stránky převedou "ručně" při zachování designu. Po úpravě mám tedy tyto problémy. Pokud by si měl čas, podívej se mi na to, už jsi mi jednou poradil, tak to zkouším znova. Děkuji, Petr Vacek, petr.vacek@eurovia.cz
Irena - vicenasobne smazani
dobrý večer, potřebovala bych poradit jak smazatnějaké uložené soubory, více najednou..
díky irena
irena.janysova@seznam.cz
Petr Vacek - vycentrování stránek