NOVINKA: Začni v IT jako webmaster s komplexním akreditovaným online kurzem Tvůrce WWW stránek. Zjisti více:
NOVINKA: Staň se datovým analytikem od 0 Kč a získej jistotu práce, lepší plat a nové kariérní možnosti. Více informací:

Diskuze – Lekce 12 - HTML layout

Zpět

Upozorňujeme, že diskuze pod našimi online kurzy jsou nemoderované a primárně slouží k získávání zpětné vazby pro budoucí vylepšení kurzů. Pro studenty našich rekvalifikačních kurzů nabízíme možnost přímého kontaktu s lektory a studijním referentem pro osobní konzultace a podporu v rámci jejich studia. Toto je exkluzivní služba, která zajišťuje kvalitní a cílenou pomoc v případě jakýchkoli dotazů nebo projektů.

Komentáře
Nejnovější komentáře jsou na konci poslední stránky.
Avatar
Jiří Vrána
Člen
Avatar
Odpovídá na Denisa Vargová
Jiří Vrána:20.9.2020 12:06

Zkus napovědět cestu, viz toto:

article {
background: url(../obrazky/po­zadi.png) rgba(150, 149, 149, 0.856);
}

Ty dvojtečky a lomítko před odkazem obrázku. Nějakou chvíli mi trvalo to zjistit, ale už to funguje.
Jsem noob, takže netuším, proč někde je třeba deklarovat cestu an někde stačí jen"podsložka a jméno obrázku". :-)

Avatar
Michal Stisek
Člen
Avatar
Michal Stisek:26.9.2020 15:01

Pokud máte html soubory v kořenovém adresáři a pak složky pro obrázky a styl, pak v css souboru musí být pro cestu k pozadí právě ty dvě tečky (../obrazky/po­zadi.png). Pokud byste měli soubor css v kořenovém adresáři s html, pak stačí mit v url jen (obrazky/poza­di.png)

BTW: chci se zeptat jestli někdo nevíte proč se nadpis h1 v elementu article udela menším, než když je jen v body. Někdo nějaké vysvětlení?

Odpovědět
Jít pořád dál má smysl
Avatar
Jakub Jílek
Člen
Avatar
Jakub Jílek:17.11.2020 22:25

Jak už psal Luboun, je to potřeba mít v Body v tom styl.css.

Avatar
Katka
Tvůrce
Avatar
Katka:21.12.2020 13:19

Fajn článek – díky.
Drobná životní zkušenost:
Když jsem si přečetla větu: "... V minulosti se k tomuto účelu používal tag <div>, což je však špatně a již se to nedělá.", snažila jsem se všechny <div> přepisovat na <article> a to i např. v automaticky generovaném kódu v _Layout.cshtml u .NET Core MVC. :-P
Až pak jsem zjistila, že se <div> běžně používá kvůli Bootstrapu a zas tak špatný ani přežitý tag to není...

Odpovědět
Rozdíl mezi tím, kým jsme a tím, kým chceme být, je jen v tom, co děláme.
Avatar
Veronika MAREČKOVÁ
Člen
Avatar
Veronika MAREČKOVÁ :27.1.2021 11:41

Zdravím, Vytvořila jsem si fialový png obrázek, který bych ráda měla na pozadí stránky, ale stále se mi to nedaří. Prosím napište mi, kde dělám chybu, na kterou nemůžu přijít.
Text mám bez diakritiky. Fialový obrázek mi program sám dokonce nabízí, ale v prohlížeči se fialové pozadí stále nezobrazuje.
Kam správně background: url('../obraz­ky/fialova.png') ; se do css zadává?

body { font-family: Verdana, Geneva, Tahoma, sans-serif;
background: url('../obraz­ky/fialova.png')}

i když zadám article {
background: url(../obrazky/fi­alova.png);
}

tak se nic nezobrazí.
Děkuji.

Avatar
Veronika MAREČKOVÁ
Člen
Avatar
Odpovídá na Veronika MAREČKOVÁ
Veronika MAREČKOVÁ :27.1.2021 13:02

Kdyby se náhodou ještě někomu stalo něco podobného jako mě tak ať si css styly nezapomene propojit s webovou stránkou. ;-) Jinak ty dvě tečky od Jirky pomohly.
tj. ../obrazky/po­zadi.png

<link rel="stylesheet" href="css/styly.css" type="text/css" />
<link rel="stylesheet" href="styly.css" type="text/css" />
Avatar
Erika urbanová
Člen
Avatar
Erika urbanová:17.6.2021 19:35

Ahoj vymazala som všetko z predchádzajúcich lekcií a išla nanovo, ale zasa sa na tomto mieste, ako vložiť obrázok farby na podklad neviem pohnúť, rozbalila som si váš kod, ale tiež mi nefunguje, skúsila som aj iný prehliadač, doteraz super všetko zobrazovalo, takže v prepojení by to byť nemalo,skúsila som:
SAMOSTATNE:
article{
background: url(../'obraz­ky/pozadi.png');
}
skúsila som vložiť do BODY:
body{

font-family:Verdana;
font-size:14px;
background: url(../'obraz­ky/pozadi.png');
}

Avatar
Aleš Masařík
Člen
Avatar
Aleš Masařík:18.6.2021 17:28

Blblo mi jak se píše v diskuzi pozadí, bralo to mi to pozadí napsané #číslo, ale obrázek z noise texture generator ne, tak jsem dal pozadí na celé tělo takto:

body    {
   background: url(pozadi3.png);}

je tam rozdíl oproti návodu tady, že tam nejsou uvozovky a mě to funguje

Avatar
Ivana Fajnorová
Člen
Avatar
Ivana Fajnorová:21.6.2021 20:39

tak toto mi teda trvalo... bohužiaľ nezobrazovalo sa mi pozadie podľa tohto postupu, tak som si prečítala český CSS 3 manuál - Pozadí a urobila som to podľa toho návodu a funguje to :)

Avatar
Leoš Kaplan
Člen
Avatar
Leoš Kaplan:3.8.2021 16:16

Dovedl by mi někdo poradit, proč mi to nefunguje? Ani v komentářích jsem se nedočetl toho, jak to upravit.

Přidání article ani body před background nefunguje, soubor css mám s html spárovaný, klasickou barvu bez obrázku tam přidat bez problému umím, takže vidím problém v implementaci souboru s pozadím.

Současná verze

article {
background: url('C:\Users\LE­NOVO\Desktop\it­network\webde­sign\obrazky\po­zadi.png') #009aca;
}

Soubor nemám ve stejné složce jako obrazek (zejmena kvůli tomu, že vím, že časem všechno do jedný složky nenaflákám a chci mít ve složkách přehled, navíc chci umět ty soubory správně navazovat z jiných míst).
Zkoušel jsem to napsat i bez těch interpunkčních čárek, pak s uvozovkama, následně i zkrácenej odkaz bez celý cesty s dvěma tečkama, jako psali ostatní, ale nic nefunguje.

Nejnovější komentáře jsou na konci poslední stránky.
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 10 zpráv z 382.