Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
表の幅はどう決まる
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
おばらつかさ
February 02, 2018
Design
1.1k
3
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
表の幅はどう決まる
表の幅決定の仕組みを解説します。
おばらつかさ
February 02, 2018
Other Decks in Design
See All in Design
もう迷わない!“なんとなく”を卒業するフォントの選び方【村田俊英】
toshihidemurata
0
620
公開スライド)熊本市様-電子申請中級編
garyuten
1
1.3k
ClaudeCodeでマーケターの課題を解決する
kenichiota0711
11
14k
CULTURE DECK/Frontend Engineer
mhand01
0
1.3k
速く作れるかではなく、速く学べるか ― 学習ループを回すパイロットの途中報告
nagata03
0
490
富山デザイン勉強会_デザイントレンド2026.pdf
keita_yoshikawa
3
230
図面資産×AI 眠れる資産を起こす挑戦
aonomasahiro
0
150
つくり方を変えていく | change-how-we-build
mottox2
2
1.3k
「おすすめ」はなぜ信用されないのか - 信頼を築くUI/UX設計
ryu1013
0
130
コンテンツ作成者の体験を設計する
chiilog
0
180
デザインコンテキストのバトンをつなぐ—AI時代のプロダクトマネジメント
kumanoayumi
6
1.2k
Mandalyn_DT5001_FinalAssignment.pdf
lynteo
0
240
Featured
See All Featured
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
marketingsoph
0
170
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
helenjbeal
1
240
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
65
55k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
38
2.9k
Docker and Python
trallard
47
3.9k
Thoughts on Productivity
jonyablonski
76
5.2k
From Legacy to Launchpad: Building Startup-Ready Communities
dugsong
0
230
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
170
Fireside Chat
paigeccino
42
3.9k
SEO for Brand Visibility & Recognition
aleyda
0
4.6k
The Power of CSS Pseudo Elements
geoffreycrofte
82
6.3k
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
330
Transcript
දͷ෯Ͳ͏ܾ·Δ IUNMK8FCϓϥοτϑΥʔϜ෦ୈճษڧձ
ࣗݾհ w גࣜձࣾϐΫηϧάϦου w ݱࡏ6*σβΠφʔΛ໊͍ͬͯΔ w ࢴഔମͷࠂσβΠϯΛ͙Β͍ͬͯ·ͨ͠ w 8FCؔ࿈ͷܦݧ͙Β͍ w
ϐΫηϧάϦουͰओʹ6*ઃܭͱը໘σβΠϯ w ࢴͷ͔࣌Β࡞ۀʹ"EPCF*MMVTUSBUPSΛͬͯ·͢ ͓Β͔ͭ͞ !TBVDFSKQ
ॻ੶ w ϊϯσβΠφʔζɾσβΠϯϒοΫ<ୈ൛> ຊޠσβΠϯαϯϓϧ ղઆ w վగ൛8FCσβΠφʔͷͨΊͷK2VFSZೖ σβΠϯαϯϓϧ ղઆ
8FCΞϓϦ࡞ͬͨΓͯ͠·͢ w)6& K2VFSZ w-JWF.E 7VFKT $ISPNF&YUFOTJPO wࣾ༻ͷ8FCΞϓϦ 7VFKT
'JSFCBTF wࣾ༻ͷ4MBDLίϚϯυ 4MBDL $MPVE'VODUJPOT 'JSFCBTF
ࠓͷ༰ σβΠφʔ͞ΜΛରʹͯ͠ɺ දͷ෯ܾఆͷΈΛऔΓ্͛·͢
͍͖ͳΓಓͳͷͰ͕͢ʜ
##ͷϨεϙϯγϒࣄ
w #$ϞόΠϧϑΝʔετ͕ͩʜ w اۀͰͷར༻ϊʔτ1$σεΫτοϓ1$͕ओྲྀ w ϞόΠϧͷΈͰۀΛ݁ͤ͞Δͷ͍͠ w σεΫτοϓϑΝʔετ ϝΠϯ
ը໘ଆʹͲΜͳཁٻ͕͋Δ͔
ϨεϙϯγϒରԠͷӨڹ ࢁͷਓ͕ͻͱͭͷ͍ํͱ͍͏ΑΓɺͻͱΓͷਓ͕ࢁͷ͍ํͱͳΔ
w ༻ײʹมԽ͕Ͱʹ͍͘ͷʹ w XJOEPXαΠζ w ཁૉྔ w ݖݶ w ͝ͱͷֶशίετΛݮΒ͍ͨ͠
ϨεϙϯγϒରԠͷӨڹ ͝ͱͷϑΟοτײΑΓֶशࡁΈ͍উखͷ࠶ར༻
ϨεϙϯγϒରԠͷӨڹ ྫ͑มԽͷܹ͍͠ϨΠΞτΛආ͚Δͱ͔
ͳͷͰɺ࠾༻͠ʹ͍͘ػೳ͕͋Δ
ߦͱྻ͕ΈมΘΔදΈ
w ҰཡੑΛ٘ਜ਼ʹ͍͢͠ w ߦྻೖΕସΘΔͱ࠶ֶश͕ඞཁʹͳΔ w पลཁૉͷҐஔ͕มԽͯ͠͠·͏ w େɺ࣮͕େมʹͳΔ w େɺอक͕େมʹͳΔ
w όάΛੜΈ͕ͪ w ޙ͔Βͷํมߋ͕͍͠ w DPMTQBO SPXTQBO͋ΔͱͭΒ͍ ߦͱྻ͕ΈมΘΔදΈ
ͦΕΑΓදͷڍಈΛѲ͍ͨ͠
w ҙ֎ͱࢥ͍௨ΓʹͳΒͳ͍͜ͱ͕ଟ͍ w ͳΜͱͳ͘ʮͰ͖ΔͩΖ͏ʯͰσβΠϯ͕ͪ͠ w ༰͕ՄมʹͳΔͱ࠷ऴతͳ༧ଌ͕͠ʹ͍͘ w ςʔϒϧɺΘΓͱ͏ ͍ͬͯΔΑ͏ͰΒͳ͍
͋Γ͕ͪͳ͜ͱʜ
w ͬ͘͟ΓΔ͚ͩͰҧ͏ w σβΠφʔ͕ཧղ͢Δ͜ͱͰϝϦοτ͕ w ݁Ռ͕༧Ͱ͖ΔͷͰσβΠϯͷ෯͕͕Δ w ࣮ऀͱͷձ͕εϜʔζʹ w ఆ֎ͷࣄଶͱ͍͏ͷΛݮΒͤΔ
w ΑΓྑ͍ͷ͕Ϣʔβʔʹಧ͖͘͢ͳΔ ςʔϒϧͱྑ͘ͳΖ͏ σβΠφʔ͕Ұา౿ΈࠐΜͰΈΔ
෯ܾఆͷΈ
w ෯ܾఆͷܭࢉํ๏ʹݻఆͷ༷͋Γ·ͤΜ w )5.-༷ʹਪ͞ΕΔͻͱͭͷྫ͕ࡌ͍ͬͯΔ w ϒϥβϕϯμʔଆͷࡋྔͰΞϧΰϦζϜΛ࠾༻Ͱ͖Δ w ͨͩɺ࣮ࡍͷ݁ՌΛൺΔͱ΄΅͓ͳ͡ܭࢉ݁ՌͱͳΔ w ࠓճɺͦͷਪྫͰղઆ
લఏ
w දΈʹͭͷϞʔυ͕͋Δ w UBCMFMBZPVUͷBVUPͱpYFE w ಛผͳࢦఆΛ͠ͳ͚ΕBVUPͱͳΔ w pYFEࢦఆΛ͠ͳ͍ͱ༗ޮʹͳΒͳ͍ BVUPͱpYFE ·ͣେ͖ͳ͔Ε
BVUPͱpYFE େ͖͘ҧ͏෦
table-layout: fixed;
w ؆୯ w ηϧͻͨ͢ΒۉʹׂΔ w ηϧʹXJEUIࢦఆ͕͋ΕɺͦΕʹै͍ɺΓۉʹ w ηϧ෯͕ڱ·ͬͨ࣌ͷ༰ՄೳͳݶΓંΓฦ͢ w ંΓฦ͠Ͱ͖ͳ͘ͳͬͨΒςΩετ͕ηϧΛಥ͖ൈ͚Δ
w αϯϓϧ pYFEͷ߹
table-layout: auto;
w ͍͜͠ w ηϧ෯͕ڱ·ͬͨ࣌ͷ༰ՄೳͳݶΓંΓฦ͢ w ંΓฦ͠Ͱ͖ͳ͘ͳͬͨΒද͕ྖҬΛಥ͖ൈ͚Δ w ෯ܭࢉʹΑׂͬͯΓৼΒΕΔ w αϯϓϧ
BVUPͷ߹
Ͱɺྻͷ෯ܭࢉ
w ·ͣશͯͷηϧʹ͓͍ͯ࠷খ෯ͱ࠷େ෯Λࢉग़͢Δ w ද͕࠷খαΠζͰೖΒͳ͚Εಥ͖ൈ͚Δ w ද͕࠷େαΠζͰೖΔͳΒͦΕͰೖΕΔ w ંΓฦͯ͠ೖΔͳΒఔΑ͍෯ΛׂΓৼͬͯೖΕΔ w ྖҬͷ༨Γʢ8ʣྖҬͷ෯දͷ࠷খ෯
w දͷมԽྔʢ%ʣදͷ࠷େ෯දͷ࠷খ෯ w ֤ྻͷมԽྔʢEʣྻͷ࠷େ෯ྻͷ࠷খ෯ w ֤ྻʹ8ʸ%ʷEͨ͠ΛׂΓͯΔ େ·͔ͳྲྀΕ
ͳΔ΄ͲɺΘ͔ΒΜɻ
࠷খ෯ͱ࠷େ෯ͷαϯϓϧ
8ʸ%ʷE
None
None
None
None
None
None
None
w ྖҬͷ෯ͷ༨ΓΛɺ༰ͷมԽྔʹԠׂͯ͡Γ͍ͯͯΔ w ςΩετྔ͕ଟ͍΄Ͳ෯͕͘ͳΔ w ݫີʹ࠷খͱ࠷େͷมԽྔͰ෯ׂ͕ΓৼΒΕΔ w มԽྔ͕গͳ͍ηϧʹڱ͍෯ w มԽྔ͕ଟ͍ηϧʹ͍෯
·ͱΊΔͱʜ
·ͱΊΔͱʜ
࠷ޙʹɺ͞Βʹ͏Ұา
w ΈΛͬͯͬͺΓ࣮ࡍʹಈ͔͢ͷ͕ཧత w ΈΛΔͷʮμϝ͔ʯʹහײʹͳΔͨΊ w ࣮ࡍʹͲ͏ͳΔ͔ΛσβΠϯஈ֊Ͱ͔֬ΊΒΕΔͱ҆৺ w ෦తʹͰ͍͍ͷͰ࡞ͬͯΈΔͱͲ͏ͳΔ͔͕Θ͔Δ w ࣮ࡍͷಈ࡞͕ݕূ͞ΕͨσβΠϯ࣮ऀ҆৺
w +4'JEEMFͱ͔$0%&1&/ͱ͔͕खܰ ࣮ࡍʹಈ͘ͷͰ֬ೝ มͳදΈʹͳΓͦ͏ͱ͍͏༧ײ͕ͨ͠Βɺ࣮ࡍʹ֬ೝ͢Δͷ͕ۙಓ
ΑΓৄ͍͠ใʜ ϐΫηϧάϦουͰ༗ྉͷٕज़ใ৴Λ͍ͯ͠·͢ ࠓճհͨ͠༰ͷΑΓৄ͍͠هࣄ͋Γ·͢
6*σβΠφʔืू͍ͯ͠·͢ ϐΫηϧάϦουͰҰॹʹಇ͍ͯ͘ΕΔ 6*σβΠφʔΛืू͍ͯ͠·͢
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠