Archiv rubriky: Rychlokurz CSS

Budu využívat některé pojmy z předchozího návodu.

Změna barvy
Pro podrobnější vysvětlení se podívejte na předchozí návod.

Pokud nechcete měnit obě vlastnosti, stačí vynechat jeden z řádků background-color: a color:.

Vybral jsem si barvu #b50a16 pro pozadí a #ffffff pro text.
Levé tlačítko (Zpět do obchodu)
Pro levé tlačítko se používá selektor .added_to_cart_popup .btn.btn-default.

.added_to_cart_popup .btn.btn-default {
    background-color: #b50a16;
    color: #ffffff;
}

Pravé tlačítko
Pro pravé tlačítko se používá selektor .added_to_cart_popup .btn.btn-primary

CSS si můžete doplnit v nastavení vzhledu Vašeho eshopu v záložce Vaše doplňkové CSS, svůj kód pište do stejnojmenného pravého textového pole.

Níže Vám prakticky ukážu jak si změnit barvu tlačítka Přidat do košíku, nyní Vám zbežně představím syntaxi CSS.

CSS slouží zejména k upravování vzhledu stránek, základní syntaxe by se dala napsat takto:

selektor {
    vlastnost: hodnota;
    další_vlastnost: hodnota !important;
}

Selektor označuje na co se mají aplikovat pravidla napsaná uvnitř závorek. Vlastnost může být v podstatě cokoliv, co se týče vzhledu (velikost, barva, odsazení, …). Hodnota se pak různí, je závislá na zvolené vlastnosti. Na konci jednoho řádku můžete vidět !important, je to nepovinný zápis, který řekne prohlížeči, aby upřednostnil hodnotu vlastnosti v tomto řádku před ostatními. Středník (;) poté rozděluje jednotlivé vlastnosti.