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

CSS_Flex_基礎二.pdf

Avatar for darrenyaoyaoyao darrenyaoyaoyao
October 26, 2020
Programming
0
55

 CSS_Flex_基礎二.pdf

Avatar for darrenyaoyaoyao

darrenyaoyaoyao

October 26, 2020
Tweet

More Decks by darrenyaoyaoyao

See All by darrenyaoyaoyao
HTML__CSS_基礎二.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
50
Pug.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
55
Sass.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
51
jquery.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
57
0c8adb02-ade8-47bb-9939-4d45110ffefd.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
46
bootstrap.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
71
Javasrcipt_基礎一.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
82
Javascript_基礎二.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
110
HTML__CSS_基礎_.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
50

Other Decks in Programming

See All in Programming
Efficiency and Rock 'n’ Roll (Really!)
Avatar for Holly Cummins hollycummins
0
600
Zennの運営完全に理解した #完全に理解したTalk
Avatar for Yusuke Wada wadayusuke
1
140
#QiitaBash TDDでAIに設計イメージを伝える
Avatar for sigma ryosukedtomita
2
1.6k
Rethinking Data Access: The New httpResource in Angular
Avatar for Manfred Steyer manfredsteyer
PRO
0
220
❄️ tmux-nixの実装を通して学ぶNixOSモジュール
Avatar for Mutsuha Asada momeemt
1
120
クラシルリワードにおける
iOSアプリ開発の取り組み
Avatar for fumito nakazawa funzin
1
810
AI Coding Agent Enablement in TypeScript
Avatar for Yuku Kotani yukukotani
17
7.2k
OpenNext + Hono on Cloudflare で イマドキWeb開発スタックを実現する
Avatar for rokuosan rokuosan
0
110
TSConfig Solution Style & subpath imports to switch types on a per-file basis
Avatar for South maminami373
1
180
イベントストーミングから始めるドメイン駆動設計
Avatar for おだかとしゆき jgeem
3
420
External SecretsのさくらProvider初期実装を担当しています
Avatar for logica / Takuto Nagami logica0419
0
240
RubyKaigi Hack Space in Tokyo & 函館最速 "予習" 会 / RubyKaigi Hack Space in Tokyo & The Fastest Briefing of RubyKaigi 2026 in Hakodate
Avatar for moznion moznion
1
130

Featured

See All Featured
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
51
3.2k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
512
110k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
34
3k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
81
9k
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
28
3.8k
BBQ
Avatar for Matthew Crist matthewcrist
88
9.7k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
45
7.3k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
Avatar for Eileen M. Uchitelle eileencodes
137
34k
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
94
13k
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
276
23k
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
273
40k
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
29
2.6k

Transcript

  1. CSS Flex 盒⼦模型 基礎⼆ 排版進階練習

  2. 今⽇⽬標

  3. https://darrenyaoyao.github.io/

  4. Flex-direction column row

  5. Flex 比例 flex: 3 flex: 1

  6. justify-content

  7. align-items

  8. RWD 響應式網站 網站排版會隨著螢幕⼤⼩不同
 ⽽有所調整

  9. media query @media screen and (max-width: 900px) { .container {

    } }