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

CSS_Flex_基礎二.pdf

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for darrenyaoyaoyao darrenyaoyaoyao
October 26, 2020
Programming
0
60

 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
58
Pug.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
70
Sass.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
56
jquery.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
71
0c8adb02-ade8-47bb-9939-4d45110ffefd.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
58
bootstrap.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
78
Javasrcipt_基礎一.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
92
Javascript_基礎二.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
130
HTML__CSS_基礎_.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
58

Other Decks in Programming

See All in Programming
nuget-server - あなたが必要だったNuGetサーバー
Avatar for Kouji Matsui kekyo
PRO
0
250
nilとは何か 〜interfaceの構造とnil!=nilから理解する〜
Avatar for kuro kuro_kurorrr
3
1.9k
Everything Claude Code OSS詳細 — 5層構造の中身と導入方法
Avatar for techs-targe targe
0
110
Codex の「自走力」を高める
Avatar for yorifuji yorifuji
0
1.2k
20260228_JAWS_Beginner_Kansai
Avatar for Takuya Yonezawa takuyay0ne
5
530
コーディングルールの鮮度を保ちたい / keep-fresh-go-internal-conventions
Avatar for NAGATA Hiroaki handlename
0
200
SourceGeneratorのマーカー属性問題について
Avatar for tkym htkym
0
200
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
480
Claude Code Skill入門
Avatar for maya mayahoney
0
390
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
550
AI Assistants for Your Angular Solutions
Avatar for Manfred Steyer manfredsteyer
PRO
0
140
AHC061解説
Avatar for Shun_PI shun_pi
0
380

Featured

See All Featured
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
413
23k
Bootstrapping a Software Product
Avatar for Garrett Dimon garrettdimon
PRO
307
120k
Abbi's Birthday
Avatar for Violet Bock coloredviolet
2
5.4k
The Mindset for Success: Future Career Progression
Avatar for Greg Gifford greggifford
PRO
0
280
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
Avatar for Mfonobong Umondia mfonobong
2
320
How to Talk to Developers About Accessibility
Avatar for Jason CranfordTeague jct
2
150
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
281
24k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
Avatar for Sara Fernández Carmona sarafernandez
0
150
My Coaching Mixtape
Avatar for mlcsv mlcsv
0
72
Groundhog Day: Seeking Process in Gaming for Health
Avatar for Sebastian Deterding codingconduct
0
120
The Curious Case for Waylosing
Avatar for Cassini Nazir cassininazir
0
270

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 {

    } }