🔧 つくった人がそのまま売っています 会員登録なし・買い切り・サブスクなし
かご
おみせのトップ棚をみる / CSSの切れはし集 60
SN-0002 切れはし 棚にあります

CSSの切れはし集 60

「見出しの下に線」「表をスマホで横に送る」「印刷でメニューを消す」——毎回書き直すものを60本、1本ずつ独立したファイルにしてあります。外観 > 追加CSS に貼るだけです。

切れはしを当てたところ(群ごとに1本ずつ・9本ぶん)
切れはしを当てたところ(群ごとに1本ずつ・9本ぶん)

画像をクリックすると、幅いっぱいに大きく開きます。
いずれも WordPress 標準のテーマ(Twenty Twenty-Five)で撮っています。特別なテーマは使っていません。

こんなことがなくなります

  • 1本ずつ分かれています。大きな1枚から必要なところを探して切り出す作業が要りません。
  • どのファイルにも「何をするか・直すところ・気をつけること」が頭に書いてあります。貼る前に、どこを直せばいいか分かります。
  • 色は先頭にまとめてあります。--c を1つ直せば全体の色が変わります。
  • !important を使っていません。効かないときの直しかたも書いてあります。あとから上書きできなくなる書き方をしていません。
  • どれも .entry-content から始めています。範囲を絞らずに書くと、サイドバーの見出しやフッターまで飾られます。
  • 画像もWebフォントも読み込みません。外への通信は1バイトもありません。

入っているもの

  • CSSファイル60本(10の群に分けてあります)
  • 一覧.md(探すためのもくじ)
  • はじめに.md(貼る場所・.entry-content の調べかた・色の直しかた)

こまかい話(仕様)

型番SN-0002
種類コードの切れはし
本数60本(見出し・本文・表・ボタン・囲み・箇条書き・画像・フォーム・並べる・印刷 の各6本)
貼る場所外観 > カスタマイズ > 追加CSS
入れるものありません。プラグインではありません
JavaScriptなし
外部への通信なし(画像もWebフォントも読み込みません)
<code>!important</code>使っていません
直すところ各ファイルの頭に書いてあります
WordPress6.0 以上(6.8 で確認)
PHP8.0 以上
ほかのプラグインいりません
つかっていい範囲1つ買ったら1サイト/書き換えOK/再配布はNG(くわしく

この部品についての質問

貼ったのに効きません

2つ考えられます。1つは .entry-content がテーマと違うこと(.post-content などの場合があります。調べかたは はじめに.md に)。もう1つはテーマ側の指定が強いことで、そのときはセレクタを1つ増やす(body .entry-content h2)と通ります。

なぜ <code>!important</code> を使っていないのですか?

あとから上書きできなくなるためです。1本使うぶんには楽ですが、60本ぜんぶに付いていると、直したいときに全部と喧嘩することになります。

SN-0001(functions.php 部品集)との違いは?

あちらは動きを足すPHP、こちらは見た目を整えるCSSです。貼る場所も違います(あちらは functions.php かプラグイン、こちらは追加CSS)。並べて使えます。

テーマを変えたら消えますか?

追加CSSはテーマごとに保存されるので、テーマを変えると引き継がれません。貼ったものは手元に残しておいてください(このファイル一式がその控えになります)。

全部貼っても大丈夫ですか?

やめてください。「はみ出しを見つける」は確認用で、公開したままにするものではありません。要るものだけ選んで貼ってください。

一緒に使うと

一緒に使うとはかどる部品

PT-0101 プラグイン

見出しのデザイン12種

h2〜h4の見た目を選ぶだけ。CSSだけなので、記事の中身はいじりません。合わなければ消すだけで元に戻ります。

  • CSSのみ
  • JavaScriptなし
  • 依存なし
¥1,480 くわしく
SN-0001 切れはし

functions.php 部品集 60

毎回ググるやつを60本。1ファイルずつ、functions.php に貼っても、そのままプラグインとして置いても動きます。

  • 60本
  • 両方の置きかた
  • 解説つき
¥1,000 くわしく
PT-0103 プラグイン

比較表

行と列を書くだけで比較表。スマホでは1列目を残したまま横に送れます。○×は読み上げにも言葉で伝えます。

  • 1列目が残る
  • 読み上げ対応
  • 依存なし
¥2,980 くわしく