【逆引き】WordPressテーマカスタマイズでよく使うCSSプロパティWordPressテーマのカスタマイズ

記事を書くときに、ちょっとだけ飾りをつけたい。
とんなときによく使うCSSのプロパティをご紹介します。

逆引きになっているので、やりたいことで調べてコピペしてみてくださいね。

セレクタ(要素){
プロパティ:値;
}

文字の色を変えたい

#fffffの部分を変えると色が変わります。

デザインソフトを持ってなくても、色コードを調べられる?
Color Hex Color Codeを使うと調べられます。

背景色を変えたい

#000000の部分を変えると色が変わります。

背景画像を変えたい

wordpressのメディアから画像をアップロードし、画像のURLをコピー&ペーストしてください。

背景画像の繰り返しは「no-repeat(繰り返しなし)」「repeat(繰り返し)」「repeat-x(X軸のみ繰り返し)」「repeat-y(Y軸のみ繰り返し)」の4種類から選ぶことができます。
横位置の配置は、left center rightから、縦位置の配置は、top center bottomから選ぶことができます。

文字のサイズを変えたい

remは、サイズの単位です。
センチメートル、インチ、ヤードのように、単位が複数有ります。

単位
px 絶対サイズ指定
pt 画面のサイズに対する文字サイズ(1pt=1/72インチ)ちょっと使いづらい。
em 親要素の文字サイズに対する1文字分(デフォルト:1em=16px)
rem html(ルート要素)の文字サイズに対するパーセンテージ(デフォルト:100%=1文字分=16px)
% 親要素の文字サイズに対するパーセンテージ(デフォルト:100%=1文字分=16px)

文字の太さを変えたい

太字にするなら「bold」

太字になっているものを標準の太さに戻すなら「normal」

文字のスタイルを変えたい

斜体にしたいときはfont-style:italic;

下線を引きたいときはtext-decoration:underbar;

マーカー状のデザインにしたい場合は、background:(背景)に、グラデーションを指定します。

文字にドロップシャドウをつけたい

ブロック要素にドロップシャドウをつけたい

ブロック要素とは、箱状になっているタグのことをいいます。
殆どのタグがブロック要素です。

水平方向の位置、垂直方向の位置、ぼかしの距離、ぼかしの広がり、色指定
の順で指定されています。
ボックスの内側に影を付けたい場合は、insetをつけます。

ブロック要素以外のタグのことをインライン要素と言います。
例)span、strong、など文中で使うタグです。

要素の内側の余白を変えたい

上下左右に10px

上下10px、左右15px

上10px、右5px、下20px、左5px
上から時計回りに指定します。

要素の外側の余白を変えたい

要素の配置を変えたい

フロートタグと呼ばれるもの。
段組や回り込みをする方法は、フロート、テーブルセル、
float:left;
float:right;
float:none;

ブロック要素内の配置を変えたい

text-align:left;
text-align:center;
text-align:right;

WordPressではじめるWEBの仕組みづくり7日間メール講座

オトナ女子にピッタリ!ブログ運営に集中できるWordPressテーマプレゼント
  • 「@luelue.com」というドメインからメールが届きます。あらかじめフォルダ分け設定を行って頂きますようお願い致します。
      Yahoo、hotmailなどのフリーメールアドレスでは受信できない場合がありますので、プロバイダーメールアドレスを推奨いたします。
  • メールアドレスは個人情報の観点より、プライバシーを遵守しております。
  • 本メール講座及びメールマガジンは利益の保証や損失の補填を行うものではなく、効果には個人差があります。
  • いつでも解除可能です。

Pickup Article同じカテゴリーの記事

ブログ一覧へ戻る