重要なお知らせ

「教えて! goo」は2025年9月17日(水)をもちまして、サービスを終了いたします。詳細はこちら＞

電子書籍の厳選無料作品が豊富！

セルを透明に・・・

解決済

  • 質問者：master-3rd
  • 質問日時：
  • 回答数：8件

以下のような表があります。

<TABLE cellpadding="3" cellspacing="1" bgcolor="#666666">
<TBODY>
<TR>
<TD bgcolor="#ffffff">項目1</TD>
<TD bgcolor="#ffffff">内容1</TD>
</TR>
<TR>
<TD bgcolor="#ffffff">項目2</TD>
<TD bgcolor="#ffffff">内容2</TD>
</TR>
<TR>
<TD bgcolor="#ffffff">項目3</TD>
<TD bgcolor="#ffffff">内容3</TD>
</TR>
</TBODY>
</TABLE>

この状態で、壁紙を設定すると表の中は白でつぶれてしまいますよね。
これを表の中にも背景が出るようにすることは可能ですか?
style="filter:alpha(opacity=0)"をいろいろなところに当てはめてみたのですが、うまく出来ませんでした。
何か方法はありますか?よろしくお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (8件)

No.8ベストアンサー

  • 回答者： mousengoke
  • 回答日時：

No.3,No.5,No6のmousegokeです。



border-width:thin;
を
border-width:1px;

に変えてみてください。
    • good
    • 0
    • 件
通報する
この回答へのお礼

ありがとうございました。
ばっちり出来ました。
何度も何度もすみませんでした<(_ _)>

通報する
お礼日時：2003/12/19 19:19

No.7

  • 回答者： Bo_Bo
  • 回答日時：

質問の趣旨が、『セルを透明にする』事ではなくて、『テーブルの罫線を望


む色と形状にしたい』と理解しました。

※注意：字下げの為、全角の空白を使用

<style type="text/css">
<!--
table.flat {
　border-collapse: collapse;
　border: 1px solid #666666;
}
.flat th, .flat td {
　border-collapse: collapse;
　border: 1px solid #666666;
}
-->
</style>
　　　　：
　　　　：
<table class="flat" border="1">
<tbody>
<tr>
　<td>項目1</td>
　<td>内容1</td>
</tr>
<tr>
　<td>項目2</td>
　<td>内容2</td>
</tr>
<tr>
　<td>項目3</td>
　<td>内容3</td>
</tr>
</tbody>
</table>

上記の例では、灰色（#666666）で幅１pxの実線（solid）が罫線として描画
されます。
実線以外にも、以下のものがあります。
　inset, outset, groove, ridge, dashed, dotted, double
この方法だと、上下左右の罫線を個別に設定することも出来て、とても便利
です。

※私が動作確認したブラウザ
　IE 5以上
　Opera 7.x

これで役に立ちますか？
    • good
    • 0
    • 件
通報する
この回答へのお礼

ありがとうございました。
ばっちりなりました!

通報する
お礼日時：2003/12/19 19:19

No.6

  • 回答者： mousengoke
  • 回答日時：

No.3,No.5のmousegokeです。



それではスタイルタグの部分を

<STYLE type="text/css">
<!--
TABLE{
border-collapse:collapse;
}

TD,TH{
background-color:transparent;
}

TABLE,TD,TH{
border-style:solid;
border-color:#666666;
border-width:thin;
}
-->
</STYLE>

としてみてください。

この回答への補足

返答ありがとうございます。

おぉ!
かなりイメージと近くなってきました。
しかし、やはり罫線はちょっと太めですね。
1ピクセル(なのかな?)での罫線と言うのは無理なのでしょうか?
(現状では3ピクセル程度の罫線です)

補足日時：2003/12/19 16:48
通報する
    • good
    • 0
    • 件
通報する

No.5

  • 回答者： mousengoke
  • 回答日時：

No.3のmousegokeです。



もしかしたら#666666は罫線の色のつもりだったんですか?
では

<STYLE type="text/css">
<!--
TD,TH{
background-color:transparent;
}

table,td,th{
border-style:solid;
border-color:#666666;
-->
</STYLE>
</HEAD>
<BODY background="./back02.jpg">
<TABLE cellpadding="3" cellspacing="1">
<TBODY>
<TR>
<TD>項目1</TD>
<TD>内容1</TD>
</TR>
<TR>
<TD>項目2</TD>
<TD>内容2</TD>
</TR>
<TR>
<TD>項目3</TD>
<TD>内容3</TD>
</TR>
</TBODY>
</TABLE>

としてみてください。表に隙間が出来るのはcellspacing"1"を指定しているためだと思います。

この回答への補足

返答ありがとうございます。
なぜか太い罫線になるのですが…
しかも、大枠の中にセル枠が出来てます…(画像をアップできないのが残念です)

細い罫線の状態でセルのバックを抜きたいのですが…

よろしくお願いします。

補足日時：2003/12/19 15:08
通報する
    • good
    • 0
    • 件
通報する

No.4

bgcolor="#666666" をTABLEタグ内で指定せず、透明にしたくないセル単位(TR)で指定すれば良いっす。



#1でした。

この回答への補足

>bgcolor="#666666" をTABLEタグ内で指定せず
そうすると罫線が表示されないと思うのですが?

>透明にしたくないセル単位
全て透明にしたいのですが…

細い罫線のまま背景色を抜きたいのですが…

補足日時：2003/12/19 14:26
通報する
    • good
    • 0
    • 件
通報する

No.3

  • 回答者： mousengoke
  • 回答日時：

ヘッドタグの最後に



<style type="text/css">
<!--
td,th{
background-color:transparent;
}
-->
</style>

を入れてみてください。
もし一部のセルだけ透過したいのなら
そのセルを
<td class="backtoumei">
のようにclass属性を指定して
.backtoumei{
background-color:transparent;
}

にしてみてください。

この回答への補足

返答ありがとうございます。

--------------------------
</TITLE>
<STYLE type="text/css">
<!--
TD,TH{
background-color:transparent;
}
-->
</STYLE>
</HEAD>
<BODY background="./back02.jpg">
<TABLE cellpadding="3" cellspacing="1" bgcolor="#666666">
<TBODY>
<TR>
<TD bgcolor="#ffffff">項目1</TD>
<TD bgcolor="#ffffff">内容1</TD>
</TR>
<TR>
<TD bgcolor="#ffffff">項目2</TD>
<TD bgcolor="#ffffff">内容2</TD>
</TR>
<TR>
<TD bgcolor="#ffffff">項目3</TD>
<TD bgcolor="#ffffff">内容3</TD>
</TR>
</TBODY>
</TABLE>
</BODY>
--------------------------------
こういうことでしょうか?

残念ですが、だめでした。(やっぱり#666666で埋まるだけ)
他に方法がありますか?

補足日時：2003/12/19 14:17
通報する
    • good
    • 0
    • 件
通報する

No.2

  • 回答者： 78tch
  • 回答日時：

bgcolor="#666666"　をやめて


border=1 border=1 bordercolor="#666666"　では？
ちょっと違うか・・・
ボーダーをやめて、#666666色の細い画像を交互に埋め込むとか。

この回答への補足

>border=1 border=1 bordercolor="#666666"　では？
こうすると、太線になるんですよね。

>ボーダーをやめて、#666666色の細い画像を交互に
いわゆる
-----------------
<TABLE border="0" cellpadding="0">
<TBODY>
<TR>
<TD rowspan="7" bgcolor="#666666"></TD>
<TD colspan="3" bgcolor="#666666"></TD>
<TD rowspan="7" bgcolor="#666666"></TD>
</TR>
<TR>
<TD>項目1</TD>
<TD bgcolor="#666666"></TD>
<TD>内容1</TD>
</TR>
<TR>
<TD colspan="3" bgcolor="#666666"></TD>
</TR>
<TR>
<TD>項目2</TD>
<TD bgcolor="#666666"></TD>
<TD>内容2</TD>
</TR>
<TR>
<TD colspan="3" bgcolor="#666666"></TD>
</TR>
<TR>
<TD>項目3</TD>
<TD bgcolor="#666666"></TD>
<TD>内容3</TD>
</TR>
<TR>
<TD colspan="3" bgcolor="#666666"></TD>
</TR>
</TBODY>
</TABLE>
------------------
こういうことでしょうか?
ちょっと美しくないようなw

補足日時：2003/12/19 14:23
通報する
    • good
    • 0
    • 件
通報する

No.1

bgcolor="#ffffff" の指定を外せばOKっす。

この回答への補足

返答ありがとうございます。

>bgcolor="#ffffff" の指定を外せばOKっす。
それだけだと、実際やってもらえればすぐわかると思うのですが、単に#666666で塗りつぶされてしまうだけですけど…

補足日時：2003/12/19 12:26
通報する
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報