0 Kč s DPH

Úprava hlavičky a patičky stránek

12. 11. 2013

Chcete-li si změnit barevnost hlavičky či patičky, přečtěte si tento článek. Je to jednoduché.

Zvolilt můžete jinou barvu, barevný přechod i vlastní obrázek. Vše jsme vám již vysvětlovali ve článcích: Vylepšete si pozadí stránek s online generátory a Jak změnit pozadí webových stránek.

Ukážeme vám tedy jen příklady, jak měnit šablonu Eris.

Barva hlavičky

Jistě jste si všimli, že hlavička šablony je průhledná. Tuto průhlednost má na svědomí zápis barev v režimu RGBA. Jde o zápis klasických barev RGB k nimž se ještě připojuje alfa kanál, tedy průhlednost v rozmezí od 0 do 1. Více o barvách se můžete dozvědět ve článku uživatelské CSS základy.

0 = zcela transparentní
1 = neprůhledná

Změnit ji můžete tímto kódem:

#header-fix {background-color: rgba(198, 231, 237, 0.95); }

ukazka hlavičky

Patička

V tomto příkladu si ukážeme jak patičku ztmavit do černé. Pokud chcete patičku zesvětlit, či použít svůj obrázek, budete potřebovat přepsat i barevnost textů
v patičce.

Barva patičky

kód:

body, #footer {background-color: #000000;}

poznámka ke kódu: body je použit, protože patička (#footer) se roluje vždy až na konec stránky, vlastní tělo stránky tvoří div wrapper.

Změna barvy písma v patičce

Je zapotřebí přepsat kontakt i menu tímto kódem:

#contact, #side-menu a, #side-menu li a:visited {color: #5093F4;}

Barva proužku

Chcete-li změnit proužek, kterým začíná patička, napište následující kód:

#footer {border-top: 4px solid #E79E43;}

zmena paticky

Kateřina Kolouchová
Webdesigner
admin(zav)zoner.cz

Přidat komentář

Přehled komentářů

  • pěkný článek

    22.5.2014 12:39:31 | pepa

    děkuji, dost mi článek pomohl. dobrá práce :-)

    Odpovědět

  • Dotaz

    18.6.2014 8:31:29 | Marie Farlíková

    Dobrý den,
    je možné upravit záhlaví tak, aby bylo logo v jedné rovině s hlavním menu - jak je to například zde: http://www.he-wa.cz/?

    Děkuji

    Odpovědět

  • RE: Dotaz

    18.6.2014 10:01:27 | Vladimír Souš

    Dobrý den Marie,
    určitě to možné je, prosím napište na email inpage@zoner.cz adresu vašich stránek a jednoduše vaše požadavky, určitě se nějak domluvíme. Hezký den.

    Odpovědět

  • Nezobrazuje se mi kontakt

    26.9.2014 15:04:00 | Martin Čejka

    Dobrý den,

    prosím pěkně o radu. Ač mám "konktakt" odfajfkovaný aby se zobrazoval, přesto se mi nezobrazuje.
    Nebo možná úplně jinak, bych poprosil o restart webu - promazání, abych jej začal vytvářet nově - po objednávce vyššího levelu.
    Děkuji pěkně.

    Doména jest webbar.cz. Martin Čejka

    Odpovědět

  • Kontakt

    26.9.2014 15:21:17 | Martin Čejka

    Dobrý dobrý, už vím kde je ve mě chyba :-)

    Odpovědět

  • Logo

    6.2.2015 6:10:24 | Lada

    Dobrý den, nemůžu přijít na to, jak udělat logo ve stejné velikosti jako obrázek motivu. Potřebuji posunout dolu menu a roztáhnout tím prostor pro logo. www.mochov-ts.cz , zobrazuje se dole useknuté. Děkuji L.Z.

    Odpovědět

  • RE: Logo

    6.2.2015 8:44:17 | Ondřej Jonáš

    Dobrý den, Lado,

    díval jsem se na Vaše stránky. Aby logo nebylo oříznuté, musíte zvětšit výšku u třídy logo. Tedy #logo { height:110px; } a obrázek už by neměl být oříznutý.
    Hezký den.

    Odpovědět

  • Logo

    6.2.2015 12:20:07 | Lada

    Dobrý den, jestli jsem pochopil správně, tak mám obrázek zvětšit a znovu vložit? Zkoušel jsem a obrázek se tam potom nevejde nebo kde mám zvětšit ten rozměr? Děkuji.

    Odpovědět

  • Prosba

    10.4.2015 16:29:04 | Jana Drakovac

    Dobrý den, prosím Vás jak odstraním nápis LOGO na našich web.stránkách balkantour.eu
    Taky bych chtěla vytvořit Úvodní stránku,kde by se mi fotka letadla rozrolovala na celou stránku.Jak na to prosím?
    Děkuji předem za info.

    Odpovědět

  • Barva patičky

    14.3.2017 21:04:51 | Zdenka Sekená

    Dobrý den,
    přesto, že postupuji podle Vašich odkazu, když nastavím barvu patičky Vašim kódem podbarví se mi celé pozadí webu, tak nevím kde dělám chybu.
    Stránky: https://www.kosmetickysalonbrno.com
    Děkuji za odpověď
    S pozdravem Zdenka Sekená

    Odpovědět | Zobrazit odpovědi

    • Re: Barva patičky

      15.3.2017 15:24:48 | Tým inPage

      Dobrý den,
      Pro změnu barvy v patičce je třeba v administraci zvolit vzhled → vlastni CSS styl a vložit zde tento kód do vlastních CSS stylů.

      #footer {
      background: #dda0dd;
      }
      #footer p {
      background-color: #dda0dd;
      }

      Odpovědět

      • Re: Re: Barva patičky

        15.3.2017 21:07:36 | Zdenka Sekená

        Dobrý den,
        moc děkuji za radu, podařilo se mi to podle Vás nastavit, ale patička zůstala moc široká vypadá to robustně, zkoušela sem různě upravit px, ale nepovedlo se.
        Děkuji za odpověď Zdenka Sekená

        Odpovědět

        • Re: Re: Re: Barva patičky

          16.3.2017 8:24:49 | Tým inPage

          Dobrý den,

          pro změnu rozměru patičky zkuste tento kód:

          #footer {
          padding:10px;
          }
          #footer p {
          padding: 8px
          }

          Odpovědět

inPage.cz - webové stránky, doména a webhosting snadno.