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

CSS_Flex_基礎二.pdf

Avatar for darrenyaoyaoyao darrenyaoyaoyao
October 26, 2020
Programming
66
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
62
Pug.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
79
Sass.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
62
jquery.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
83
0c8adb02-ade8-47bb-9939-4d45110ffefd.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
62
bootstrap.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
83
Javasrcipt_基礎一.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
96
Javascript_基礎二.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
130
HTML__CSS_基礎_.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
65

Other Decks in Programming

See All in Programming
AIを導入する前にやるべきこと
Avatar for Negima negima
2
290
クラウドネイティブなエンジニアに向ける Raycastの魅力と実際の活用事例
Avatar for Nealle nealle
2
220
Running Swift without an OS
Avatar for Kishikawa Katsumi kishikawakatsumi
0
860
YJITとZJITにはイカなる違いがあるのか？
Avatar for yamanao nakiym
0
260
PHP で mp3 プレイヤーを実装しよう
Avatar for memory m3m0r7
PRO
0
290
Surviving Black Friday: 329 billion requests with Falcon!
Avatar for Samuel Williams ioquatix
0
1.3k
The Monolith Strikes Back: Why AI Agents ❤️ Rails Monoliths
Avatar for Rodrigo Serradura serradura
0
360
10 Tips of AWS ～Gen AI on AWS～
Avatar for matsukada licux
5
480
VueエンジニアがReactを触って感じた_設計の違い
Avatar for kouki.miura koukimiura
0
190
【26新卒研修資料】TDD実装演習
Avatar for ディップ株式会社 dip_tech
PRO
0
110
Going Multiplatform with Your Android App (Android Makers 2026)
Avatar for Márton Braun zsmb
2
460
HTML-Aware ERB: The Path to Reactive Rendering @ RubyKaigi 2026, Hakodate, Japan
Avatar for Marco Roth marcoroth
0
390

Featured

See All Featured
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
47
8.1k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
55
8.1k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
120
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
Avatar for Szymon Słowik szymonslowik
1
1k
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
340
58k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
515
110k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
28
3.5k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
8.1k
Heart Work Chapter 1 - Part 1
Avatar for Lake Fama lfama
PRO
6
35k
Stewardship and Sustainability of Urban and Community Forests
Avatar for Eric Wiseman pwiseman
0
190
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
1.1k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
Avatar for UX Y'all uxyall
0
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 {

    } }