Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Tinklapių dizainas, 4 paskaita. CSS: aprašomasi...

Avatar for Jonas Lekevicius Jonas Lekevicius
October 08, 2014
Design
0
340

Tinklapių dizainas, 4 paskaita. CSS: aprašomasis dizainas.

Lecture for web design course in Vilnius College of Design.

Avatar for Jonas Lekevicius

Jonas Lekevicius

October 08, 2014
Tweet

More Decks by Jonas Lekevicius

See All by Jonas Lekevicius
Dirbtinis intelektas dizainerio gyvenime
Avatar for Jonas Lekevicius lekevicius
0
270
AI and Designer Collaboration
Avatar for Jonas Lekevicius lekevicius
0
200
Treatwell — the business and the app
Avatar for Jonas Lekevicius lekevicius
0
1.2k
The Dissatisfied Thief
Avatar for Jonas Lekevicius lekevicius
0
78
Hack @ SmallPlanetAirlines
Avatar for Jonas Lekevicius lekevicius
0
120
Interface Fiction
Avatar for Jonas Lekevicius lekevicius
0
170
Introduction to Apps for Atomic Garden
Avatar for Jonas Lekevicius lekevicius
2
150
Keturios ateitys: didžiausių pasaulio kompanijų vizijos
Avatar for Jonas Lekevicius lekevicius
0
190
∞ Loop: Apie begalinį žaidimą nuo pradžios iki pabaigos
Avatar for Jonas Lekevicius lekevicius
1
520

Other Decks in Design

See All in Design
保育AIプロダクトの UXデザインで考えてきたこと / hoiku-ai-ux-design
Avatar for Takahiro Yamaguchi hiro93n
0
170
Building Experiences: Design Systems, User Experience, and Full Site Editing
Avatar for Michelle Schulp Hunt marktimemedia
0
270
1年目デザイナーが実践する、チーム貢献のための2つのアプローチ
Avatar for kinomi kinomidesign
0
120
逆向きUIの世界〜AndroidアプリのRTL言語対応〜
Avatar for akatsuki174 akatsuki174
1
510
8_8_リサーチカンファレンスプレイベント.pdf
Avatar for Muture muture
PRO
2
420
CMS管理画面のアクセシビリティ
Avatar for Rikiya Ihara / magi magi1125
8
2.5k
Yumika Yamada Portfolio
Avatar for Yumii yumii
0
1.9k
Meet, Learn, Grow × AI ― コミュニティで加速するスキル循環 「コミュニティと関わり方」
Avatar for ため tame
0
270
そのUIコンポーネント、これから先も使えますか？―Headless UI,Open UI,グローバルデザインシステム
Avatar for sakito sakito
2
2k
「UXとUIの違い」v2
Avatar for Shirasu3 shirasu3
0
250
minpaku-community-scrum-patterns
Avatar for Noriaki Kawanishi norinity1103
1
470
decksh object reference
Avatar for Anthony Starks ajstarks
2
1.3k

Featured

See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
132
19k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
84
9.2k
A better future with KSS
Avatar for Kyle Neath kneath
239
18k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
45
7.7k
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
173
14k
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
411
23k
Fireside Chat
Avatar for paigeccino paigeccino
40
3.7k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
53
7.8k
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
5.8k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
34
2.3k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
697
190k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
4.9k

Transcript

  1. I V PA S K A I TA CSS: aprašomasis

    dizainas Tinklapių dizainas Jonas Lekevičius, 2014

  2. Šiandien matysite!

  3. Šiandien matysite! • Keli praktiniai dalykai

  4. Šiandien matysite! • Keli praktiniai dalykai • Kam skirtas CSS

  5. Šiandien matysite! • Keli praktiniai dalykai • Kam skirtas CSS

    • CSS selektoriai

  6. Šiandien matysite! • Keli praktiniai dalykai • Kam skirtas CSS

    • CSS selektoriai • Pagrindinės CSS savybės

  7. Šiandien matysite! • Keli praktiniai dalykai • Kam skirtas CSS

    • CSS selektoriai • Pagrindinės CSS savybės • Kur ieškoti daugiau informacijos

  8. Šiandien matysite! • Keli praktiniai dalykai • Kam skirtas CSS

    • CSS selektoriai • Pagrindinės CSS savybės • Kur ieškoti daugiau informacijos • Savaitės užduotis

  9. 3 praktiniai dalykėliai

  10. vdk.lekevicius.com

  11. Judėkite palengva ir labai tvarkingai

  12. Pasidalinkite progresu per Dropbox

  13. [email protected]

  14. CSS: dizainas per apibūdinimus

  15. CSS HTML JS

  16. CSS

  17. Counter Strike: Source CSS

  18. Cascading Style Sheets CSS

  19. Apibūdinkime dizainą žodžiais (jog net kompiuteris suprastų)

  20. None

  21. Iš ko susideda CSS?

  22. Iš ko susideda CSS? • Įvardinimo apie kuriuos elementus kalbėsime

  23. Iš ko susideda CSS? • Įvardinimo apie kuriuos elementus kalbėsime

    • Tų elementų dizaino apibūdinimo per savybes

  24. CSS selektoriai

  25. Įvardinimas, kuriems elementams priskirsime savybes

  26. <p id="intro">Labas</p>

  27. <p class="description">Labas</p>

  28. Pažaiskime!

  29. http://flukeout.github.io

  30. Pradėkime CSS!

  31. http://lekevicius.github.io/vdk-lectures/get/4.zip

  32. None

  33. Kur ieškoti informacijos?

  34. https://developer.mozilla.org/en-US/docs/Web/CSS

  35. Coda Books

  36. http://docs.emmet.io/cheat-sheet/

  37. Užduotys

  38. SAVAITĖS UŽDUOTYS

  39. SAVAITĖS UŽDUOTYS Susitvarkykite HTML

  40. SAVAITĖS UŽDUOTYS Susitvarkykite HTML Patys pereikite CSS Diner dar kartą

  41. SAVAITĖS UŽDUOTYS Susitvarkykite HTML Patys pereikite CSS Diner dar kartą

    Pradėkite kurti savo puslapio CSS

  42. SAVAITĖS UŽDUOTYS Susitvarkykite HTML Patys pereikite CSS Diner dar kartą

    Pradėkite kurti savo puslapio CSS Pasidalinkite puslapiu per Dropbox

  43. Iki!