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

CSS_Flex_基礎二.pdf

Avatar for darrenyaoyaoyao darrenyaoyaoyao
October 26, 2020
Programming
0
56

 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
51
Pug.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
59
Sass.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
52
jquery.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
58
0c8adb02-ade8-47bb-9939-4d45110ffefd.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
49
bootstrap.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
74
Javasrcipt_基礎一.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
87
Javascript_基礎二.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
110
HTML__CSS_基礎_.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
51

Other Decks in Programming

See All in Programming
20250808_AIAgent勉強会_ClaudeCodeデータ分析の実運用〜競馬を題材に回収率100%の先を目指すメソッドとは〜
Avatar for Kakeru Sato kkakeru
0
210
[FEConf 2025] 모노레포 절망편, 14개 레포로 부활하기까지 걸린 1년
Avatar for Jonghyuk Max Kim mmmaxkim
0
1.2k
私の後悔をAWS DMSで解決した話
Avatar for 平目 hiramax
4
160
DockerからECSへ 〜 AWSの海に出る前に知っておきたいこと 〜
Avatar for Itaru Ota ota1022
5
1.8k
Oracle Database Technology Night 92 Database Connection control FAN-AC
Avatar for oracle4engineer oracle4engineer
PRO
1
260
MLH State of the League: 2026 Season
Avatar for Swift theycallmeswift
0
170
「リーダーは意思決定する人」って本当？～ 学びを現場で活かす、リーダー4ヶ月目の試行錯誤 ～
Avatar for Marina Nakagawa marina1017
0
250
Google I/O recap web編 大分Web祭り2025
Avatar for kponda kponda
0
2.9k
Flutter로 Gemini와 MCP를 활용한 Agentic App 만들기 - 박제창 2025 I/O Extended Seoul
Avatar for JaiChangPark itsmedreamwalker
0
150
AI OCR API on Lambdaを Datadogで可視化してみた
Avatar for Nealle nealle
0
210
Honoアップデート 2025年夏
Avatar for Yusuke Wada yusukebe
1
870
Laravel Boost 超入門
Avatar for Arlo fire_arlo
1
140

Featured

See All Featured
Product Roadmaps are Hard
Avatar for C. Todd Lombardo iamctodd
PRO
54
11k
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
279
23k
Building Adaptive Systems
Avatar for Chris Keathley keathley
43
2.7k
Designing for humans not robots
Avatar for Tammie Lister tammielis
253
25k
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
90
590k
The World Runs on Bad Software
Avatar for Brandon Keepers bkeepers
PRO
70
11k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.6k
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
49
14k
Faster Mobile Websites
Avatar for Dean Hume deanohume
309
31k
Git: the NoSQL Database
Avatar for Brandon Keepers bkeepers
PRO
431
65k
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1370
200k
Side Projects
Avatar for Sacha Greif sachag
455
43k

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 {

    } }