
CSS container queries
A CSS grid layout óta kevés világmegváltó újdonság érkezik, a CSS container queries azonban ezek közé tartozik.
Tovább olvasomWeboldalak és felhasználói felületek tervezésével és kódolásával foglalkozom. Dolgozom magánszemélyeknek, vállalkozásoknak, fejlesztő cégeknek és reklámügynökségeknek.
Ezt az oldalt 2010. január 10-én indítottam azzal a céllal, hogy a webdesign szakmát népszerűsítsem. Azóta rengeteg anyagot osztottam meg a blogon és a YouTube csatornámon. Ezeket a tartalmakat rendszeresen frissítem, az elavult videókat törölni szoktam.
2020-tól az itt található anyagokkal kapcsolatban nem végzek support tevékenységet, az ezekkel kapcsolatos megkeresésekre idő hiányában sajnos nem tudok válaszolni. A kommentelési lehetőséget is meg kellett szüntetnem, mert annyira sok hozzászólás érkezett, hogy már egyszerűen nem tudtam mindenkinek válaszolni.
Köszönöm a rengeteg hozzászólást, bíztatást, a jövőben is igyekszem tartani a színvonalat.
Bevezetés a videókészítés alapjaiba.
Dokumentált szabadidős tevékenységeim. Fúrás-faragás, lakásfelújítás, főzés...
Minden ami kódolással kapcsolatos, HTML, CSS, Bootstrap, parallax scrolling, animációk.
Vektoros rajzolás
Kerülj képbe a kiadványszerkesztés alapjaival!
Tanuld meg a világelső képfeldolgozó program használatát alapoktól a felső szintig!
Minden ami webdesign, prototyping, WordPress, akadálymentesség, hírlevél készítés...
A CSS grid layout óta kevés világmegváltó újdonság érkezik, a CSS container queries azonban ezek közé tartozik.
Tovább olvasomCSS változók használatával átláthatóbbá tehetjük a forráskódot. A megvalósításhoz a var() függvényt használjuk.
Tovább olvasomA CSS scroll snap segítségével snap point-okat hozhatunk létre, és a görgetés során ezeknél a pontoknál fog megállni a scrollbar.
Tovább olvasomA tönkrement mosogatógép kiváló alkalmat biztosított egy kis konyhai felújításra.
Tovább olvasomA videóban megnézzük, hogyan tudunk natív CSS-sel egyszerű 12 oszlopos grid-et létrehozni.
Tovább olvasomAz alábbi videó bemutatja a Bootstrap általános használatát. Bootstrap verzió: v5.1.3
Tovább olvasomEzzel a módszerrel bármilyen vektoros ikont használhatunk felsorolásjelnek.
Tovább olvasomAz alábbi módszerrel a viewport-hoz igazíthatjuk a betűméretet, sorközöket, vagy akár margókat is.
Tovább olvasomKéprotáló carousel készítéséhez nem feltétlenül van szükség JavaScript-re. Néhány sor CSS-sel is látványos eredményt érhetünk el.
Tovább olvasomA táblázatok megjelenítésére mobil eszközön több lehetőség létezik, ezek közül mutatok most kettőt a videóban.
Tovább olvasomEbből a 22 részből álló 5 és fél órás videóból megtanulhatod a Photoshop használatát az alapoktól.
Tovább olvasomAmióta megvettem ezt a lakást, azóta gondolkodom, hogy ki kellene dobni ezt a ronda kétszárnyú ajtót a két szoba közül.
Tovább olvasomTömeges képfeldolgozás, átméretezés, vízjelezés az image processor használatával.
Tovább olvasomHogyan lesz a ragyás bőrből babapopsi, avagy a bőr retusálása Photoshop-ban a Spot Healing Brush és Clone Stamp eszközök használatával.
Tovább olvasomEbből a 13 leckéből álló 7 órás videóból megtanulhatod a webdesigner szakma alapját, a HTML + CSS kódolást. Az anyagok ugyanúgy egymásra épülnek, mint a webdesign tanfolyamoknál.
Tovább olvasomHa még sosem használtál InDesign-t, de szeretnéd megtanulni, ez a videó a segítségedre lehet.
Tovább olvasomA shape-outside CSS property használatával egyszerűen körbe tudunk folyatni szöveggel bármilyen alakzatot vagy képet.
Tovább olvasomWebfontok használata esetén gyakori jelenség a FOUT és FOIT. Nem komoly problémáról van szó, de, ha valaki azonban abszolút 100%-os performance-ra törekszik, érdemes egy kicsit elmerülni a témában.
Tovább olvasomAz Adobe XD egyre több hasznos funkcióval rendelkezik amivel működést lehet szimulálni. A Lunacy pedig a Mac only Sketch-ben létrehozott fájlok Windows-os környezetben való szerkesztését hivatott megoldani. Mindkét program ingyenes. Lássuk a hasonlóságokat és a különbségeket!
Tovább olvasomVektorgrafikus képeket akár elemenként is animálhatunk.
Tovább olvasomAdatbázist nem igénylő weboldalakhoz használható egyszerű és gyors flat file CMS.
Tovább olvasomA videókban két ingyenes grafikai program kerül bemutatásra, a Gravit Designer és a Vectr.
Tovább olvasomAz oldalak tartalmát kétféle módon tölthetjük fel WordPress-ben: használhatjuk az admin szerkesztőjét, vagy létrehozhatunk külön fájlokat minden oldalhoz.
Tovább olvasomA box-sizing CSS3 tulajdonsággal tudjuk megadni, hogy az adott elem szélessége hogyan kerüljön kiszámításra.
Tovább olvasomRengeteg mértékegység létezik a betű- és egyéb méretek megadására. Az abszolút egységek mérete nem függ a szülő elemtől, míg relatív megadás esetén a betű mérete valamelyik felette található elem betűméretétől függ.
Tovább olvasomTisztára mint WORD-ben a körlevél készítés. Csak ez működik is.
Tovább olvasomHTML5 banner, CSS3, transition, animáció, keyframes, meg minden, amit akartok.
Tovább olvasomA slice tool és a smart object-ek használatával egyszerűen és gyorsan készíthetünk különböző méretű bannereket egy adott kampányhoz.
Tovább olvasomA hírlevél küldést, mint online marketing eszközt, ma már minden e-kereskedelemmel foglalkozó cég rendszeresen használja. Elenyésző viszont azok száma akik komolyabb időt fordítanak erre a témára. A legtöbb hírlevél rosszul szerkesztett, csúnya és mobileszközökön nehezen olvasható.
Tovább olvasomGyakran felmerülő téma, hogy a WordPress tartalomkezelővel készített weboldalak nem jók. Akik ezt hangoztatják, a nem túl szakszerűen, bővítményekből összelegózott oldalakra céloznak ami abszolút jogos felvetés és maximálisan egyetértek vele.
Tovább olvasomA custom select után, itt a custom radio és custom checkbox is.
Tovább olvasomA legkisebb mértékben sem támogatom a videóban ismertetett megoldások használatát, de sajnos néha rá vagyok kényszerülve.
Tovább olvasomEzt a kódrészt mostanában készítettem és gondoltam megosztom veletek, hátha valakinek hasznára lesz egyszer.
Tovább olvasomA méltatlanul elhanyagolt Illustrator kategória két év után újabb anyaggal bővült.
Tovább olvasomFelbontásfüggetlen menü, mely mobil eszközön összeugrik és hamburger ikonnal nyitható.
Tovább olvasomTudtátok, hogy CSS-el bármilyen méretű és formájú háromszög megrajzolható? Alig néhány sornyi kód, ráadásul cross browser megoldás.
Tovább olvasomEz a rész valamiért teljesen kimaradt a korábbi HTML+CSS videókból, úgyhogy most megnézzük mi a különbség a static, absolute, relative és fixed pozicionálás között.
Tovább olvasomAz analóg korszakban készült családi fotó és videógyűjtemény nagy részét sikerült digitalizálnom az elmúlt években. Már csak a diák maradtak hátra, ami viszont okozott némi fejtörést.
Tovább olvasomA probléma gondolom sokak számára ismerős: panellakás, régi alumínium vezetékek, megégett kötések, földelés csak a fürdőben, esetleg a konyhában.
Tovább olvasomNincs is jobb, mint hideg őszi estéken szkennelgetni az ezer éves családi fotókat. Ha azonban igazán jó eredményt szeretnék elérni, akkor sajnos elkerülhetetlen a képek utólagos feldolgozása.
Tovább olvasomA videóban megnézünk néhány hasznos funkciót, mely megkönnyíti a tervezést, illetve külön kitérek arra, hogy milyen formátumban célszerű küldeni a nyomdának az anyagot.
Tovább olvasomMilyen egy jól szerkesztett önéletrajz? Sajnos egyáltalán nem olyan amilyet az emberek többsége el szokott küldeni amikor egy állásra jelentkezik.
Tovább olvasomBevezetés a CSS3 animáció világába. Micsoda megváltás lesz, ha mindenki HTML5 + CSS3 támogató böngészőt fog végre használni.
Tovább olvasomElőször egy OpenOffice dokumentumot készítünk, majd megnézzük Photoshop-ban hogyan érvényesíthetőek az angolul ironikusan CRAP rövidítést viselő szabályok.
Tovább olvasomRégi vágyamat sikerült beteljesítenem a hétvégén: vettem egy rizsfőzőt. Rengeteget olvastam róla korábban. Ezzel állítólag nem lehet rossz rizst csinálni, a használata pedig megalázóan egyszerű.
Tovább olvasomA tömeges képátméretezés elég gyakran megoldandó feladat, amihez az IrfanView igen jól működő megoldást kínál, ráadásul ingyenesen.
Tovább olvasom