定例WordPress講座 – HTML&CSS編

講座に使用した資料

HTMLの基本

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

HTML 入門

本来、HTML は、要素で構成される極めてシンプルな言語です。HTMLは、テキストの断片に、文書における他とは異なる意味 (段落なのか？箇条書きなのか？表の一部なのか？) …

developer.mozilla.org

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

CSSの基本

CSS リファレンス

この CSS リファレンス は、すべての標準 CSS プロパティ、擬似クラス、擬似要素、データ型、@-規則 の アルファベット順の索引 として利用できます。また、すべての CSS …

developer.mozilla.org

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

CSSを追加する方法

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

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

When people ask “why WordPress?”, some of the most common answers center around flexibility for users of all kinds, whether they’re building their sites primar…

make.wordpress.org

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

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

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

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

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

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

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

A hackable text editor for the 21st Century

At GitHub, we’re building the text editor we’ve always wanted: hackable to the core, but approachable on the first day without ever touching a config file. We …

atom.io

PhpStorm: JetBrains Toolbox subscription

The most intelligent PHP IDE with refactorings, code completion, on-the-fly code analysis and coding productivity orientation

www.jetbrains.com