skillup

技術ブログ

UI

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

投稿日:

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

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

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

参考リンク

https://css-tricks.com/snippets/css/transparent-background-images/

http://stackoverflow.com/questions/10422949/css-background-opacity

 

-UI

執筆者:


comment

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

関連記事

no image

cakePHP+bootstrapでのページャー

cakePHP+bootstrapでページャーのリンクを下記のように出力したいときのメモを。 ソース コントローラーのほうでは特に設定する必要なはく、HTMLのほうで下記のように設定すればOKです。 …

no image

cakePHPのSSL設定+jQueryのError Loading Page

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

no image

timepickerについて

日付を入力するときに直接、文字入力するのがメンドイことからカレンダーが表示されるプラグインを使っている人は多いでしょう。 私も日頃Datepickerというライブラリを使っています。が、このプラグイン …

no image

ソフトウェアデザインの目的

本日からのお勉強のお題は、UIの設計などについて。 参考図書:デザイニングインターフェイス Contents1 ソフトウェアとは目的達成の手段である2 ユーザー調査の基礎3 ユーザーの学習意欲・リテラ …

no image

情報アーキテクチャの分類

今回は情報の分類に関して。 ようはソフトウェア上に情報をどのように配置するかということについてです。 参考書では情報を大きく4つに分けています。 Contents1 オブジェクトのリスト2 アクション …