ツイート
シェア
LINEで送る
B! はてぶでブックマーク
Pocketでブックマーク
RSSフィード

CSS

WordPress 子テーマのCSSで上書きはやめよう。無駄をなくしてサイズを小さくするコツ。

wordpress image

WordPressのテーマでカスタマイズしたいときに子テーマを作ります。

親テーマのCSSを変更したいとき、子テーマでCSSを用意して親テーマのCSSの設定を上書きする人もいるのではないでしょうか?

しかしこれは避けたほうがいいです。理由は『CSSのサイズが大きくなる』から。

『それじゃあ、どうするのか?』を説明します。

続きを読む

WordPress5, プレビュー表示が遅いのを直す。無駄をなくす作業。

wordpress image

WordPressのバージョン5の編集エディタgutenbergには『プレビュー』ボタンがあります。

ページの確認(正式なページではない)ができるのですが、『プレビューを生成中...』で止まってなかなか表示されません。

これまで我慢してきたのですが、やっと解決方法が見つかりました。

続きを読む

かんたんCSS, HTML抜きで要素を追加する(::before, ::after)

css3 image

::before, ::afterはCSSの疑似要素で一番使います。CSSで新たに要素を追加します。HTMLに書くまでもない要素を作るときに使います。

それについて、かんたんに誰でも分かるようにサンプルコードを使いながら解説します。

(ここでしか使えないcontentプロパティも説明します。)

続きを読む

HTMLとCSSだけで簡単に作る。軽量な閉じる・すべて表示ボタン

html5 css3 image

HTMLとCSSだけで『閉じる・すべて表示』ボタンをかんたんに作る方法をご紹介します。

このボタンは、画面を遷移しないでコンテンツを閉じたり追加表示します。JavaScriptは使いません。

これは、コンテンツを制御するときに、Webサーバーにリクエストを送信しないので、Webページのパフォーマンスを上げることができます。

続きを読む

かんたんCSS, 言語別にスタイルを適用する(:lang疑似クラス)

css3 image

マルチ言語サイトで、同じスタイルをそれぞれ用意するのではなく、同じものを使いたいときがあります。でも、CSSに文字列を書いてある場合どうしたらいいのでしょうか?

CSSでは、サイトの言語別に分けてスタイルを適用させる方法があります。サンプルコードを使って、かんたんに誰でも分かるように解説します。

続きを読む