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

CSS_Flex_基礎二.pdf

darrenyaoyaoyao
October 26, 2020
Programming
0
52

 CSS_Flex_基礎二.pdf

darrenyaoyaoyao

October 26, 2020
Tweet

More Decks by darrenyaoyaoyao

See All by darrenyaoyaoyao
HTML__CSS_基礎二.pdf
darrenyaoyaoyao
0
46
Pug.pdf
darrenyaoyaoyao
0
52
Sass.pdf
darrenyaoyaoyao
0
48
jquery.pdf
darrenyaoyaoyao
1
52
0c8adb02-ade8-47bb-9939-4d45110ffefd.pdf
darrenyaoyaoyao
0
42
bootstrap.pdf
darrenyaoyaoyao
1
65
Javasrcipt_基礎一.pdf
darrenyaoyaoyao
0
78
Javascript_基礎二.pdf
darrenyaoyaoyao
0
110
HTML__CSS_基礎_.pdf
darrenyaoyaoyao
0
46

Other Decks in Programming

See All in Programming
Djangoアプリケーション 運用のリアル 〜問題発生から可視化、最適化への道〜 #pyconshizu
kashewnuts
1
230
AHC041解説
terryu16
0
590
iOSエンジニアから始める visionOS アプリ開発
nao_randd
3
120
テストをしないQAエンジニアは何をしているか？
nealle
0
130
Flutter × Firebase Genkit で加速する生成 AI アプリ開発
coborinai
0
150
XStateを用いた堅牢なReact Components設計~複雑なClient Stateをシンプルに~ @React Tokyo ミートアップ #2
kfurusho
1
770
TokyoR116_BeginnersSession1_環境構築
kotatyamtema
0
110
DROBEの生成AI活用事例 with AWS
ippey
0
130
Unity Android XR入門
sakutama_11
0
140
Amazon Q Developer Proで効率化するAPI開発入門
seike460
PRO
0
110
動作確認やテストで漏れがちな観点3選
starfish719
6
1k
Domain-Driven Transformation
hschwentner
2
1.9k

Featured

See All Featured
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
31
2.1k
Build The Right Thing And Hit Your Dates
maggiecrowley
34
2.5k
Thoughts on Productivity
jonyablonski
69
4.5k
A designer walks into a library…
pauljervisheath
205
24k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
175
51k
Fireside Chat
paigeccino
34
3.2k
Building Flexible Design Systems
yeseniaperezcruz
328
38k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
3
310
Scaling GitHub
holman
459
140k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
VelocityConf: Rendering Performance Case Studies
addyosmani
328
24k

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 {

    } }