HTML a CSS od základov 🇸🇰

Поделиться
HTML-код
  • Опубликовано: 26 дек 2024

Комментарии • 122

  • @Michaela-bz5hd
    @Michaela-bz5hd 9 месяцев назад +4

    🤍💭 bozi !! dekuju..kafi koupim Ti zasobu celou, hned jak vydelam prvnich par haliru 🤜🤛 😸

  • @Masterbroom
    @Masterbroom 3 года назад +33

    Poklona tebe yablko. Učenie sa od teba je veľmi zábavne a zaujímavé .Vždy sa teším na nove videa a kurzy v ktorých komentuješ ,učíš a zabávaš. prial by som si viac takýchto učiteľov v časoch keď som chodil na strednú.

  • @ondrejdlouhy6744
    @ondrejdlouhy6744 2 года назад +3

    HTML i CSS ovládám, pár webů jsem už vytvořil. Přesto mě tento a podobné tutorialy baví. Většinou se z nich naučím něco nového, a když ne, tak si krásně osvěžím znalosti. Díky.

  • @dawsigi
    @dawsigi 2 года назад +2

    Tyjo, nedělám web dev, ale rikal jsem si, ze zaklady html a css umim a přesto jsem se dozvěděl spoustu informací, které se mi budou hodit. Děkuju! Super video.

  • @TheDJHany
    @TheDJHany 2 года назад +2

    Yablko... ty si proste kráľ :D som akurát v zahraničí v práci ale keď prídem home a budem mať viac času, tak sa určite prihlásim k tebe na kurz...

  • @gumidkova
    @gumidkova 3 года назад +19

    Tohle je tak úžasný tutorial, nejen že je to skvěle strukturované a jasné, ale ty vtipy mě zabíjejí :) Mám asi dost stejný styl humoru, protože ty hlody, to je teprve něco :D A pak že jsou ajťáci divní pavouci :))

    • @jsonkody
      @jsonkody 3 года назад

      Ja jsem divny pavouk D:

  • @RobWebSK
    @RobWebSK  3 года назад +1

    ⬇️ Stiahi si KÓD (a nájdi všetky ODKAZY) github.com/yablko/html-a-css-zaklady
    00:00 00 | HTML a CSS nie sú len webstránky
    02:04 01 | Tu nájdeš viac, ponorím ťa do detailov
    02:43 02 | HTML a štruktúra DOKUMENTU (index.html, title, body)
    05:45 03 | NADPISY a ODSTAVCE, HTML dáva VÝZNAM cez ZNAČKY (h1, h2, p)
    08:25 04 | VISUAL STUDIO CODE, nastavenia, nauč sa [{(‹ZÁTVORKY›)}]
    13:46 05 | HTML píšeš aj pre ROBOTOV a PROGRAMY (strong, em)
    18:32 06 | IMG obrázky, HTML atribúty, MDN dokumentácia (img, alt)
    23:32 07 | CSS, TEXT, FARBY, KOMENTÁRE (color, background, font-family)
    28:29 08 | CSS, PADDING, MARGIN (article, border, width, font-size)
    33:32 09 | NEEXISTUJE jeden správny kód, rozdiel medzi mnou a MALIAROM
    35:41 10 | CSS RODIČIA a DETI, HTML štruktúra článku (header, footer, radius)
    39:01 11 | DEVTOOLS, INSPECT ELEMENT, preskúmaj prvok
    42:34 12 | TVRDÉ PRAVIDLÁ PRE SÚBORY, rady, webové zločiny
    48:46 13 | HTML ATRIBÚTY, ZOZNAMY, MENU (ul, ol, li)
    55:04 14 | HTML ODKAZ na inú stránku, LINK, HYPERTEXT (a, mailto, tel)
    01:00:20 15 | Písanie kódu je len MALÁ časť práce
    01:02:24 16 | CSS SELEKTORY, PSEUDO CLASSY, ŠPECIFICITA (hover, active)
    01:08:49 17 | DIV je šupák a kto používa, je LÚZER (div, main, section)
    01:11:45 18 | SEO, BUĎ ZLODEJ (kódu, všetci sme, tak sa učíš)
    01:15:24 19 | CLASS, ID
    01:20:35 20 | CESTY K SÚBOROM, prepoj HTML a CSS (link, ., .., /)
    01:27:29 21 | CSS nastavenia pre KAŽDÝ projekt

  • @patres231
    @patres231 3 года назад +14

    Si super ,nasmial som sa a aj niečo naučil .Hned sa mi lahšie hompluje gebula.,,very good job mister,, .

  • @r_bilek
    @r_bilek 3 года назад +5

    Parádne video. Yablko je velký borec. Teším sa na ďalšie videá !

  • @dawid2017
    @dawid2017 3 года назад +5

    Snád moje prvé video ktoré má viac ako hodinu a ja som ho dopozeral. Super sa počúva tvoj hlas a ešte viac super to vysvetluješ , plánujem ísť na IT strednú školu a chcem sa trošku ponoriť do tohoto sveta takže idem nasťudovať viac videí od teba ! :D ďakujem :)

  • @martintomko651
    @martintomko651 3 года назад +1

    Mám pocit, že už to viem len z pozretia.... škoda, že je to len pocit 😅 ....super video 👌✌️

  • @Eldalion99999
    @Eldalion99999 3 года назад +19

    skoda ze taketo tvoje videa neboli ked som mal 18. To by bol super uvod do web dev sveta. Teraz uz som stary ch... :D Ale aj tak tieto veci pozeram, aj ked ich viem, asi z nostalgie alebo co.

    • @Pato_Long
      @Pato_Long 3 года назад +1

      To same si rikam kdyz sleduji kolik kanalu ohledne matematiky lze dnes najit a kdyz ja studoval, tak to nebylo nic moc :D

    • @jsonkody
      @jsonkody 3 года назад +2

      stary? kolik ti je?
      Ja se stal 'programatorem' ve 28 .. ve 20ti jsem si btw taky myslel ze jsem moc stary.

    • @gumidkova
      @gumidkova 3 года назад +2

      @@jsonkody a já v 37 :) nejvíc staří si lidi přijdou právě, když jsou úplně mladí :D

    • @raffynko
      @raffynko 3 года назад

      @@gumidkova ja sa stavam programatorom v 43... je to len cislo pri uceni no nie pri cviceni (v posilke a pod v zaciatkoch)

    • @PeterBeno85
      @PeterBeno85 Год назад

      Ja mám 37 a teraz začínam s programovaním. Úplne ma to ovládlo:-) čakajú ma roky driny, ale aj nových zaujímavých poznatkov , zatiaľ je to ako dobrodružstvo
      Mojím snom je mať v 50tke nejaké fajn pracovné miestečko za počítačom. Je to reálne? Momentálne pracujem ako obchodný zástupca, ale som už dosť ucestovany a tlakmi na výkon za čoraz menej peňazí aj unavený. Už to nie je tak ako kedysi, keď sa šikovní obchodníci mali dobre a boli aj fajn ohodnotení.

  • @adamkocis5876
    @adamkocis5876 2 года назад

    Dakujem velmi pekne za kurz (tutorial) veľmi mi to pomohlo si šef.

  • @zdenilin1991
    @zdenilin1991 2 года назад

    Jsi výborný a s humorem. ❤️ děkuji moc pomohlo při kurzu. 🍀 přeji Ti jen to nejlepší a velmi úspěchů. 🍀🍀🦋Dávám odběr ;)

  • @asvusvk7258
    @asvusvk7258 2 года назад

    Velmi poučné video, len to ešte vyskúšať v praxi :) Každopádne vďaka za toto video, presne toto som dnes hladal.

  • @freeworld_cznavrc7816
    @freeworld_cznavrc7816 2 года назад

    Super jsi první kdo mě tohle objasnil a naučil DĚKUJI ♥💪👍

  • @RobWebSK
    @RobWebSK  3 года назад +4

    ❤ PATREON ​patreon.com/yablko podpor ma
    🎙 PODCAST ruclips.net/video/DktmaHXd4ps/видео.html podcast
    📚 MOJE KURZY www.learn2code.sk/instruktori/roman-hraska 1300+ videí
    🍿 TWITCH twitch.com/yablko_ tu odpovedám na otázky
    🎬 DRUHÝ RUclips ruclips.net/user/yablko humor

  • @adrianchoma2271
    @adrianchoma2271 3 года назад

    Cením ten ananas na pizzu a inač super video.

  • @marekjanis2056
    @marekjanis2056 3 года назад +6

    po cca 10 rokoch prace a obcasneho programovania a prace na CNC ma omrzili monterky a uz dlho hladam cestu kadial sa dostanem do sveta "kodenia" a myslim ze vdaka tymto navodom + patreonu sa aspon cosi naucim :D palec hore

  • @jozefziacek4541
    @jozefziacek4541 2 года назад

    Yablko . Si proste borec. 💪

  • @davidkral7384
    @davidkral7384 3 года назад

    SUPER.Jdu na další tvoje video

  • @om8309
    @om8309 3 года назад

    Musim pochvalit Yablka za jeho talent na ucenie. Presiel som zatial web rebel 1 kurz a musim povedat ze zatial to bol najschopnejsi kurz aky som kedy sledoval. Jasne, jednoducho a zabavne podane informacie + vypichnute podstatnych a nepodstatnych veci robia z tohoto kurzu naozaj to co som hladal. Po kurze som si pustil niekolko konkurencnych vyucnych videi na internete a musim dodat ze ak by som sa niekedy z nich nieco naucil tak by to trvalo 5 nasobne dlhsie. Dik a vela zdaru v dalsej tvorbe

  • @tonkofonko
    @tonkofonko 2 года назад +1

    Kámo dikec fakt moc ĎAKUJEM :D

  • @MarošDočekal
    @MarošDočekal Год назад

    Super video, ďakujem :)

  • @MIHINKOO
    @MIHINKOO 3 года назад

    Parada Yablčenko sikonvy si ....dobre som sa nasmial tie vložky su top 😂

  • @DavidKenett
    @DavidKenett Год назад

    Veľmi pekný tutoriál :)

  • @ForeverBlessed777
    @ForeverBlessed777 Год назад

    Ďakujem :)))

  • @dominikdlugos4652
    @dominikdlugos4652 3 месяца назад

    Super

  • @zuzanahudzikova8294
    @zuzanahudzikova8294 3 года назад +2

    Som momentálne účastníčkou pomerne nelacného Javascript kurzu, ale do obrazu 🧩 sa dostávam až vďaka Tvojej práci 👍. Som nadšená zo zrozumiteľnosti Tvojho vysvetľovania, už som si přikoupila aj web rebela 👏💥 Great job 💪🎩⬇️ Prisahám, že ešte jeden aha moment 🤩 a ťahám na patreon minimálne pozvať na kávu 🤑

    • @RobWebSK
      @RobWebSK  3 года назад

      to super, díky moc! potešila si ma:) nech sa darí, bav sa aj ďalej!

  • @Pino-zi6lc
    @Pino-zi6lc 3 года назад +1

    Paráda, jses borec :)

  • @happystarthe3rd
    @happystarthe3rd 3 года назад +25

    Mohol by si spraviť niake video o všetkých klavesových skratkách ktoré použivaš a tak?

  • @ForeverBlessed777
    @ForeverBlessed777 Год назад +1

    RIP Vašo Patejdl

  • @Dastcz
    @Dastcz 3 года назад

    Super, díky 👍

  • @sasasd158
    @sasasd158 3 года назад

    Si frajer ďakujem

  • @ShianneHard-r3w
    @ShianneHard-r3w 29 дней назад

    Ahoj, super video, delas nejake kurzy prosim? moc rada bychse od tebe neco naucila. Hlavne bych poterebovala, aby se mi nekdo venoval primo - nejen videa. sry eng klavesnice :D

  • @zdenomucha
    @zdenomucha Год назад +1

    Super tutoriál! Zdedil som správu jednoduchej statickej stránky a niekedy sa ňou trápim, prácne hľadám kde čo a ako nastaviť. Hovorím, že pracujem na nejakej vyššej úrovni a chýbajú mi základne stupienky. Tvoj tutoriál mi tie stupienky doplnil. Ďakujem.
    Nainštaloval som si aj Visual Studio. Tu mi však vznikol problém, lebo v obsahu mi Visual nahradil všetky znaky s diakritikou týmito znakmi�. Ešte šťastie, že som to neskúšal na ostrom obsahu. Poradil by si mi prosím. kde a čo vo Visual-i mám nastaviť, aby sa to zobrazovalo správne?

    • @RobWebSK
      @RobWebSK  Год назад

      skus pri otvorenom subore prikaz "change encoding" alebo "reopen with encoding" a potom vyber "utf8" pripadne skusaj, ktora moznost je pre teba spravna

    • @zdenomucha
      @zdenomucha Год назад

      @@RobWebSK Ďakujem. Prešiel som všetky možnosti no žiaľ diakritika je stále zblbnutá. Doteraz som tieto veci editoval PSPad-om, tak asi budem používať naďalej ten :-(

  • @stefanbielesch2804
    @stefanbielesch2804 Год назад

    Ahoj, prosím ťa, ako je ta klávesová skratka, keď chcem kúsok kódu iba vypnut, aby bol nefunkčný, ale nechcem ho vymazať... neviem za svet nájsť, kde si to spomínal... Ďakujem.

  •  3 года назад +2

    Nikto mi to nedokázal vysvetliť tak ako ty, veľké diky...

  • @danielsladecek8258
    @danielsladecek8258 3 года назад

    ahojte, neviete preco mi neide nacitat obrazok podla yablka z netu???
    na webe mi ho nenacita.....hm, viete pomoct?

  • @mcklimo
    @mcklimo 2 года назад +1

    Skvele video ďakujem. Ale ako to je ak počas písania nejako vymazes polku codu co si písal trebarz hodinu? Je nejaká cesta späť, krok späť? 🤔

    • @RobWebSK
      @RobWebSK  2 года назад +2

      ctrl + z (cmd + z na Macu) funguje prakticky v každom programe. a používať napr. Git ruclips.net/video/0v5K4GvK4Gs/видео.html ktorým si priebežne robíš zálohy, ku krorým sa kedykoľvek vieš vrátiť.

  • @TheNEOWOW
    @TheNEOWOW 3 года назад +1

    Ahoj,
    Chci se naučit programovat web.. ale sem uplny začátečník...
    Mám si projet toten kurz alebo rovnou skocit na webrebel kurz ?
    Díky moc.

    • @RobWebSK
      @RobWebSK  3 года назад +1

      pokojne začni týmto. vo Webrebel kurze toho je samozrejme viac, takže ak chceš pokračovať, potom skoč na Rebela.

  • @danielsladecek8258
    @danielsladecek8258 3 года назад

    pecka!👌

  • @mariankohn8411
    @mariankohn8411 3 года назад +1

    W3CSchools je super zdroj ;-)

    • @danielgago-sk
      @danielgago-sk 3 года назад +1

      Tak všade čítam ako je nemoderný a podobne, ale má dobrú štruktúru, kopu informácií, príkladov, ba až hotových riešení, vlastný "editor" kde hneď otestujem dajaké malé zmeny že ako sa to prejaví vo výsledku, ja myslím že stojí za návštevu (začiatočníkom určite).

    • @mariankohn8411
      @mariankohn8411 3 года назад

      @@danielgago-sk, absolútny súhlas. ;-)

  • @martin.k7988
    @martin.k7988 2 года назад

    Vůbec se mi nechce udělat rámeček když zadám border, mám to napsané podle tebe, zkoušel jsem to pak udělat i kolem obrázku a taky nic, jakoby mi ten příkaz nefungoval, čím by to mohlo být? Díky

  • @ludwajzsk2758
    @ludwajzsk2758 2 года назад

    fajnovo😁

  • @ivanadeauto
    @ivanadeauto 3 года назад +1

    V kazdom pripade si nemyslim ze tento Yablko je preafektovany, skor si myslim ze ma svoj vlastny styl ako ucit zaciatocnikov a osviezovat pamat pokrocilejsich. Ja mu davam ten najlepsi feedback.

  • @jsonkody
    @jsonkody 3 года назад

    Ahoj Yablko, chtel bych se zeptat: mas nejak specialne nastaveny zvuk mikrofonu, treba v interface nebo v PC? Nebo doladeny do videa?
    Prijde mi ze mas skvely zvuk ;)

    • @jsonkody
      @jsonkody 3 года назад

      Zajima me, jak moc je to 'mikrofonem' a jak moc nastavenim.
      Pripravuju se, ze zacnu zase natacet, ale chci vylepsit celkovou kvalitu.

    • @RobWebSK
      @RobWebSK  3 года назад +1

      dík! žiadne špeciálne nastavenia. mám 2 videá, kde ukazujem svoj setup, aký mic a interface používam ruclips.net/video/SU8qE1qEYmU/видео.html v týchto tutoriáloch na konci počas strihu pridám len compressor (na vyváženie hlasitosti) a limiter (ktorý tomu dá strop). inak je to len mikrofón, interface, hlas a pár akustických panelov na stene. streamujem cez OBS, vtedy mám ešte zapnutý noise gate a noise suppression.

  • @LiborMelich
    @LiborMelich 2 года назад

    😍

  • @johnthalandjpulirez6382
    @johnthalandjpulirez6382 3 года назад +1

    jak ze ma za hodinu a pol naucis vela? dik😊 a mas aj kurz na python?

  • @andrew19yo59
    @andrew19yo59 Год назад

    RIP Vašo

  • @erzaaa5788
    @erzaaa5788 2 года назад

    Nemáte náhodou někdo zkušenost ve VS Code, že při psaní kódu vám lehce problikává obrazovka, jak kdyby se měnil jas obrazovky při zmáčknutí některých kláves. Nedělá to pravidelně, takže nejsem schopný popsat proč nebo kdy..

  • @kikismine
    @kikismine 3 года назад

    A yablko kdes ziskal to ice fox logo :D Si ho tam chci taky pridat :d

    • @RobWebSK
      @RobWebSK  3 года назад +1

      toto? www.mozilla.org/en-US/firefox/developer/

    • @kikismine
      @kikismine 3 года назад

      @@RobWebSK JJ dík moc

  • @Zikalop
    @Zikalop 2 года назад

    nevíte někdo proč se mi při vytváření bariéri obrázku udělají dvě bariéri?

  • @lo0p520
    @lo0p520 2 года назад

    Nejde mi border když jen napíšu bord tak nemám žádnou nabýdku na tab udělal jsem to stejně jak ve videu a nefunguje to prosím o radu

    • @patrikruzicka8118
      @patrikruzicka8118 2 года назад

      Mam ten istý problém, všetko mení ale ten border neukáže.. skúšal som to presúvať v kóde ci to náhodou neovplyvňuje to že to je moc dole alebo hore ale absolútne to nepomáha

  • @milantomanek3678
    @milantomanek3678 3 года назад

    Ahoj. chcel by som sa spýtať, ako vytvorím napr. mobilnú apku s HTML , CSS a JS? Dikes.

  • @Ypes
    @Ypes Месяц назад

    Môžem Lua?

  • @yoginecko
    @yoginecko 3 года назад +6

    Yablko ma naučil programovať

    • @jsonkody
      @jsonkody 3 года назад +1

      HTML není programovací jazyk 😛👅

  • @johnthalandjpulirez6382
    @johnthalandjpulirez6382 3 года назад

    Ahoj. Mam menši problem chcem ti napisat aj na ig ale asi by to bolo márne. Neviem ako dalej. Robim login page a kef na submit dám link tak ho otvori bez toho ci su polička vyplnene a to nechcem vedel by si mi helpnuť dakujem

    • @RobWebSK
      @RobWebSK  3 года назад

      pridaj inputom atribut "required"

    • @johnthalandjpulirez6382
      @johnthalandjpulirez6382 3 года назад

      @@RobWebSK to tam mam ale ked dám že sumbmit alebo login tak ma to pusti aj tak. A ten input submit mam cez js. A neviem ako to urobit.

    • @johnthalandjpulirez6382
      @johnthalandjpulirez6382 3 года назад

      Akože otvorenie linku mam v js pri input submit ze ked kliknem mi to otvori ten link alebo subor

    • @RobWebSK
      @RobWebSK  3 года назад

      @@johnthalandjpulirez6382 ak submit robíš javascriptom, tak javascriptom porieš aj overenie, či sú hodnoty v inputoch správne vyplnené. volá sa to validácia. validation. ak kód nechceš písať sám, existujú validačné knižnice.

    • @johnthalandjpulirez6382
      @johnthalandjpulirez6382 3 года назад

      @@RobWebSK vedel by si mi to poslat alebo ten code? Ja to mam tak že
      function login() {
      window.location.href="index.html";
      }
      A ako to mam tam pridat? Som z toho ony...

  • @randal927
    @randal927 3 года назад

    nevím proč mi nefunguje když tam napíšu padding: 50px; tak mi u dvojtečku nepříjmá a ten border zmizí a margin tam asi neexistuje

    • @RobWebSK
      @RobWebSK  3 года назад

      budeš mať chybu v kóde niekde okolo. riadok nad tým, pod tým...

  • @AkiRa-rw4ki
    @AkiRa-rw4ki 8 месяцев назад

    Před nedávnem jsem začal s HTML a css jen tak ze srandy. Když jsem chodil na základku tak jsem si dělal v HTML svoje stránky. Ale od té doby se technologie hodně změnily. A mám co dělat

  • @aggames280
    @aggames280 2 года назад

    potrebujem odozvu do 2 dni

  • @thelaiq
    @thelaiq 3 месяца назад

    1:08:40

  • @matejchybik
    @matejchybik 3 года назад

    26:55

  • @driblo
    @driblo 3 года назад

    nieco o css preprocesoroch nechystas? dik

    • @RobWebSK
      @RobWebSK  3 года назад +1

      mám celý kurz na sass www.learn2code.sk/kurzy/css-preprocesory-sass

    • @driblo
      @driblo 3 года назад

      @@RobWebSK vdaka pozriem

  • @fernefer1071
    @fernefer1071 Год назад

    lepsi tutorial na HTML a CSS ako 4 roky na SOS Stara Tura

  • @kyko2166
    @kyko2166 3 года назад

    Kamarátky sa pýtal ;)

  • @martinpapcun3907
    @martinpapcun3907 2 года назад

    Prosím o radu, počas práce v Visual Studio Code mi prestalo fungovať automatické dopĺňanie elementov. Napíšem p a nič, zapíše mi iba text a neponúkne element s jeho štruktúrou. Normálne mi to fungovalo a zrazu (možno som nechtiac stlačil nejakú skratku alebo čo) to prestalo. Čo sa s tým dá urobiť? Ďakujem za radu. A ďakujem za kurzy tento a Webrebel (zatiaľ).

  • @dominikdlugos4652
    @dominikdlugos4652 3 месяца назад

    Tiež vscode

  • @matejchybik
    @matejchybik 3 года назад

    Každý tvrdí že HTML a CSS není programování je to pravda?

    • @RobWebSK
      @RobWebSK  3 года назад

      neni to programovanie. aj keď záleží, v akom kontexte sa pýtaš. html a css nie sú programovacie jazyky (aj keď aj v tom ľudia vedia nesúhlasiť stackoverflow.com/questions/145176/is-html-considered-a-programming-language) ale keby napr. rozmýšľaš kam html a css zaradiť na CVčku, tak pokojne medzi programovacie jazyky, ktoré ovládaš. nevytvárať tomu vlastnú sekciu, lebo to je akurát viac confusing pre HR ľudí potom...

    • @matejchybik
      @matejchybik 3 года назад

      @@RobWebSK díky 💪

    • @danielgago-sk
      @danielgago-sk 2 года назад

      Odkedy je v CSS ku calc(), tak už sa v ňom programuje... 🙂 A premennné k tomu. A aby som nezabudol na "keyframes" s percentami a podobne. Dajako sa to posunulo do programovania pomaly.

  • @francanl
    @francanl 3 года назад +1

    Super, len keby si nebol taký perafektovaný :D musel som to vypnúť...

    • @RobWebSK
      @RobWebSK  3 года назад +13

      dík, chcel som dočítať tvoj koment, ale musel som to vypnúť

    • @francanl
      @francanl 3 года назад

      @@RobWebSK seba ?

    • @noshut886
      @noshut886 3 года назад

      Je to trápne ale dá sa aspoň niečo naučiť 😄

    • @sebastianjanovcik
      @sebastianjanovcik Год назад

      wtf ty si asi nejaky kido alebo co

  • @janlazorik
    @janlazorik 2 года назад

    sef

  • @lo0p520
    @lo0p520 2 года назад

    Zajímá mě jak si udělám název stránky jak má třeba youtube youtube.com ?