wordpressの画像キャプションCSS | Digital×Social Lab

*

wordpressの画像キャプションCSS

キャプションを記入すると現れるキャプションだが、
何もない状態だと、いたくうざい。
そこで下記のようなCSSを使うとすっきりな感じとなる。

/* キャプション */
.wp-caption {
border: 1px solid #666666;
text-align: center;
background-color: #F8F8F8;
padding-top: 4px;
margin: 10px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}

.wp-caption img {
margin: 0;
padding: 0;
border: 0 none;
}

.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}

/* キャプションEND */

2012/02/11 | CSS

関連記事

html5jpg

HTML5対応などリセットCSSの紹介サイト

「リセットCSS」はブラウザごとで、文字サイズ等で表示に異なり、それら...

記事を読む

no image

wordpressレイアウトをCSS3のメディアクエリで機能的にする

ワードプレス3・3のデフォのテーマ「Twenty Eleven」がレス...

記事を読む

no image

wordpressの記事の画像回り込みCSS

やっぱり画像を使って文章を書きたいところ。 画像の配置は左で回り込みが...

記事を読む

新着記事

mi-main_large

見どころ満載アクションに興奮/映画『ミッション:インポッシブル ローグ・ネイション』

映画『ミッション:インポッシブル ローグ・ネイション』を鑑賞。飛行機ぶ...

記事を読む

jurajw_sub1new_large

お約束パニックも進化した映像で納得/映画『ジュラシック・ワールド』

映画『ジュラシック・ワールド』を鑑賞。進化した映像で恐竜の動きは素晴ら...

記事を読む

hero

いかにもな王道パターンに懐かしさ/映画『HERO』

映画『HERO』を鑑賞。良く言えば「HERO」らしい、悪く言えば予定調...

記事を読む

bake_large

ロスジブリを埋める夏のエンタメ大作/映画『バケモノの子』

映画『バケモノの子』を鑑賞。子供から大人まで楽しめる夏の大作を作る細田...

記事を読む

t_000_large

懐かし場面多いも、ストーリー大幅変更/映画『ターミネーター:新起動 ジェニシス』

映画『ターミネーター:新起動 ジェニシス』を鑑賞。前作のシーンを織り交...

記事を読む

コメント/トラックバック

トラックバック用URL:

コメントフィード




管理人にのみ公開されます

mi-main_large
見どころ満載アクションに興奮/映画『ミッション:インポッシブル ローグ・ネイション』

映画『ミッション:インポッシブル ローグ・ネイション』を鑑賞。飛行機ぶ...

jurajw_sub1new_large
お約束パニックも進化した映像で納得/映画『ジュラシック・ワールド』

映画『ジュラシック・ワールド』を鑑賞。進化した映像で恐竜の動きは素晴ら...

hero
いかにもな王道パターンに懐かしさ/映画『HERO』

映画『HERO』を鑑賞。良く言えば「HERO」らしい、悪く言えば予定調...

bake_large
ロスジブリを埋める夏のエンタメ大作/映画『バケモノの子』

映画『バケモノの子』を鑑賞。子供から大人まで楽しめる夏の大作を作る細田...

t_000_large
懐かし場面多いも、ストーリー大幅変更/映画『ターミネーター:新起動 ジェニシス』

映画『ターミネーター:新起動 ジェニシス』を鑑賞。前作のシーンを織り交...

→もっと見る

PAGE TOP ↑