ホテル・結婚式場などのホームページがつくれるエレガントなデザインのテンプレート「CANON」

ワードプレステーマ別

TCDテーマGorgeous:スライダーのタイトル部分の背景カラーを変更する

WordPressテーマ「NULL」

TCD LABOはWordPressテーマ「NULL」を使用して作られています。

ダウンロード

Q.スライダーのタイトル部分の背景色を変更したい

トップページスライダーのタイトルが表示されている部分をデフォルトの黒い背景色から明るい背景色に変更したいです。

A.下記のcssファイルの該当箇所を編集します

編集するファイル:style_pc.css
編集する箇所:

#recommend_gallery .rs-caption {
    height:auto; padding:10px 20px; background:#000; color:#fff;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .8));
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .8));
    background: -o-linear-gradient(top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .8));
    background: -ms-linear-gradient(top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .8));
    background: linear-gradient(top, rgba(0, 0, 0, .7), rgba(0, 0, 0, .8));
    -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, .12) inset;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, .12) inset;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .12) inset;
}

上記のうち、「background」となっている箇所が背景色の設定です。
各種ブラウザに対応するために同内容の設定が5か所、また、僅かですがグラデーションをつけていますので、それぞれ2か所でカラーを指定しています。
更に、グラデーションに対応しない場合として「background:#000」という設定も加えております。
これらをすべてご変更ください。

この記事は役に立ちましたか?

もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!

同じテーマのカスタマイズ記事