Jak vložit další obrázek k současnému pozadí webu? – Opencart

2. 1. 2016 20:44:13

Zdravím Vás,

prosím o pomoc. Rozhodl jsem se udělat menší změnu pro můj e-shop www.prokrasu.eu. K současnému pozadí webu chci dodat ještě obrázek ( např. prstýnek, který bude částečně schovaný za tělem webu a částečně vylezlý) . Napadla mě jediná možnost:

-vytvořit wallpaper a další obrázek (třeba prstýnek) napevno vložit (jenomže na jaké rozlišení to optimalizovat?) Pokud udělám tapetu na určité rozlišení, nebude se správně zobrazovat jiným zařízením

- nějaký css kód, se kterým tam nezávisle na současné tapetě budu schopen obrázek vložit. Ale netuším jaký. Něco jsem vygooglil, ale nefunguje to správně. Toto by byla nejschůdnější cesta..Poradíte?

Současný kód:

body {

background: url("../image/textured/textured2.png");

color: #000000;

font-family: 'Roboto Condensed', sans-serif;

margin: 0px;

padding: 0px;

Díky za pomoc

----------------------------

Tak jsem po hodinovém bádání a ladění zjistil, že zkusím-li se podívat na web na 12" uhlopříčce, tak ty elementy, jsou úplně jinde než u té 15,6"... Doufal, jsem, že se to zafixuje pro všechny uhlopřičky stejně...Nevíte jak na to?

2. 1. 2016 20:44:13

https://webtrh.cz/diskuse/jak-vlozit-dalsi-obrazek-k-soucasnemu-pozadi-webu-opencart#reply1162377

Smazany ucet 259

2. 1. 2016 20:46:37

CSS z-index property…

2. 1. 2016 20:46:37

https://webtrh.cz/diskuse/jak-vlozit-dalsi-obrazek-k-soucasnemu-pozadi-webu-opencart#reply1162376

Chip22

(2 hodnocení)

2. 1. 2016 20:51:50

Čili kód bude vypadat nějak takto?

body {

background: url("../image/textured/textured2.png");

color: #000000;

font-family: 'Roboto Condensed', sans-serif;

margin: 0px;

padding: 0px;

img {

position: absolute;

left: 0px;

top: 0px;

z-index: -1;

}

2. 1. 2016 20:51:50

https://webtrh.cz/diskuse/jak-vlozit-dalsi-obrazek-k-soucasnemu-pozadi-webu-opencart#reply1162375

Smazany ucet 259

2. 1. 2016 21:13:16

do CSS nemůžete umístit odkaz na obrázek tímto způsobem.

vytvořte si div s class například prsten. Tomuto divu nastavte velikost a background na obrázek prstenu.

Potom v CSS zapíšete: .prsten { ... }

Z-index bude potřeba nastavit nejspíš i u divu s obsahem. Ten musí mít vyšší číslo, než z-index .prsten.

2. 1. 2016 21:13:16

https://webtrh.cz/diskuse/jak-vlozit-dalsi-obrazek-k-soucasnemu-pozadi-webu-opencart#reply1162374

Jan Matoušek

2. 1. 2016 21:19:08

/* Edit: Vojtěch byl rychlejší :D */

Rozhodně ne. Nimdy nemůžete vkládat HTML kód do CSS :)

Přidejte do index.php (nebo hned pod začátek tagu , nevím v jakém souboru to OpenCart má - nejspíše v souborech šablony)

A do stylu šablony (nejspíše nějaké style.css) toto

Takto budete mít v levém horním rohu prstýnek. Pozici pozadí můžete upravit stylem ,,background-position", popř. změnit odsazení přidáním ,,margin-left/right" a ubráním šířky (width).

Doufám, že jsem tě alespoň nasměroval už teď správným směrem :)

2. 1. 2016 21:19:08

https://webtrh.cz/diskuse/jak-vlozit-dalsi-obrazek-k-soucasnemu-pozadi-webu-opencart#reply1162373

Chip22

(2 hodnocení)

2. 1. 2016 21:41:35

Boží....díky moc, takhle jsem nějak potřeboval nasměrovat...Ještě jednou díky

2. 1. 2016 21:41:35

https://webtrh.cz/diskuse/jak-vlozit-dalsi-obrazek-k-soucasnemu-pozadi-webu-opencart#reply1162372

Pavel Frcek

(14 hodnocení)

2. 1. 2016 22:59:17

Jen bych Vás upozornil, že na Macu máte rozsypaný ten banner na slevu. Nezobrazuje se to celé.

2. 1. 2016 22:59:17

https://webtrh.cz/diskuse/jak-vlozit-dalsi-obrazek-k-soucasnemu-pozadi-webu-opencart#reply1162371

Chip22

(2 hodnocení)

2. 1. 2016 23:03:51

Napsal Pavel Frcek;1252533
Jen bych Vás upozornil, že na Macu máte rozsypaný ten banner na slevu. Nezobrazuje se to celé.

Perfektní, děkuji za upozornění.

---------- Příspěvek doplněn 02.01.2016 v 23:31 ----------

---------- Příspěvek doplněn 02.01.2016 v 23:32 ----------

2. 1. 2016 23:03:51

https://webtrh.cz/diskuse/jak-vlozit-dalsi-obrazek-k-soucasnemu-pozadi-webu-opencart#reply1162370

Pavel Frcek

(14 hodnocení)

2. 1. 2016 23:39:03

co to zkusit ty hodnoty top, left, right, - napsat jako procentuální hodnotu?

zkuste a uvidíte

2. 1. 2016 23:39:03

https://webtrh.cz/diskuse/jak-vlozit-dalsi-obrazek-k-soucasnemu-pozadi-webu-opencart#reply1162369

Chip22

(2 hodnocení)

3. 1. 2016 00:08:10

Procenta tomu bohužel nepomohla...tapeta, která je v pozadí má do stran o to více místa, o co je větší úhlopříčka...web zůstává (responzivní) pořád stejně velký, jen volné místo vedle těla webu je podmíněné velikostí...Ještě by tu měl někdo radu prosím?

---------- Příspěvek doplněn 03.01.2016 v 00:08 ----------