人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

HTMLでbackground-imageの上に画像ファイルを半透明にして、重ねる方法はありませんか?言葉足らずですみません。もしかしてCSSかjavascriptを使うかもしれません。
サンプルソースでわかるHPがあれば助かるのですが…

●質問者: Manami2005
●カテゴリ:コンピュータ
✍キーワード:background-image CSS JavaScript サンプルソース ファイル
○ 状態 :終了
└ 回答数 : 3/3件

▽最新の回答へ

1 ● キチョー id:Kityo
●20ポイント

http://www.hatena.ne.jp/1115404883#

人力検索はてな

回答を入力している最中に「キャンセル」されてしまいました。

それはさておき…。

http://www.netpassport.or.jp/~wkityo/

キチョーのWebページ

最初から半透明な画像ファイルを用意すれば良いのでは?…と思います。

上記URLは私のWebページです。

「#00AFAF」色のbgcolorの上に四角くない画像が浮かんでいますが、これは「透過gif」ファイルです。

実際には四角い画像ファイルなのですが、周りの部分を「透明」にして雲形っぽく見せています。

http://popup.tok2.com/home/ksa/wp/clear_2.html

壁紙 - 半透明

普通の画像に「透明」色のメッシュをかければ、メッシュが充分に細かければ、人間の目には半透明に見えると思います。

ちょうど、上記URLに見本がありました。

http://paintshoppro.jp/support/psp9/tutorial/06/image04.html

具体的に半透明に見える透過gifファイルの作り方のHowToみたいなページがありました。

Paint Shoをお持ちなら、この辺りを試してみては?

http://computers.yahoo.co.jp/download/vector/all.html

yahoo!コンピュータ - ソフトウエアダウンロード

私なら、このくらいのヒントがあれば、素朴な単機能なそしてありがたいことに無料又はそれに近いようなツールを2つくらい探し出して組み合わせて使うと思います。

◎質問者からの返答

やはり、私の説明がへただったようです。すいません。


2 ● kawai0000
●20ポイント

http://www.tagindex.com/stylesheet/filter/alpha.html

スタイルシート[CSS]/フィルタ/半透明のグラデーションをかける - TAG index

使い方↓

<img src=”*.png” style=”filter:Alpha(opacity=30)”>

◎質問者からの返答

やはりスタイルシートでしたか…


3 ● kinop
●20ポイント

http://fc2.com/

FC2 無料ホームページ アクセス解析 ブログ レンタルサーバー 等

URLダミーです。

レイヤー挿入機能を使い、画像も、透明度を50%くらいにして、書式をPNGにすると出来るのじゃないかと思います。

◎質問者からの返答

なるほど。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ