NOVINKA: Získej 40 hodin praktických dovedností s AI – ZDARMA ke každému akreditovanému kurzu!
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

Diskuze – Lekce 2 - Responzivní webdesign pomocí Media Queries v CSS 3

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
Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na Jan Jurníček
Honza Bittner:26.11.2018 17:54

Ahoj, bylo by opravdu lepší vyvarovat se maximum-scale=1, user-scalable=no, případně i initial-scale=1, protože je defaultní. V článku upravím. :-)

Ideálně asi teď používat <meta name="viewport" content="width=device-width, viewport-fit=cover">.

Odpovědět
26.11.2018 17:54
FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.
Avatar
Tomáš Bajt
Člen
Avatar
Tomáš Bajt:29.7.2019 22:21

Skvělej článek , po dokončení všeho s HTML , CSS se do toho určitě opřu , sice nevím jak moc mi front-end půjde , ale zkusím vše z něho , kdyžtak přesedlám na back-end , to je ale vedlejší.

Mám takovou otázku , není někde seznam jak moc veliké jsou pixely všeho ( tablet , mobil )?
viz.

@media screen and (min-width: 900px)

jak mohu ty px zjistit

Odpovědět
29.7.2019 22:21
Život je jednoduchý, to jen lidé si ho dělají složitým.
Avatar
Jaroslav Smrž
Tvůrce
Avatar
Odpovídá na Tomáš Bajt
Jaroslav Smrž:30.7.2019 9:17

Pixely jsou různé. Záleží na DPI (dots per inch - bodů na palec) a každé zařízení to má jinak. Například weby jako takové používají 72dpi. Jinak tyto články jsou již staré. 6 let je na vývoj webu opravdu dlouhá doba. Sice v nich je zmínka o Bootstrap, ale od roku 2013 tento framework urazil dlouho cestu a je podstatně dál. Nauč se tedy spíš Bootstrap a principy LESS, SASS, SCSS než číst zastaralé techniky, ikdyž i v dnešní době občas nastane situace, kdy je třeba si definovat vlastní breakpointy, ale to se stává spíš vyjímečně.

Odpovědět
30.7.2019 9:17
/* Life runs on code */
Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na Jaroslav Smrž
Honza Bittner:30.7.2019 9:54

Na nastavování vlastních breakpointů nevidím nic špatného. Záleží tedy, samozřejmě, jaký typ projektu děláš, tedy jak moc customizovaný je. Na generický web se nějaké využití částí Bootstrapu či jiných frameworků jistě hodí, na specifický projekt se spíše hodí vlastní kód.

Odpovědět
30.7.2019 9:54
FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.
Avatar
Jaroslav Smrž
Tvůrce
Avatar
Odpovídá na Honza Bittner
Jaroslav Smrž:30.7.2019 10:09

Ano, to souhlasím, ale Tomáš Bajt psal v jiném vlákně, že se chce učit back-end, takže co se designu týče, na administrační rozhraní mu bohatě stačí Bootstrap. Při front-endu samozřejmě ne.

Odpovědět
30.7.2019 10:09
/* Life runs on code */
Avatar
Tomáš Bajt
Člen
Avatar
Tomáš Bajt:30.7.2019 10:51

No nějak tak oboje se chci naučit , ale to jsem chtěl později. Díky za radu , zkusím se teda mrknout na bootstrap , ale v tom případě už nemusím koukat na tenhle responzivní webdesign?

Odpovědět
30.7.2019 10:51
Život je jednoduchý, to jen lidé si ho dělají složitým.
Avatar
Lukáš
Tvůrce
Avatar
Odpovídá na Tomáš Bajt
Lukáš:30.7.2019 10:55

Ne nemusíš, to se zas mrkni na zdejší tutoriál na bootstrap : https://www.itnetwork.cz/…ku-bootstrap

 
Odpovědět
30.7.2019 10:55
Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na Tomáš Bajt
Honza Bittner:30.7.2019 11:22

Záleží na tom, co chceš umět. Ale pravidlo palce říká, že žádná teorie nikdy nikomu neuškodila. I když budeš používat Bootstrap či jiný framework, většinou se hodí znát proč a jak věci fungují. :-)

Odpovědět
30.7.2019 11:22
FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.
Avatar
Tomáš Bajt
Člen
Avatar
Tomáš Bajt:30.7.2019 13:20

Ne tak já to špatně přečetl , front-endem ( html ,css ) chci nějak tak začínat a později se přiučit třeba js a php , v tomhle případě se mám podívat na ten bootstrap , nebo se spíš věnovat těmhle vlastním media screenům a responzivitě? ( chtěl jsem to poslat před těmito 2 komentáři , jen mi to zablokovalo )

Odpovědět
30.7.2019 13:20
Život je jednoduchý, to jen lidé si ho dělají složitým.
Avatar
Jaroslav Drobek
Člen
Avatar
Jaroslav Drobek:3.4.2022 6:33

Hodnocení:

  • Jeden meta tag na viewport už z 1. lekce v kódu máme - takže přidat? Nahradit? Proč? Nebude to různými autory?
  • "A CSS kód s využitím mobile first" ...vypadá úplně jako ukázka desktop first o něco výše 😮
  • Vzhledem k bezmála 3 roky starému poslednímu komentáři v diskuzi, v níž se již tehdy mj. polemizovalo o aktuálnosti lekce, žiju v nejistotě, jestli netrávím čas studiem IT-historie.
Editováno 3.4.2022 6:34
 
Odpovědět
3.4.2022 6:33
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 35.