• ベストアンサー

bgcolorとbackground-color

タグ打ちで、bgcolorとbackground-colorは一緒ですか?? 一緒として話しを進めます。 <table> <tr><td bgcolor="#e1e1e1"></td></tr> <tr><td bgcolor="#d1d1d1"></td></tr> </table> なら、セルの色を変更出来ましたが、 <table> <tr><td background-color="#e1e1e1"></td></tr> <tr><td background-color="#d1d1d1"></td></tr> </table> だと、セルの色を変更できません。 なぜですか?? bgcolorとbackground-colorは違うのですか??使う場所がそれぞれ決まっているとか?? 気になってます。教えて下さい。

noname#20877
noname#20877

質問者が選んだベストアンサー

  • ベストアンサー
  • php504
  • ベストアンサー率42% (926/2160)
回答No.2

スタイルシートで指定する場合は <table> <tr><td style="background-color:#e1e1e1">あああ</td></tr> <tr><td style="background-color:#d1d1d1">いいい</td></tr> </table> ですね

noname#20877
質問者

お礼

そんな方法もあるのですか~。知りませんでした。 とても参考になりましたm(__)m

その他の回答 (1)

  • Trick--o--
  • ベストアンサー率20% (413/2034)
回答No.1

background-colorはスタイルシートで使われるプロパティです。 bgcolorは幾つかのHTMLタグがもつ属性です。 これらは動作こそ似ていますが、全く違うものです。

noname#20877
質問者

お礼

background-colorはスタイルシートonlyなのですね! 疑問が解決しました。ご回答ありがとうございました。

関連するQ&A

  • table のバックグラウンドカラー

    background-color は継承されないものだと認識しております。 ・HTML内容 <html> <head> <meta http-equiv="content-type" content="text/html;charset=UTF-8"> <title>検証</title> </head> <table border="1" background="red"> <tr> <th>授業内容</th> <th>講義</th> </tr> <tr> <td>1時間目</td> <td>国語</td> </tr> <tr> <td>2時間目</td> <td>数学</td> </tr> <tr> <td>3時間目</td> <td>英語</td> </tr> <tr> <td>4時間目</td> <td>科学</td> </tr> </table> </body> </html> ====ここまで==== ボタンを押す。⇒setStyleが動く⇒tableの背景が赤色で塗られる。動作までは分かるのですが、 td、thの部分の背景まで赤色になっています。 これは、テーブルと言う枠に、赤色が塗られ、その上にtd、thが置かれる。 結果、td、thの背景赤色は (1)「td、thのbackgroundは指定していないため、デフォルトのtransparentが有効で、 テーブルの背景赤色が透けて見えている」 (2)「td、thに、tableのbackgroundが継承されて、赤く塗りつぶされていないということ」 の考えに間違いがないか確認させて頂きたいのです。 ご教授お願いします。

    • ベストアンサー
    • CSS
  • htmlを使って表を作っています

    自分でつくった表だとどうしてかうまくいきません。何がいけないのでしょうか?わからないところをまた自分で見つけて修正するのでポイントとソースを書いていただけませんか? 練習問題と自分が作ったソース載せます。 <html> <h4><b>1問<b></h4> <table border="1"width="400"height="400"> <tr><td background="1_4.jpg"width="200">1_4.jpg</td><td></td></tr> </table> <table border="1"width="400"height="400"> <tr><td>aaaa</td><td>aaaa</td></tr> </table> <h4><b>2問<b></h4> <table border="1"width="50"height="50"> <tr bgcolor="#ff0000"><td></tr></td> </table> <h4><b>3問<b></h4> <table border="1"width="150"height="100"> <tr bgcolor="#0000ff"><td></td><td></td><td></td></tr></table> <table border="1"width="150"height="100"> <tr colspan="3"><td></tr> <tr><td width="50"></td></tr> <tr><td width="50"></td></tr> <tr><td width="50"></td> </tr> </table> <h4><b>4問<b></h4> <table border="1"width="100"height="100"> <tr><td bgcolor="#00ff00"></td><td></td></tr></table> <table border="1"width="100"height="100"> <tr><td></td><td></td></tr></table> </html> 課題1_7-2 覚えるタグ ・<td background="★">~</td> ★には画像ファイル名(URL)を入れます。 <td>タグのbackground属性でセルの背景に画像を 貼り込むことができます。 画像の大きさがセルよりも小さい場合は繰り返して タイル状に並べられます。 それでは早速つくってみましょう。 <第一問:幅400、高さ400、上のセルの数が2つ、下のセルの数が2つの テーブルを作り、左上のセルに1_4.jpgを背景に貼り込んでみましょう。> どうですか?うまく表示されましたか? レイアウトをしていく上で大切なタグになっていくので頑張って作ってみましょう。 背景に指定できるのは画像だけではありません。 文字のように、色を指定することもできます。 覚えるタグ ・<table bgcolor="★">~</table> ・<tr bgcolor="★">~</tr> ・<td bgcolor="★">~</td> ★には色指定値(例:#ff0000)が入ります。 bgcolor属性でテーブルの背景色を設定します。 <table>タグに指定した場合はそのテーブル全体に、 <tr>タグに指定した場合はその横一列(一行)に色がつきます。 <td>タグに指定した場合はそのセルにのみ色がつきます。 それでは実際に作ってみましょう。 <第二問:幅50、高さ50、1つのセルのテーブル全体の背景を赤くしてみましょう。      赤→#ff0000> <第三問:幅150、高さ100、上のセルを3つ、下のセルを3つのテーブルを作り、      上3つのセルの背景を青くしてみましょう。      青→#0000ff> <第四問:幅100、高さ100、上のセルを2つ、下のセルを2つのテーブルを作り、      左上のセルの背景を緑にしてみましょう。      緑→自分で見つけて下さい>

  • color 属性が追加できない

    <html><meta><script language="javascript"><!-- tr = document.createElement("tr"); tr.setAttribute("bgcolor", "black"); td = tr.appendChild(document.createElement("td")); td.appendChild(document.createTextNode("test")); tbody1.appendChild(tr); //--></script></head><body> <table><tbody id="tbody1"></tbody></table> </body></html> というソースなのですが,実行してもセルの背景が黒く塗りつぶされません。 setAttribute("width", "100px")などはきちんと適用されるのですが・・・。 setAttribute("style", "background-color: black;")としてもダメでした。 どのようにすればよいのでしょうか。 よろしくお願いします。

  • ヤフオクのテンプレートでバックグラウンドを使いたい

    今、オークション用のテンプレートを作ってるのですが、テーブルの背景に、 <table width="900" height="1000" border="0" cellspacing="0" cellpadding="0" background="http://000.com/000.png"> と言った感じで画像を背景に配置したいと考えていますが、どうやってもうまくいきません。 プレビュー表示の段階で、ソースコードを見てみたのですが、ちゃんと設定されているにもかかわらず、背景画像だけが表示されません。 別の方法で、 <div style="background-image:url(http://www.000.com/000.png);"> でも試して見ましたが、同じ結果でした。 背景画像の上に「商品説明」などの画像を重ねて配置したいので、どうにか上手くできる方法がありましたら是非教えて下さい。 ※上に重ねる画像だけが表示されます。 参考までに今編集中のソースを貼っておきます。 <center> <table width="900" height="1000" border="0" cellspacing="0" cellpadding="0" background="http://000.com/000.png"> <tr> <td align="center" valign="top"><br /> <center> <table width="650" border="0" cellspacing="0" cellpadding="0"> <tr> <td><img src="http://000.com/001.png"></td> </tr> </table> <table width="650" border="0" cellspacing="0" cellpadding="5"> <tr> <td><font color="#a00e15"><p align="left"> 商品説明 </p></font></td> </tr> </table> <br /> <br /> <br /> <table width="650" border="0" cellspacing="0" cellpadding="0"> <tr> <td><img src="http://000.com/002.png"></td> </tr> </table> <table width="650" border="0" cellspacing="0" cellpadding="5"> <tr> <td><font color="#a00e15"><p align="left"> 発送方法 </tr> </table> <br /> <br /> <br /> <table width="650" border="0" cellspacing="0" cellpadding="0"> <tr> <td><img src="http://000.com/003.png"></td> </tr> </table> <table width="650" border="0" cellspacing="0" cellpadding="5"> <tr> <td><font color="#a00e15"><p align="left"> お支払い方法 </p></font></td> </tr> </table> <br /> <br /> <br /> <table width="650" border="0" cellspacing="0" cellpadding="0"> <tr> <td><img src="http://000.com/004.png"></td> </tr> </table> <table width="650" border="0" cellspacing="0" cellpadding="5"> <tr> <td><font color="#a00e15"><p align="left"> 注意事項 </p></font></td> </tr> </table></td> </tr> </table> </center>

  • IE互換表示で見ると色が全然違う!!

    ホームページのカスタマイズで、カレンダーを貼りました。 IEの互換表示で見てみると、2色だけ、全く色が違って見えます。 私はIE10で、互換表示でIE9はOKでIE7,8がダメでした。(6はわかりません) セーフカラーとかそういった原因なのかな?と一瞬思ったのですが 2色の内1色は、ページのいろんなところで使っていて、そこは大丈夫なのに カレンダーの部分だけ色が変わってます。 以下の、 #E0DFE3(薄いグレー)が、鮮やかな黄色になります。 #F0F0E0(薄いベージュ)が、鮮やかな赤になります。(他の場所で使ってるこの色は、ちゃんと薄いベージュで表示されてます) 少々の違いなら、そこまでのこだわりはないですが、赤と黄色はあんまりです。 何が原因でしょうか・・・ 以下に貼ってます。 <table border="0" cellpadding="2" cellspacing="1" bgcolor="#E0DFE3 " width="150"> <tr align="center" bgcolor="#FFFFFF"> <td colspan="7">2013年5月</td> </tr> <tr align="center" bgcolor="#F0F0E0 "> <td>日</td> <td>月</td> <td>火</td> <td>水</td> <td>木</td> <td>金</td> <td>土</td> </tr> <tr align="center" bgcolor="#FFFFFF"> <td></td> <td></td> <td></td> <td>1</td> <td>2</td> <td bgcolor="#ef6e5d">3</td> <td bgcolor="#ef6e5d">4</td> </tr> <tr align="center" bgcolor="#FFFFFF"> <td bgcolor="#ef6e5d">5</td> <td bgcolor="#ef6e5d">6</td> <td>7</td> <td>8</td> <td>9</td> <td>10</td> <td bgcolor="#ef6e5d">11</td> </tr> <tr align="center" bgcolor="#FFFFFF"> <td bgcolor="#ef6e5d">12</td> <td>13</td> <td>14</td> <td>15</td> <td>16</td> <td>17</td> <td bgcolor="#ef6e5d">18</td> </tr> <tr align="center" bgcolor="#FFFFFF"> <td bgcolor="#ef6e5d">19</td> <td>20</td> <td>21</td> <td>22</td> <td>23</td> <td>24</td> <td bgcolor="#ef6e5d">25</td> </tr> <tr align="center" bgcolor="#FFFFFF"> <td bgcolor="#ef6e5d">26</td> <td>27</td> <td>28</td> <td>29</td> <td>30</td> <td>31</td> <td></td> </tr> </table>

    • ベストアンサー
    • CSS
  • 楽天オークション HTMLエラー

    楽天オークション商品説明文の欄にHTMLを挿入した結果「PC用説明文欄に認められていないHTMLタグ、または「<」「>」が入力されています。各入力項目ごとの利用可能なHTMLタグをご確認ください。」というエラーが出ました。 どなたか解決方法をお教えください。 <div align="center"> <table width="695" cellpadding="1px" cellspacing="1px" bgcolor="#187353"> <tr> <td align="center"><font color="#ffffff" size="+1"><strong>商品データ</strong></font></td> </tr> </table> <table width="700" cellpadding="5px" cellspacing="3px"> <tr> <td width="270" bgcolor="#30AA8E"><font color="#ffffff" size="-1"><strong>■ 参考価格</strong></font></td> <td width="270" bgcolor="#30AA8E"><font color="#ffffff" size="-1"><strong>■ 販売価格</strong></font></td> </tr> <tr> <td width="270" bgcolor="#EFEFEF"><font color="#231815" size="-1">29,800円</font></td> <td width="270" bgcolor="#EFEFEF"><font color="#231815" size="-1">24,500円</font></td> </tr> <tr> <td width="270" bgcolor="#30AA8E"><font color="#ffffff" size="-1"><strong>■ ランク</strong></font></td> <td width="270" bgcolor="#30AA8E"><font color="#ffffff" size="-1"><strong>■ 型番</strong></font></td> </tr> <tr> <td width="270" bgcolor="#EFEFEF"><font color="#231815" size="-1">N(新品・未使用品)</font></td> <td width="270" bgcolor="#EFEFEF"><font color="#231815" size="-1">J1234</font></td> </tr> <tr> <td width="270" bgcolor="#30AA8E"><font color="#ffffff" size="-1"><strong>■ 色</strong></font></td> <td width="270" bgcolor="#30AA8E"><font color="#ffffff" size="-1"><strong>■ サイズ</strong></font></td> </tr> <tr> <td width="270" bgcolor="#EFEFEF"><font color="#231815" size="-1">BLACK</font></td> <td width="270" bgcolor="#EFEFEF"><font color="#231815" size="-1">縦30cm 横10cm</font></td> </tr> <tr> <td width="270" bgcolor="#30AA8E"><font color="#ffffff" size="-1"><strong>■ 素材</strong></font></td> <td width="270" bgcolor="#30AA8E"><font color="#ffffff" size="-1"><strong>■ 付属品</strong></font></td> </tr> <tr> <td width="270" bgcolor="#EFEFEF"><font color="#231815" size="-1">レザー</font></td> <td width="270" bgcolor="#EFEFEF"><font color="#231815" size="-1">なし</font></td> </tr> <tr> <td colspan="2" bgcolor="#30AA8E"><font color="#ffffff" size="-1"><strong>■ コメント</strong></font></td> </tr> <tr> <td colspan="2" bgcolor="#EFEFEF"><font color="#231815" size="-1">小さなシミ(変色目立つ)小傷若干(角擦れ目立つが破れなし)</font></td> </tr> </table> </div> 宜しくお願い致します。

  • スタイルシートは直接指定より優先されるのでしょうか?

    一行ずつグレー、白としたいのですが、 スタイルシートは直接指定より優先されてしまうでしょうか? .tr{ background-color : #FFFFFF; } <table> <tr> <td> 白 </td> </tr> <tr> <td bgcolor="glay"> グレーくならない </td> </tr> </table> いままで使っていなかったtbodyタグでスタイルシートの背景色を指定していますが、スタイルシートを使う限りこの方法しかないでしょうか?

    • ベストアンサー
    • HTML
  • background-color css

    目的:社員のスケジュール表を作りたいです。 出勤、休み、緊急休みを一目瞭然に表で表現したいですが、そのやり方が分からないです、ご存知の方々教えてお願いします。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "?http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="?http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-31j" /> <title>表</title> <style> <!-- .open{ background-color:rgb(255,255,255); } .holiday{ background-color:rgb(166,166,166); } .rest_holiday{ position:relative; filter:alpha(opacity=50); background-color:rgb(255,0,0); } .rev{ background-color:rgb(185,205,229); } --> </style> </head> <body> <table border="1" cellspacing="1"> <tr> <td valign="top"> <table border="1" cellspacing="0" width="60" > <tr align="center"> <td height="23" >名前</td> </tr> <tr align="center"> <td ></td> </tr> <tr align="center"><td>田中</td></tr> <tr align="center"><td>島村</td></tr> <tr align="center"><td>喜田村</td></tr> <tr align="center"><td>林義夫</td></tr> </table> </td> <td valign="top" > <table width="00" cellpadding="0" cellspacing="0" border="1"> <tr align="center"> <td width="100" height="23" colspan="2" >10時</td> <td width="100" height="23" colspan="2">11時</td> <td width="100" height="23" colspan="2" >12時</td> </tr> <tr > <td width="25" height="23" valign="top" class="open">&nbsp;</td> <td width="25" height="23" valign="top" class="open">&nbsp;</td> <td width="25" height="23" valign="top" class="rest_holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="rest_holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="rest_holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="rest_holiday">&nbsp;</td> </tr> <tr > <td width="25" height="23" valign="top" class="holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="holiday">&nbsp;</td> </tr> <tr > <td width="25" height="23" valign="top" class="rev">&nbsp;</td> <td width="25" height="23" valign="top" class="rev">&nbsp;</td> <td width="25" height="23" valign="top" class="open">&nbsp;</td> <td width="25" height="23" valign="top" class="rev">&nbsp;</td> <td width="25" height="23" valign="top" class="rev">&nbsp;</td> <td width="25" height="23" valign="top" class="open">&nbsp;</td> </tr> <tr > <td width="25" height="23" valign="top" class="rest_holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="rest_holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="rest_holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="rest_holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="rest_holiday">&nbsp;</td> <td width="25" height="23" valign="top" class="rev">&nbsp;</td> </tr> </table> </td> </tr> </table> </td> </tr> </table> </body> </html>

  • tableセルに色を付ける

     tableセルに色を付けます。  で、行で指定しようとtrタグにbgcolorをいれました。  ネスケでは問題ないのですが、ie6だとテーブルの外にも色がついてしまい変です。  セルを結合させたりしたりしてることが影響あるのでしょうか?ieのバグですかね?  コレを解決するには、trで色を付けるのを諦めて、セルごと(tdやth)に指定していくしかないのでしょうか。  スタイルシートは使わない前提です。htmlだけでの解決があったら教えてください。 <html> <head> </head> <body> <table border="10" align="center"> <tr> <th colspan="2">タイトル</th> </tr> <tr> <td height="70" rowspan="2" align="center" valign="top">1</td>  <td>あ</td> </tr> <tr>  <td>い</td> </tr> <tr bgcolor="red">  <td>2</td>  <td>う</td> </tr> </table> </body> </html>

    • ベストアンサー
    • HTML
  • テーブルの幅の下限を設定したい。

    http://tv.www.infoseek.co.jp/ 上記のテレビ番組表のように、最大化した場合は均等にテーブルを拡大し ウィンドウを縮小していった場合、一定幅以下にしないようにしたいです。 その場合、どのタグにどのようなCSS文章を書き込めばよいのでしょうか? いろいろ試してみたのですがうまくいかないのでご質問します。 <TABLE style="height:50px;width:100%;background-color:gray;"> <TR> <TD bgcolor="#cccccc"></TD> <TD bgcolor="#cccccc"></TD> <TD bgcolor="#cccccc"></TD> </TR> </TABLE>