鍋・フライパンあれこれ美味
100万ポイント山分け!1日5回検索で1ポイントもらえる
>>
人気記事ランキング
ブログを作成
楽天市場
11791073
ホーム
|
日記
|
プロフィール
【フォローする】
【ログイン】
大人の楽天生活 スローライフを楽しむ情報Blog楽天生活です
テーブルに背景画像&フィルター加工
INDEX
FILTER
FONT
TEBLE
MARQUEE
日記
消す
無料
style
その他
テーブルにフィルター処理&背景画像入れ
テーブルに背景画像(壁紙)を入れフィルター加工すると言う少し高度な小技です。
1,普通のテーブル枠は非表示です。
意味わからない人
テーブル1に戻る
ここに文字
2,左の物のセルに背景画像を入れたテーブル。
画像の大きさに合わせて幅と高さを変えてあります
こちらはリピートさせないタグはついていませんので見本のような画像の場合画像とテーブルの大きさを合わせる必要があります
ここに文字
1のソース
<TABLE height="200" width="200" bgcolor="#0099cc"><TBODY><TR>
<TD align="center">
<CENTER><FONT color="#ff0033">ここに文字</FONT></CENTER>
</TD>
</TR></TBODY></TABLE>
<FONT color="#ff0033">
というのが文字色です
好きに変えてください。
2のソース
<TABLE height="190" width="210" bgcolor="#0099cc"><TBODY><TR>
<TD background="
http://plaza.rakuten.co.jp/img/user/96/59/3359659/104.jpg
">
<CENTER><FONT color="#ff0033">ここに文字</FONT></CENTER>
</TD>
</TR></TBODY></TABLE>
<FONT color="#ff0033">というのが文字色です
3,テーブルにFILTER: ALPHA(STYLE=3)
わからない人
フィルターで透過処理へ
ここに文字
4,テーブルにFILTER: ALPHA(STYLE=3)に背景画像
こちらは画像をリピートさせないタグが入っています。
壁紙で良く使うようなこまかい画像は不向きです。
ここに文字
3のHTMLソース
<TABLE style="FILTER: ALPHA(STYLE=3); color=#ff0033" height="200" width="200" bgcolor="#0099cc"><TBODY><TR><TD>
<CENTER>ここに文字</CENTER>
</TD></TR></TBODY></TABLE>
color=#ff0033
というのが文字色です
style
がよくわからない人はこちら
4のHTMLソース
<TABLE style="FILTER: ALPHA(STYLE=3); color: #ff0033; width: 210; height: 190; background: url(
http://plaza.rakuten.co.jp/img/user/96/59/3359659/104.jpg
) no-repeat center" bgcolor="#0099cc">
<TBODY>
<TR>
<TD>
<CENTER>ここに文字</CENTER>
</TD>
</TR>
</TBODY>
</TABLE>
5,テーブルにFILTER: ALPHA(STYLE=2)
わからない人
フィルターで透過処理へ
ここに文字
6,テーブルにFILTER: ALPHA(STYLE=2)に背景画像
ここに文字
5のHTMLソース
<TABLE style="FILTER: ALPHA(STYLE=2); color=#ff0033" height="200" width="200" bgcolor="#0099cc">
<TBODY>
<TR>
<TD>
<CENTER>ここに文字</CENTER>
</TD>
</TR>
</TBODY>
</TABLE>
6のHTMLソース
<TABLE style="FILTER: ALPHA(STYLE=2); color: #ff0033; width: 210; height: 190; background: url(
http://plaza.rakuten.co.jp/img/user/96/59/3359659/104.jpg
)
no-repeat center" bgcolor="#0099cc">
<TBODY>
<TR>
<TD>
<CENTER>ここに文字</CENTER>
</TD>
</TR>
</TBODY>
</TABLE>
7,テーブルにfilter:Alpha(opacity=50) 50を変えることで透過率が変わります。
わからない人
フィルターで透過処理へ
ここに文字
8,filter:Alpha(opacity=50) に背景画像
ここに文字
<TABLE style="filter:Alpha(opacity=50); color=#ff0033" height="200" width="200" bgcolor="#0099cc">
<TBODY>
<TR>
<TD>
<CENTER>ここに文字</CENTER>
</TD>
</TR>
</TBODY>
</TABLE>
<TABLE style="filter:Alpha(opacity=50); color: #ff0033; width: 210; height: 190; background: url(
http://plaza.rakuten.co.jp/img/user/96/59/3359659/104.jpg
) no-repeat center" bgcolor="#0099cc">
<TBODY>
<TR>
<TD>
<CENTER>ここに文字</CENTER>
</TD>
</TR>
</TBODY>
</TABLE>
楽天生活
│
らくらくショッピングガイド
│
らくらくコピペ
│
楽天サーフィン
│
みゅうちゃん
│
You Big
│
気ままな生活
│
アフィリエイトの始めかた
│
初めての方
│
楽天市場案内2
│
楽天市場案内
│
プロフィール
│
LINK
│
DIARY
│
BBS
キャラコレ生活
|
麺めん生活
当サイトのどのページもリンクはフリーです
コピペ用HTMLソース、テンプレートの使用もすべてOKですが、
そのまま二次配布、加工しての二次配布はご容赦願います。
Copyright (C) 楽天生活 2003-2004 All Rights Reserved
ジャンル別一覧
出産・子育て
ファッション
美容・コスメ
健康・ダイエット
生活・インテリア
料理・食べ物
ドリンク・お酒
ペット
趣味・ゲーム
映画・TV
音楽
読書・コミック
旅行・海外情報
園芸
スポーツ
アウトドア・釣り
車・バイク
パソコン・家電
そのほか
すべてのジャンル
人気のクチコミテーマ
アイフォン・アイポッドの必需品
iPhone16pro 購入
(2024-10-20 21:02:57)
ブログ更新しました♪
11月27日 記事更新致しました。
(2024-11-27 21:22:44)
パソコンニュース&情報
【テレビPC+リモート会議】ディスプ…
(2024-11-25 12:13:17)
© Rakuten Group, Inc.
X
共有
Facebook
Twitter
Google +
LinkedIn
Email
Design
a Mobile Site
スマートフォン版を閲覧
|
PC版を閲覧
人気ブログランキングへ
無料自動相互リンク
にほんブログ村 女磨き
LOHAS風なアイテム・グッズ
みんなが注目のトレンド情報とは・・・?
So-netトレンドブログ
Livedoor Blog a
Livedoor Blog b
Livedoor Blog c
楽天ブログ
JUGEMブログ
Excitブログ
Seesaaブログ
Seesaaブログ
Googleブログ
なにこれオシャレ?トレンドアイテム情報
みんなの通販市場
無料のオファーでコツコツ稼ぐ方法
無料オファーのアフィリエイトで稼げるASP
ホーム
Hsc
人気ブログランキングへ
その他
Share by: