Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Tinklapių dizainas, 4 paskaita. CSS: aprašomasi...
Search
Jonas Lekevicius
October 08, 2014
Design
0
330
Tinklapių dizainas, 4 paskaita. CSS: aprašomasis dizainas.
Lecture for web design course in Vilnius College of Design.
Jonas Lekevicius
October 08, 2014
Tweet
Share
More Decks by Jonas Lekevicius
See All by Jonas Lekevicius
Dirbtinis intelektas dizainerio gyvenime
lekevicius
0
260
AI and Designer Collaboration
lekevicius
0
180
Treatwell — the business and the app
lekevicius
0
1.2k
The Dissatisfied Thief
lekevicius
0
74
Hack @ SmallPlanetAirlines
lekevicius
0
120
Interface Fiction
lekevicius
0
170
Introduction to Apps for Atomic Garden
lekevicius
2
150
Keturios ateitys: didžiausių pasaulio kompanijų vizijos
lekevicius
0
190
∞ Loop: Apie begalinį žaidimą nuo pradžios iki pabaigos
lekevicius
1
500
Other Decks in Design
See All in Design
DC Style Redesign
mcduckyart
0
130
【Firefly Image 4対応版】上手にFireflyにお願いしてウェブデザイン案を出すぞ!
cremacrema
0
1.4k
BPStudy#213〜ビジネスアナリシスとDDD(ドメイン駆動設計)パネルディスカッション資料 / BPStudy213-panel
haru860
0
440
Saudade typeface
tiagoporto
0
330
「批評」を習慣にするための仕組みと場のデザイン/uxdesign202507
nikkei_engineer_recruiting
2
330
Goodpatch Tour💙 / We are hiring!
goodpatch
31
860k
21 Ways to Call American Airlines Customer Care Full Guide USA
americanhub
0
180
Cyber Heart Online Book
hjnasby
0
130
読書シェア会 vol.5 / Yumemi.grow 20250526
rakus_dev
0
1.6k
なぜプレイドにデザインエンジニアが必要だったのか?
t32k
0
540
Bulletproof Design System with TypeScript
takanorip
6
3.6k
Storyboard Honey
rocioparronrubio
0
280
Featured
See All Featured
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
357
30k
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.9k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Faster Mobile Websites
deanohume
307
31k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
The Pragmatic Product Professional
lauravandoore
35
6.7k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
26k
Automating Front-end Workflow
addyosmani
1370
200k
Why Our Code Smells
bkeepers
PRO
336
57k
Transcript
I V PA S K A I TA CSS: aprašomasis
dizainas Tinklapių dizainas Jonas Lekevičius, 2014
Šiandien matysite!
Šiandien matysite! • Keli praktiniai dalykai
Šiandien matysite! • Keli praktiniai dalykai • Kam skirtas CSS
Šiandien matysite! • Keli praktiniai dalykai • Kam skirtas CSS
• CSS selektoriai
Šiandien matysite! • Keli praktiniai dalykai • Kam skirtas CSS
• CSS selektoriai • Pagrindinės CSS savybės
Šiandien matysite! • Keli praktiniai dalykai • Kam skirtas CSS
• CSS selektoriai • Pagrindinės CSS savybės • Kur ieškoti daugiau informacijos
Šiandien matysite! • Keli praktiniai dalykai • Kam skirtas CSS
• CSS selektoriai • Pagrindinės CSS savybės • Kur ieškoti daugiau informacijos • Savaitės užduotis
3 praktiniai dalykėliai
vdk.lekevicius.com
Judėkite palengva ir labai tvarkingai
Pasidalinkite progresu per Dropbox
[email protected]
CSS: dizainas per apibūdinimus
CSS HTML JS
CSS
Counter Strike: Source CSS
Cascading Style Sheets CSS
Apibūdinkime dizainą žodžiais (jog net kompiuteris suprastų)
None
Iš ko susideda CSS?
Iš ko susideda CSS? • Įvardinimo apie kuriuos elementus kalbėsime
Iš ko susideda CSS? • Įvardinimo apie kuriuos elementus kalbėsime
• Tų elementų dizaino apibūdinimo per savybes
CSS selektoriai
Įvardinimas, kuriems elementams priskirsime savybes
<p id="intro">Labas</p>
<p class="description">Labas</p>
Pažaiskime!
http://flukeout.github.io
Pradėkime CSS!
http://lekevicius.github.io/vdk-lectures/get/4.zip
None
Kur ieškoti informacijos?
https://developer.mozilla.org/en-US/docs/Web/CSS
Coda Books
http://docs.emmet.io/cheat-sheet/
Užduotys
SAVAITĖS UŽDUOTYS
SAVAITĖS UŽDUOTYS Susitvarkykite HTML
SAVAITĖS UŽDUOTYS Susitvarkykite HTML Patys pereikite CSS Diner dar kartą
SAVAITĖS UŽDUOTYS Susitvarkykite HTML Patys pereikite CSS Diner dar kartą
Pradėkite kurti savo puslapio CSS
SAVAITĖS UŽDUOTYS Susitvarkykite HTML Patys pereikite CSS Diner dar kartą
Pradėkite kurti savo puslapio CSS Pasidalinkite puslapiu per Dropbox
Iki!