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
ブロガー勉強会〜HTML+CSSの超基礎編〜
Search
okutani
November 22, 2015
Programming
1.5k
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
ブロガー勉強会〜HTML+CSSの超基礎編〜
ブロガーのためのHTML+CSSの勉強会資料
okutani
November 22, 2015
More Decks by okutani
See All by okutani
Webエンジニアが 副業・フリーランスで活躍するために知っておくべき10のこと
okutani_t
1
330
Git勉強しよう会 #3
okutani_t
0
410
Git勉強しよう会 #2
okutani_t
0
720
約3年間WordPressで運用したブログで使い倒したプラグイン紹介
okutani_t
1
500
年末商戦に向けてCSとエンジニア間で取り組んだこと 〜Last Winter〜
okutani_t
0
390
フリーランスのWebエンジニアが月100万円稼ぐまでに読んだ参考書7選
okutani_t
0
190
Git勉強しよう会 #1
okutani_t
0
570
ブログ運営から学ぶ 『読まれる記事』とバズの話
okutani_t
0
90
Other Decks in Programming
See All in Programming
Performance Engineering for Everyone
elenatanasoiu
0
180
ADKを使って簡単にAIエージェントを作ってみよう
k1mu21
0
270
Honoでのサプライチェーン侵害対策 〜 3つのライブラリに学ぶ
yusukebe
6
1.3k
Creating Composable Callables in Contemporary C++
rollbear
0
150
軽量Java基盤の設計 DIコンテナに頼らない、長期保守と1秒起動の実現 JJUG CCC 2026 Spring
macha64
0
540
Inside Stream API
skrb
1
740
JJUG CCC 2026 Spring: JSpecify で実現する Kotlin フレンドリーな Java API 設計
ternbusty
1
180
ローカルLLMでどこまでコードが書けるか -拡張版 / How much code can be written on a local LLM Extended
kishida
11
4.3k
Oxcを導入して開発体験が向上した話
yug1224
4
320
決定論的オーケストレーションの設計と実装 / Design and Implementation of Deterministic Orchestration
nrslib
4
1.4k
AIで効率化できた業務・日常
ochtum
0
140
Datadog × OpenTelemetry 入門と実践のあいだ
kn_to_maxpno
1
160
Featured
See All Featured
Exploring anti-patterns in Rails
aemeredith
3
410
The Power of CSS Pseudo Elements
geoffreycrofte
82
6.3k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.7k
How to make the Groovebox
asonas
2
2.2k
Java REST API Framework Comparison - PWX 2021
mraible
34
9.4k
Designing for Timeless Needs
cassininazir
1
260
Paper Plane (Part 1)
katiecoart
PRO
0
9.1k
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.3k
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
390
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
123
22k
Making Projects Easy
brettharned
120
6.7k
Building a Scalable Design System with Sketch
lauravandoore
463
34k
Transcript
ϒϩΨʔษڧձ ʙ)5.- $44ͷجૅฤʙ
ࣗݾհ ✤PLVUBOJ wࡀ wϒϩάWEFFQӡӦ wࣄͰ)5.-ͱ͔1)1ͱ͔ wझຯ٢ࣉ८Γ
ࠓͷͳ͕Ε ᶃ8FCαΠτͷ͘͠Έ ᶄ)5.-ʜ$44ʜ ͬͯͳʹ ᶅϒϩάαΠτΛͭͬͯ͘ΈΑ͏
ΞΠεϒϨΠΫ͍ͨΉʂ
ΞΠεϒϨΠΫ ͙Β͍ ᶃ͔ΜͨΜͳࣗݾհ ᶄ͜ΜͳϒϩάͬͯΔ PSΓ͍ͨ ᶅ࠷ۙ͏Ε͔ͬͨ͠ɾͨͷ͔ͬͨ͜͠ͱ
ᶃ WebαΠτͷ͘͠Έ
8FCαΠτ͕ݟ͑Δ͘͠Έ
8FCαΠτ͕ݟ͑Δ͘͠Έ 8FCαΠτΛ࡞Δ
8FCαΠτ͕ݟ͑Δ͘͠Έ
8FCαΠτ͕ݟ͑Δ͘͠Έ Πϯλʔωοτ্ Ξοϓϩʔυ
8FCαΠτ͕ݟ͑Δ͘͠Έ Πϯλʔωοτ্ Ξοϓϩʔυ αʔόʔ
8FCαΠτ͕ݟ͑Δ͘͠Έ
8FCαΠτ͕ݟ͑Δ͘͠Έ 8FCαΠτ͕ΈΕΔ ͓ΘΓ
ᶄ HTMLͱCSS
)5.- ✴)ZQFS5FYU.BSLVQ-BOHVBHF ✴8FCαΠτͷʰߏʱΛද͢ ✴ίϯϐϡʔλ͕ཧղͰ͖Δ ✴จࣈͱ͔ը૾ͱ͔Ϧετͱ͔ʜ
)5.- ✴)ZQFS5FYU.BSLVQ-BOHVBHF ✴8FCαΠτͷʰߏʱΛද͢ ✴ίϯϐϡʔλ͕ཧղͰ͖Δ ✴จࣈͱ͔ը૾ͱ͔Ϧετͱ͔ʜ ࠓΔͷ )5.-
$44 ✴$BTDBEJOH4UZMF4IFFUT ✴8FCαΠτͷʰݟͨʱΛܾΊΔ ✴จࣈͷ৭ɺӨΛ͚ͭͨΓʜ
$44 ✴$BTDBEJOH4UZMF4IFFUT ✴8FCαΠτͷʰݟͨʱΛܾΊΔ ✴จࣈͷ৭ɺӨΛ͚ͭͨΓʜ ࠓΔͷ $44
ͨͱ͑
)5.-ͱ$44
CSS͕ແ͍ͱ…ʁ
)5.-ͱ$44
)5.-ͱ$44
)5.-ͱ$44 ݟ่͕ͨΕͯ͠·͏
ٯʹɺࠓͬͨͷ͕ ʮHTMLʯͱ͍͏͜ͱ (+JavaScriptͳͲ)
͏͢͜͠ৄ͍͠આ໌ ↓ ษڧձ༻ࢿྉ+ϚχϡΞϧ
ᶅ ϒϩάαΠτΛͭͬͯ͘ΈΑ͏
ϩοΫΫϥΠϛϯά
͔ͬͯΒ ֮͑Δ΄͏͕ ͍֮͑͢
ԿࣄͬͯΈΔ (ཧղ͋ͱͰOK)
ϒϩάαΠτ࡞ ͜ͷαΠτΛ ͔Βͭͬͯ͘Έ·͠ΐ͏
αϯϓϧαΠτΛ֬ೝ ษڧձ༻ࢿྉࢀর
JOEFYIUNMΛΤσΟλͰ։͍ͯ࡞ۀʂ
ଓ͖WebߨٛͰ
WordPressͰHTMLΛ ॻ͘ʹ… ↓ DEMO
Կ͔͋Γ·ͨ͠ΒWebͰʂ ຊ͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ