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

CSS_Flex_基礎二.pdf

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for darrenyaoyaoyao darrenyaoyaoyao
October 26, 2020
Programming
76
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
72
Pug.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
89
Sass.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
72
jquery.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
100
0c8adb02-ade8-47bb-9939-4d45110ffefd.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
73
bootstrap.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
1
91
Javasrcipt_基礎一.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
99
Javascript_基礎二.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
150
HTML__CSS_基礎_.pdf
Avatar for darrenyaoyaoyao darrenyaoyaoyao
0
77

Other Decks in Programming

See All in Programming
源内ハンズオン概要編
Avatar for Hideyuki Nagata hideg
0
210
メールのエイリアス機能を履き違えない
Avatar for 船長（せんちょう） isshinfunada
0
250
ALB ログから Trace を気合で繋げる技術
Avatar for Hayato Kawai fohte
5
480
自動化したのに回らない テスト運用の壁 ―AI時代の品質責任と生産性
Avatar for Masahiko Funaki(舟木 将彦) mfunaki
0
480
PostgreSQL 18で考えるUUID主キー
Avatar for Kazuhiro Seo kazuhiro1982
0
500
プロポーザルを書いてもらう
Avatar for pvcresin pvcresin
0
580
AIに既存システムを理解させる技術　～レガシーを見捨てないハーネスエンジニアリング入門～
Avatar for Ochtum ochtum
0
150
進化を続けるGo toolsの現在地 / The Current State of Ever-Evolving Go Tools
Avatar for hond hond0413
0
260
AI Engineeringは、AIプロダクトだけのものか？ 〜AIがソフトウェアを作る時代の新しい当たり前〜 / No AI in your product. AI Engineering in your development.
Avatar for r-kagaya rkaga
5
530
Dockerfile CMD for Node.js
Avatar for Ohno Keita grazie1999
0
120
<title><a id="</title>君はこのHTMLをパースできるか"></a></title> #雑LT_study
Avatar for pizzacat83 pizzacat83
0
180
AIと壁打ちしながら進めるコスト管理
Avatar for Ryoma Fujiwara fufuhu
2
1.7k

Featured

See All Featured
Code Reviewing Like a Champion
Avatar for maltzj maltzj
528
40k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
239
140k
Exploring the relationship between traditional SERPs and Gen AI search
Avatar for Ray Grieselhuber raygrieselhuber
PRO
2
4.2k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
133
19k
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
17k
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
Un-Boring Meetings
Avatar for Sebastian Deterding codingconduct
0
390
End of SEO as We Know It (SMX Advanced Version)
Avatar for Michael King ipullrank
3
4.4k
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
Avatar for MADOX madoxten
64
56k
30 Presentation Tips
Avatar for Ian Lurie portentint
PRO
1
380
The Director’s Chair: Orchestrating AI for Truly Effective Learning
Avatar for Mike Taylor tmiket
1
280
Building a A Zero-Code AI SEO Workflow
Avatar for Ian Lurie portentint
PRO
0
690

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 {

    } }