定例WordPress講座 – HTML&CSS編

講座に使用した資料

HTMLの基本

無料で学習できるのでドキュメントを参考にしてみる。

https://developer.mozilla.org/ja/docs/Learn/HTML/Introduction_to_HTML

書籍を参考にしてもよい。

CSSの基本

https://developer.mozilla.org/ja/docs/Web/CSS/Reference

CSSを実際に書いてみよう！

CSSを追加する方法

• 子テーマを制作して追加する
• カスタムCSS機能を利用する（WordPress4.7以降）

Feature Proposal: Better theme customizations via custom CSS with live previews

CSSの書き方いろいろ〜１〜デモテンプレート

See the Pen CSS Writing Demo for WordBenchGifu vol.8 by OleinDesign (@OleinDesign) on CodePen.

https://production-assets.codepen.io/assets/embed/ei.js

CSSの書き方いろいろ〜２〜デモテンプレート

See the Pen CSS Selector Demo for WordBenchGifu vol.8 by OleinDesign (@OleinDesign) on CodePen.

https://production-assets.codepen.io/assets/embed/ei.js

CSSの詳細度を体験してみよう！デモテンプレート

See the Pen Level of Detail Demo for WordBenchGifu vol.8 by OleinDesign (@OleinDesign) on CodePen.

https://production-assets.codepen.io/assets/embed/ei.js

【番外】代表的なエディタの紹介

https://atom.io/

http://brackets.io/

https://www.adobe.com/jp/products/dreamweaver.html

https://panic.com/jp/coda/

https://www.jetbrains.com/phpstorm/buy/

https://prepros.io