skillup

技術ブログ

UI

CSSで背景画像の出力 ~透過編~

投稿日:2016年3月7日 更新日:

前回CSSで大きな背景画像のなかにhtmlを置く方法をメモしたんですが、背景画像を透過させたいときなどのメモを書いておきます。

一般的に画像の透過といえばCSSでopacity:0.6とかやれば簡単なんですが、背景画像には少し工夫がいります。

通常のCSSのほかに背景画像だけに用意したCSSが必要になってきます。

参考リンク

Transparent Background Images

CSS Background Opacity [duplicate]

-UI
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

検索ページの遷移に関して

検索ページの遷移に関してメモ。 基礎だが実際全部完全に網羅できているかというと不安な部分が多い。 Contents1 基本仕様: 以下のようなページ構成を想定2 想定しないといけない遷移状態3 よくあ …

no image

固定されたナビ(ヘッドとサイド)

boostrapでサイトを作るときにヘッダーとサイドバーを固定したいときについてメモします。 Contents1 ヘッダーを固定したい場合2 サイドバーを固定したい場合3 参考リンク ヘッダーを固定し …

no image

オートコンプリートのプラグイン

最近だとフォームの入力画面で最初の数文字を入力すると候補を予測して表示してくれる機能(=オートコンプリート)があることが一般的ですね。 いろいろなプラグインがありますが、今回お勧めしたいのはBoots …

no image

jQuery modalダイアログについて&重複時間処理

Contents1 jqueryモーダルダイアログ1.1 あらかじめ読み込むライブラリ1.2 ソース本体1.2.1 Html側1.2.2 Javascript側1.2.3 参考リンク2 重複時間につい …

no image

cakePHPのSSL設定+jQueryのError Loading Page

cakeで作ったアプリの認証画面でhttps環境だとError Loading Pageというエラーメッセージがでてしまい、ログインできないという事象が発生。 最初はSSLが原因かとおもっていたんです …