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

CSS_Flex_基礎二.pdf

Avatar for darrenyaoyaoyao darrenyaoyaoyao
October 26, 2020
Programming
63
0

 CSS_Flex_基礎二.pdf

Avatar for darrenyaoyaoyao

darrenyaoyaoyao

October 26, 2020

More Decks by darrenyaoyaoyao

See All by darrenyaoyaoyao
HTML__CSS_基礎二.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
60
Pug.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
72
Sass.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
58
jquery.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
77
0c8adb02-ade8-47bb-9939-4d45110ffefd.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
61
bootstrap.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
80
Javasrcipt_基礎一.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
94
Javascript_基礎二.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
130
HTML__CSS_基礎_.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
60

Other Decks in Programming

See All in Programming
存在論的プログラミング： 時間と存在を記述する
Avatar for Akihito Koriyama koriym
5
790
VueエンジニアがReactを触って感じた_設計の違い
Avatar for kouki.miura koukimiura
0
160
事業会社でのセキュリティ長期インターンについて
Avatar for inlet-back masachikaura
0
230
SkillがSkillを生む：QA観点出しを自動化した
Avatar for sontixyou sontixyou
6
3k
AIエージェントで業務改善してみた
Avatar for takumi taku271
0
480
Going Multiplatform with Your Android App (Android Makers 2026)
Avatar for Márton Braun zsmb
2
340
ローカルで稼働する AI エージェントを超えて / beyond-local-ai-agents
Avatar for geeawa gawa
2
250
RSAが破られる前に知っておきたい 耐量子計算機暗号(PQC)入門 / Intro to PQC: Preparing for the Post-RSA Era
Avatar for mackey0225 mackey0225
3
120
Running Swift without an OS
Avatar for Kishikawa Katsumi kishikawakatsumi
0
220
KagglerがMixSeekを触ってみた
Avatar for Morim morim
0
370
Codex CLIのSubagentsによる並列API実装 / Parallel API Implementation with Codex CLI Subagents
Avatar for 冨澤宝斗 takatty
2
850
メッセージングを利用して時間的結合を分離しよう #phperkaigi
Avatar for Takuma Kajikawa kajitack
3
560

Featured

See All Featured
Building Experiences: Design Systems, User Experience, and Full Site Editing
Avatar for Michelle Schulp Hunt marktimemedia
0
470
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
333
25k
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
Avatar for Akihiro Kokubo akihiro_kokubo
PRO
68
38k
The Curious Case for Waylosing
Avatar for Cassini Nazir cassininazir
0
290
Exploring the relationship between traditional SERPs and Gen AI search
Avatar for Ray Grieselhuber raygrieselhuber
PRO
2
3.8k
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
49
3.4k
[RailsConf 2023] Rails as a piece of cake
Avatar for Vladimir Dementyev palkan
59
6.5k
How to build a perfect <img>
Avatar for Jono Alderson jonoalderson
1
5.3k
AI: The stuff that nobody shows you
Avatar for John Nunemaker jnunemaker
PRO
4
520
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
96
14k
A Soul's Torment
Avatar for Nat Ma seathinner
5
2.6k
Amusing Abliteration
Avatar for ianozsvald ianozsvald
1
150

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 {

    } }