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
CSS: selector
Search
Masateru YOSHIMURA
July 10, 2020
Technology
0
800
CSS: selector
Masateru YOSHIMURA
July 10, 2020
Tweet
Share
More Decks by Masateru YOSHIMURA
See All by Masateru YOSHIMURA
Digital Design 2022-02
mathatelle
0
380
Digital Design 2022-01
mathatelle
0
270
Yoshimura Lab. 2022
mathatelle
0
1.3k
create-website-html-2021
mathatelle
0
150
Multiple pages
mathatelle
0
700
How to design the individual page
mathatelle
1
110
CodePen: Making your portfolio 2021
mathatelle
0
150
single page
mathatelle
0
880
How to optimize images for Better Web Design
mathatelle
0
2.1k
Other Decks in Technology
See All in Technology
251029 JAWS-UG AI/ML 退屈なことはQDevにやらせよう
otakensh
0
110
20251027_マルチエージェントとは
almondo_event
1
490
OpenCensusと歩んだ7年間
bgpat
0
260
戦えるAIエージェントの作り方
iwiwi
15
6.7k
様々なファイルシステム
sat
PRO
0
270
.NET 10のBlazorの期待の新機能
htkym
0
160
可観測性は開発環境から、開発環境にもオブザーバビリティ導入のススメ
layerx
PRO
4
2.3k
Retrospectiveを振り返ろう
nakasho
0
140
組織全員で向き合うAI Readyなデータ利活用
gappy50
5
1.9k
知覚とデザイン
rinchoku
1
660
AWS re:Invent 2025事前勉強会資料 / AWS re:Invent 2025 pre study meetup
kinunori
0
880
オブザーバビリティが育むシステム理解と好奇心
maruloop
3
1.7k
Featured
See All Featured
BBQ
matthewcrist
89
9.9k
Optimizing for Happiness
mojombo
379
70k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.2k
The World Runs on Bad Software
bkeepers
PRO
72
11k
Building an army of robots
kneath
306
46k
KATA
mclloyd
PRO
32
15k
Typedesign – Prime Four
hannesfritz
42
2.8k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
34
2.3k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
2.9k
Optimising Largest Contentful Paint
csswizardry
37
3.5k
Transcript
ηϨΫλͷॻ͖ํ
༻ޠͷ͓͞Β͍ h1 { font-size: 80px; } ᶄϓϩύςΟ ᶅ ᶃηϨΫλ ελΠϦϯάͷର
ηϨΫλͷॻ͖ํᶃ)5.-ͷཁૉ໊Λ༻͍Δ h1 { font-size: 80px; } )5.- )5.-ͷཁૉ໊Λͦͷ··༻͍Δ $44 <h1>ΈΜͳͷ͓ؾʹೖΓ</h1>
ϖʔδͷͯ͢ͷIʹରͯ͠ɺ͜ͷελΠϧ͕ద༻͞ΕΔ
.title { font-size: 80px; } ηϨΫλͷॻ͖ํᶄ)5.-ͷDMBTT໊Λ༻͍Δ )5.- DMBTTͷΛ༻͍Δ $44 <h1
class="title">ΈΜͳͷ͓ؾʹೖΓ</h1> υοτΛ͚Δ
h1, h2 { text-align: center; } ηϨΫλͷॻ͖ํᶅ·ͱΊͯద༻͢Δ )5.- $44 <h1>ΈΜͳͷ͓ؾʹೖΓ</h1>
. . . <h2>ΈΜͳͷ͓ؾʹೖΓ</h1> ΧϯϚͰ۠Δ ෳͷཁૉΛରʹ·ͱΊͯελΠϧΛద༻Ͱ͖Δ
h1 img { width: 240px; } ηϨΫλͷॻ͖ํᶆ )5.- Iͷதʹ͋ΔJNH˞ݟग़͠ͷը૾͚ͩʹ͜ͷελΠϧ͕ద༻͞ΕΔ $44
<h1><img src="***.png" alt="ΈΜͳͷ͓ؾʹೖΓ"></h1> ֯εϖʔεͰۭ͚Δ img { width: 240px; } ͜ͷΑ͏ʹॻ͘ͱɺϖʔδͷதͷ ͯ͢ͷJNHʢը૾ʣͷ෯͕ QYʹࢦఆ͞ΕΔɻ ˞ಛఆͷରʹߜͬͯࢦఆ͍ͨ͠߹ ͍͚͕ Ͱ͖ΔΑ͏ʹ ͠Α͏
<items class="items my-items”> . . . <items class="items our-items"> DMBTTʹෳͷΛೖΕΔ
)5.- JUFNTʹڞ௨ͷελΠϧΛɺ PVSJUFNTʹରͯ͠ಛఆͷελΠϧΛద༻Ͱ͖Δ ֯εϖʔεΛೖΕΔ