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

CSS_Flex_基礎二.pdf

Avatar for darrenyaoyaoyao darrenyaoyaoyao
October 26, 2020
Programming
69
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
68
Pug.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
88
Sass.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
72
jquery.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
99
0c8adb02-ade8-47bb-9939-4d45110ffefd.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
70
bootstrap.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
89
Javasrcipt_基礎一.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
99
Javascript_基礎二.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
140
HTML__CSS_基礎_.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
72

Other Decks in Programming

See All in Programming
2年かけて Deno に DOMMatrix を実装した話 / How I implemented DOMMatrix in Deno over two years
Avatar for petamoriken / 森建 petamoriken
0
200
Go言語とトイモデルで学ぶTransformerの気持ち / fukuokago23-transformer
Avatar for monochromegane monochromegane
0
160
GDG Korea Android: 2026 I/O Extended ~ What's new in Android development tools
Avatar for pluulove (노현석) pluu
0
210
Prismを使った型安全な暗号化_関数型まつり2026
Avatar for _fhhmm _fhhmm
0
170
信頼性について考えてみる（SRE NEXT 2026 miniLT）
Avatar for hayama hayama17
0
240
なぜ関数型プログラミングで「型」と「証明」が語られるのか #fp_matsuri
Avatar for Takuma Kajikawa kajitack
3
1.1k
20260722_microCMSで考える、AI時代のコンテンツ運用設計
Avatar for Yoshihisa Kaino yosh1
0
340
jsmini JavaScript Engine を作ってみた話
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
0
290
yield再入門 #phpcon
Avatar for hideki kinjyo o0h
PRO
0
930
わからない話を追いかけたら、プログラミング言語を作る側にいた
Avatar for ydah ydah
3
450
「人を評価する AI」の 設計と実装 
Avatar for 奈良亮耶 ryoyanara
0
150
Claude Opus 4.6以後の受託開発エンジニアの変化(Claude Code開発ノウハウ大公開スペシャルbyクラスメソッド)
Avatar for t-iida iidatakuma
1
970

Featured

See All Featured
Amusing Abliteration
Avatar for ianozsvald ianozsvald
1
240
Measuring & Analyzing Core Web Vitals
Avatar for Philip Tellis bluesmoon
9
950
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
5.1k
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
31
6.9k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.7k
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1033
470k
The Hidden Cost of Media on the Web [PixelPalooza 2025]
Avatar for Tammy Everts tammyeverts
2
420
Building an army of robots
Avatar for Kyle Neath kneath
306
46k
Leadership Guide Workshop - DevTernity 2021
Avatar for David Neal reverentgeek
1
330
Crafting Experiences
Avatar for Bethany Jepchumba bethany
1
240
How to Grow Your eCommerce with AI & Automation
Avatar for Katarina Dahlin katarinadahlin
PRO
1
230
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
Avatar for Szymon Słowik szymonslowik
1
1.2k

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 {

    } }