• 締切済み

background-color　ｃｓｓ

目的：社員のスケジュール表を作りたいです。 出勤、休み、緊急休みを一目瞭然に表で表現したいですが、そのやり方が分からないです、ご存知の方々教えてお願いします。 <!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>

画像を拡大する
  • HTML
  • 回答数3
  • ありがとう数4

みんなの回答

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.3

【訂正】 ＞　また、透過色という方法はありませんが、特定の要素の背景に透過GIFで、背景色の上に重ねることは【不可能】です。もしくは、単純に重ねたような色をつけるしかありません。 は 　また、透過色という方法はありませんが、特定の要素の背景に透過GIFで、背景色の上に重ねることは【可能】です。もしくは、単純に重ねたような色をつけるしかありません。 ＞単純に重ねたような色をつけるしかありません。 　背景色をサンプルを作られたように変えるだけ

beishan
質問者

お礼

ありがとうございました。 画像が使いたくないので、やっぱり思った通りには行かないだね。 複雑なると自分の能力外となるので、まず単純でスタートしようと思って、今度の件が一度締めきります。

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.2

　問題が解決しないまま回答を締め切ると、利用者が迷ってしまいます。必要なときは、改めて質問をしてから、そのページへのリンクを記入してください。 　拝見するソースでは、スタイルシートをはずしたとき、まったく意味を成さない表になってしまうので、携帯端末や読み上げブラウザは無論、スタイルシートを解除するとまったく意味不明になります。 　また、透過色という方法はありませんが、特定の要素の背景に透過GIFで、背景色の上に重ねることは不可能です。もしくは、単純に重ねたような色をつけるしかありません。 　結果的に、ある情報の入ったデータを色分けして表を作るには、XML+XSLTの組み合わせが一番良い方法ではあります。【後述】 　さて、この場合HTMLを作成すると、勤務表部分は正しく作ると下記のようなものになると思います。 ★tableの横(行)は必ず関連したものであること(tableの入れ子はまずい。　 　他と区別させるために、必要ならスタイルシートで指定する。 ★表示させる、させないはスタイルシートで行う。 　スタイルシートがなくても読み取れること 　セル内が空、ないし空白文字だけは禁止(空白を表示するかしないかはスタイルシートで) 　これができれば、あとは簡単ですね。・・・時間が取れたときに、スタイルシート(CSS)は作成します。 <table> <tr> <th>氏名1</th> <td><span class="open">休み</span></td> <td><span class="open">休み</span></td> <td><span class="rest"><del>勤務</del><ins>休み</ins></span></td> <td><span class="rest"><del>勤務</del><ins>休み</ins></span></td> <td><span class="rest"><del>勤務</del><ins>休み</ins></span></td> <td><span class="rest"><del>勤務</del><ins>休み</ins></span></td> </tr> <tr > <th>氏名2</th> <td><span class="open">休み</span></td> <td><span class="open">休み</span></td> <td><span class="open">休み</span></td> <td><span class="open">休み</span></td> <td><span class="open">休み</span></td> <td><span class="open">休み</span></td> <td><span class="open">休み</span></td> </tr> <tr > <th>氏名3</th> <td><span class="rev">予定</span></td> <td><span class="rev">予定</span></td> <td><span class="open">休み</span></td> <td><span class="rev">予定</span></td> <td><span class="rev">予定</span></td> <td><span class="open">休み</span></td> </tr> <tr > <th>氏名4</th> <td><span class="rest"><del>予定</del><ins>休み</ins></td> <td><span class="rest"><del>予定</del><ins>休み</ins></td> <td><span class="rest"><del>予定</del><ins>休み</ins></td> <td><span class="rest"><del>予定</del><ins>休み</ins></td> <td><span class="rest"><del>予定</del><ins>休み</ins></td> <td><span class="rev">予定</span></td> </tr> </table> 【XMLから】　たとえば、次のような簡単なXMLを作成し、XSLTによってHTML煮変換する。時間が取れたときにスタイルシート(XSLT)は作成します。CSSは前のものを使う予定。 <?xml version="1.0" encoding="UTF-8"?> <?xml-stylesheet type="text/xsl" href="./works.xsl"?> <worksTable> <works> <name>田中</name> <am timeFrom="1000">出</am timeFrom="1000"><am timeFrom="1030">出</am timeFrom="1030"> <am timeFrom="1100">出・休</am timeFrom="1100"><am timeFrom="1130">出・休</am timeFrom="1130"> <am timeFrom="1200">出・休</am timeFrom="1200"><am timeFrom="1230">出・休</am timeFrom="1230"> <am timeFrom="1300">出・休</am timeFrom="1300"><am timeFrom="1330">出・休</am timeFrom="1330"> <am timeFrom="1400">出・休</am timeFrom="1400"><am timeFrom="1430">出・休</am timeFrom="1430"> <am timeFrom="1500">出</am timeFrom="1500"><am timeFrom="1530">出</am timeFrom="1530"> </works> <works> <name>島村</name> <am timeFrom="1000">休</am timeFrom="1000"><am timeFrom="1030">休</am timeFrom="1030"> <am timeFrom="1100">休</am timeFrom="1100"><am timeFrom="1130">休</am timeFrom="1130"> <am timeFrom="1200">休</am timeFrom="1200"><am timeFrom="1230">休</am timeFrom="1230"> <am timeFrom="1300">休</am timeFrom="1300"><am timeFrom="1330">休</am timeFrom="1330"> <am timeFrom="1400">休</am timeFrom="1400"><am timeFrom="1430">休</am timeFrom="1430"> <am timeFrom="1500">休</am timeFrom="1500"><am timeFrom="1530">休</am timeFrom="1530"> </works> <works> <name>喜田村</name> <am timeFrom="1000">予</am timeFrom="1000"><am timeFrom="1030">予</am timeFrom="1030"> <am timeFrom="1100">出</am timeFrom="1100"><am timeFrom="1130">出</am timeFrom="1130"> <am timeFrom="1200">予</am timeFrom="1200"><am timeFrom="1230">予</am timeFrom="1230"> <am timeFrom="1300">予</am timeFrom="1300"><am timeFrom="1330">予</am timeFrom="1330"> <am timeFrom="1400">出</am timeFrom="1400"><am timeFrom="1430">出</am timeFrom="1430"> <am timeFrom="1500">予</am timeFrom="1500"><am timeFrom="1530">予</am timeFrom="1530"> </works> <works> <name>林義夫</name> <am timeFrom="1000">予・休</am timeFrom="1000"><am timeFrom="1030">予・休</am timeFrom="1030"> <am timeFrom="1100">予・休</am timeFrom="1100"><am timeFrom="1130">予・休</am timeFrom="1130"> <am timeFrom="1200">出・休</am timeFrom="1200"><am timeFrom="1230">出・休</am timeFrom="1230"> <am timeFrom="1300">出・休</am timeFrom="1300"><am timeFrom="1330">出・休</am timeFrom="1330"> <am timeFrom="1400">予・休</am timeFrom="1400"><am timeFrom="1430">予・休</am timeFrom="1430"> <am timeFrom="1500">休</am timeFrom="1500"><am timeFrom="1530">休</am timeFrom="1530"> </works> </worksTable>

beishan
質問者

お礼

遅くまで時間をかけて教えてくれてありがとうございました。 結果としてはなるべく添付画像のような感じになりたいですが、文字での表現ではない、xsltのやり方が全くわかりません、本当に初心者の初心者です。 ”＞単純に重ねたような色をつけるしかありません。”というのはどのような表現なのかな、もしまた時間があったら、また教えてお願いします。

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

このソース自体はどうやって作成するつもりなのでしょうか？ CGIとかPHPで出力？ 人間的な感覚としては、上から被せるというのはわからないでもないですが、必ずしもその通りの処理をする必要はないのでは？ 元のデータがどこかにあるのでしょうから、緊急休みの処理（←これもなんらかのソフトを利用するのですよね？）するときに、予定が入っていなかったらクラスをrest_holidayとし、予定があったらrev_holiday（←仮に追加）とでもするようにしておいて、 rest_holidayもrev_holidayも他のクラスと同様にbackground-colorを設定しておけば良いだけでは？ もちろん、rev_holidayには重なったときのような色合いを設定しておきます。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. HTML

関連するQ&A

  • テーブルにCSSの枠のつけ方

    はじめまして、こんにちわ。 HTMLで組んだテーブルにCSSの枠をつけたいと思っています。 ここのページ​http://www.rakuten.ne.jp/gold/royalparty/​ の『NEW ITEMS』みたいに1列4行に枠をつけたい場合はどうしたら良いのでしょうか。よろしくお願いいたします。 組んだテーブルは下です。 <table class="newtable" cellspacing="0" cellpadding="0" border="0" width="610"> <tbody> <tr> <td class="photo" valign="middle" align="center" width="138"> 1-1 </a> </td> <td class="tdspace" valign="top" align="left" width="5" rowspan="3"> </td> <td class="photo" valign="middle" align="center" width="138"> 1-2 </a> </td> <td class="tdspace" valign="top" align="left" width="5" rowspan="3"> </td> <td class="photo" valign="middle" align="center" width="138"> 1-3 </a> </td> <td class="tdspace" valign="top" align="left" width="5" rowspan="3"> </td> <td class="photo" valign="middle" align="center" width="138"> 1-4</a></td> </tr> <tr> <td valign="top" align="left" width="138"> 2-1</a> </td> <td valign="top" align="left" width="138"> 2-2</a> </td> <td valign="top" align="left" width="138"> 2-3 </a> </td> <td valign="top" align="left" width="138"> 2-4</a> </td> </tr> <tr> <td valign="top" align="left" width="138">3-1</td> <td valign="top" align="left" width="138">3-2</td> <td valign="top" align="left" width="138">3-3</td> <td valign="top" align="left" width="138">3-4</td> </tr> </tbody> </table>

    • ベストアンサー
    • HTML
  • CSS　セルごとリンクにする際、リンク文字を上下中央寄せにしたい

    セルごとリンクにしたくて、以下の記述をしました。 【CSS】 ------------------------------------------------------------------ a.widelink{ vertical-align:middle; display:block; // display:inline-block; width: 100%; height:100%; // line-height:100%; color: #000000; text-decoration:none } a.widelink:hover{ vertical-align: middle; color: #000000; background-color: #9999FF; text-decoration:none } td.bgchng{ align: center; vertical-align: middle; color: #000000; margin: 0px; padding: 0px; } td.bgchng:hover{ vertical-align: middle; color: #000000; background-color: #9999FF; margin: 0px; padding: 0px; } ------------------------------------------------------------------ 【HTML】 ------------------------------------------------------------------ <TABLE border="1" bordercolor="#6666CC" cellspacing="0"> <TR> <TD width="150" height="60" valign="middle" align="center" CLASS="bgchng"> <A href="test01.html" CLASS="widelink"> テスト<BR>（その１） </A> </TD> <TD width="450" bgcolor=""> &nbsp;テスト（その１）の説明文<BR> &nbsp;二行目 </TD> </TR> <TR> <TD width="150" height="60" valign="middle" align="center" CLASS="bgchng"> <A href="test02.html" CLASS="widelink"> テスト（その２） </A> </TD> <TD width="450" bgcolor=""> &nbsp;テスト（その２）の説明文<BR> &nbsp;二行目<BR> &nbsp;三行目 </TD> </TR> <TR> <TD width="150" height="60" valign="middle" align="center" CLASS="bgchng"> <A href="test03.html" CLASS="widelink"> テスト（その３） </A> </TD> <TD width="450" bgcolor=""> &nbsp;テスト（その３）の説明文<BR> &nbsp;二行目 </TD> </TR> </TABLE> ------------------------------------------------------------------ この記述だとリンク文字がセルのTOPに来てしまい、中央寄せになりません。 思いつく限りの場所にvertical-alignやvalignを仕込んでみましたがダメでした。 line-heightであわせる方法もやってみましたが、<BR>を含むリンク文字の表示が二行揃ってくれず、ダメでした。 セル自体をリンクにして、さらにリンク文字を上下中央寄せにしたいのですが、やり方をご存知の方、教えてください。

  • 同じ<table align="center">を用いていますが、セルの中身の行揃えが代わってしまいます。

    どちらも<table align="center">を用いています。 ですが、タグ１は特にセルの位置を指定せずとも、セルの中身が自動的に左詰めになりますが タグ２のセルの中身は、中央ぞろえになってしまいます。 タグ１のように、<table align="center">を用い、セルを左詰め指定（<align="left">）をせずとも なぜセルの中身が左詰めになるのか分かりません。。。 -------------タグ１------------- <table width="600" border="0" align="center" cellpadding="0" cellspacing="5"> <tr> <td width="10"><img src="img/concept_title.gif" width="10" height="30"></td> <td><img src="img/concept_title01.gif" alt="テキスト" width="127" height="16"></td> </tr> <tr> <td width="10">&nbsp;</td> <td class="t01">テキスト</td> </tr> </table> ------------------------------ -------------タグ２------------- <table width="640" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="3" rowspan="2" valign="top"><img src="image/grade_line.gif" width="3" height="177" /></td> <td width="8" valign="bottom"><img src="image/grade_line30.gif" width="20" height="2" /></td> <td width="368"><img src="image/kisyo/01t.gif" width="368" height="32" /></td> <td align="left" valign="bottom"><img src="image/grade_line_right.gif" width="42" height="2" /></td> </tr> <tr> <td>&nbsp;</td> <td height="145" align="left">テキスト <td rowspan="2"><img src="image/kisyo/01_ph.jpg" alt="井戸" width="200" height="139" /></td> </tr> <tr> <td valign="top"><img src="image/grade_line_bottom02.gif" /></td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> </table> ------------------------------ 初心者的な質問・タグで恐れ入りますが、ご助力頂けますと幸いです。 宜しくお願い致します。

    • ベストアンサー
    • HTML
  • Firefoxで崩れる

    IE6.0　IE7.0では、問題なく表示されるのですが、Firefoxで 一部のページが右にずれてしまうのです。 問題点を教えていただけますと幸いです。 正常なページのソース <!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=utf-8" /> <title>XXXXXXXXXXXXXXXXXXXXXサイト</title> <META HTTP-EQUIV="Imagetoolbar" CONTENT="no"> <link href="../common/base.css" rel="stylesheet" type="text/css" /> </head> <body> <a name="top" id="top"></a> <table width="758" border="0" cellpadding="0" cellspacing="0" class="table-base"> <tr> <td height="95" colspan="2"><table width="758" cellspacing="0" cellpadding="0"> <tr> <td width="213" rowspan="4"><a href="../index.html"><img src="../common/images/rogo.jpg" width="213" height="93" border="0" /></a></td> <td height="38">&nbsp;</td> </tr> </table></td> </tr> <tr> <td height="31" colspan="2"><img src="images/" alt="blog" width="758" height="31" border="0" /></td> </tr> <tr> <td height="21" colspan="2" class="td-bar">&nbsp;</td> </tr> <tr> <td width="556" height="111" valign="top"><table width="543" height="182" cellpadding="10" cellspacing="0" class="td-0e3758"> <tr> <td colspan="2" class="bottom-border0e3758"><strong>200X/XX/XX</strong></td> </tr> <tr> <td width="94" height="131"><img src="images/s_img.jpg" width="94" height="125" /></td> <td width="407" valign="top">テテキストテキスト</td> </tr> </table></td> ***************************** 崩れてしまう方 <!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=utf-8" /> <title>XXXXXXXXXX</title> <link href="../common/base.css" rel="stylesheet" type="text/css" /> </head> <body> <a name="top" id="top"></a> <table width="758" border="0" cellpadding="0" cellspacing="0" class="table-base"> <tr> <td width="758" height="95"><table width="758" cellspacing="0" cellpadding="0"> <tr> <td rowspan="4"><a href="../index.html"><img src="../common/" width="213" height="93" border="0" /></a></td> <td height="38">&nbsp;</td> </tr> </table></td> </tr> <tr> <td height="31" colspan="2" class="td-bar"><img src="images/blog-.gif" alt="blog" width="758" height="31" border="0" /></td> </tr> <tr> <td align="center"><table width="725" cellspacing="0" cellpadding="7"> <tr> <td colspan="2">&nbsp;</td> </tr> <tr> <td width="37" align="right"><img src="../common/images/arrow.gif" width="8" height="9" /></td> <td width="658" align="left" class="text-ffffff"><span class="text-71b8ff">2007.00.00</span>　　XXXXXXXXXXX</td> </tr> <tr> <td align="right"><img src="../common/images/arrow.gif" width="8" height="9" /></td> <td align="left" class="text-ffffff"><span class="text-71b8ff">2007.00.00</span>　　XXXXXXXX</td> </tr> <tr> <td align="right"><img src="../common/images/arrow.gif" width="8" height="9" /></td> <td align="left" class="text-ffffff"><span class="text-71b8ff">2007.00.00</span>　　XXXXXXXXXXXXXXXXXXXXXXX</td> </tr>

  • tableでレイアウトが崩れる場合

    技術の足りなさからCSSにできなかったので、再度テーブルでサイズを指定してやってみようとしているところです。 どこかの数字がおかしくなっていると思うのですが、どうしてもわかりません。 ちゃんと表示できるブラウザとそうでないブラウザがあり、Firefoxは環境設定により表示が崩れる場合があります。 使用ソフトはビルダーの１１です。 なんでも良いのでどうぞアドバイスをよろしくお願い致します。 <body> <div ALIGN="center"> <table> <tbody> <tr> <td CLASS="td4" HEIGHT="70"> <table WIDTH="600" CELLSPACING="1" CELLPADDING="0"> <tbody> <tr> <td VALIGN="top" CLASS="td1" WIDTH="400" ALIGN="left" HEIGHT="180"> <b>文字 <textarea ROWS="15" COLS="70">文字</textarea><br> <br> </td> <td VALIGN="top" CLASS="td1" WIDTH="100" HEIGHT="180"> <table CELLSPACING="0" CELLPADDING="4"> <tbody> <tr> <td CLASS="td2" HEIGHT="16" WIDTH="100">文字</td> </tr> </tbody> </table> 文字 <br> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> <br> </div> </body>

    • ベストアンサー
    • HTML
  • IEでのテーブル幅

    質問させて下さい。 テーブルのソースが以下のようになっています。 <table width="450" height="300" border="1" cellpadding="10" cellspacing="0" bordercolor="#333333"> <tr> <td width="225" height="150" align="left" valign="top">あああああああああああああああああああああああ</td> <td width="225" height="300" rowspan="2" background="haikei.jpg">&nbsp;</td> </tr> <tr> <td width="225" height="150" align="left" valign="top">いいいいいいいいいいいいいいいいいいいいいい</td> </tr> </table> このときに、ファイアーフォックス3での表示と、IE8での表示に 違いが大きいんです。（IEの表示の方が縦が長くなります） このままだと右側の背景画像の高さと左のテキストの高さが あいません・・・それぞれのテーブル幅などの指定はきちんと しているつもりなのですが、どうすれば良いのでしょう。 CSSの利用はなしとして、どなたか教えて頂けないでしょうか。

    • ベストアンサー
    • HTML
  • テーブル内でのランダムな並べ変え

    全然知識がないのですがよろしくお願いします。 タグで <table border="0"> <tr> <td colspan="3" width="100%" bgcolor="#FF1493"><font color="#ffffff">&nbsp;&nbsp;◆タイトル</font></td> </tr><tr><td width="100" height="100"><img src="画像.jpg" width="100" height="100" border="0"></td> <td colspan="2" width="380" height="100" valign="top" align="left" bgcolor="#F8E0F7">文書</td> </tr> <tr> <td colspan="3" width="100%" bgcolor="#FF1493"><font color="#ffffff">&nbsp;&nbsp;◆タイトル</font></td> </tr><tr><td width="100" height="100"><img src="画像.jpg" width="100" height="100" border="0"></td> <td colspan="2" width="380" height="100" valign="top" align="left" bgcolor="#F8E0F7">文書</td> </tr> <tr> <td colspan="3" width="100%" bgcolor="#FF1493"><font color="#ffffff">&nbsp;&nbsp;◆タイトル</font></td> </tr><tr><td width="100" height="100"><img src="画像.jpg" width="100" height="100" border="0"></td> <td colspan="2" width="380" height="100" valign="top" align="left" bgcolor="#F8E0F7">文書</td> </tr> </table> このようなテーブルがあって、その順番をページ更新でタイトル・画像・文書を一枠としてクルクルランダムに入れかえたいのですが、どうしたらいいでしようか？ 今後、この一枠がドンドン増えて行って、それも含めて全ての枠をランダムに入れ替えたいのです。 jqueryで簡単にできるようなことは聞きましたが、私には知識がないので助けてください。 よろしくお願いします。 http://www.finefinefine.jp/web/kiji2068/ ここを見れとも言われたのですが、スクリプトは私には不明です・・・

  • IE セル間に隙間が・・・

    HTML初心者です。 テーブルでHPをレイアウトしたいのですが、--1と--3のセル間に微妙な隙間ができてしまいます。NNでは問題なく表示されます。通常どの様なことが原因するのでしょうか？よろしくお願いいたします。 <td width="396" height="234"valign="top"><table width="100%" height="234" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="180" rowspan="2" valign="bottom" >1 <img src="../image/***" width="180" height="180" align="bottom"></td> ------1 <td width="216" height="98" valign="bottom">***</td> </tr> <tr> <td height="136" valign="bottom" ><img src="../image/*** width="91" height="61" border="1"><br>></td> </tr> </table></td> <td width="10" rowspan="3" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td height="262"></td>　　　　　　　　------３ <td valign="top" >*** <br> </td>

    • ベストアンサー
    • HTML
  • 初めてCSSをデザインに取り入れたらレイアウトが崩れてしまいました・・。

    dreamweaverMX2004を使用しているホームページ作成初心者です。 スクロールバーが付いているテキストボックス（更新画面用）の下に文字なり画像なりを入れると、なぜかだいぶん間が空いて表示されてしまいます。テキストボックスの高さを400くらいの大きな数字を指定すると間はなくなるのですが、どうしても高さ200～250くらいに指定したいんです…。 参考になるかも知れないので、コードを貼り付けておきます。 以前、教えてgooで同じような質問があって、そのときにどなたかが、 http://cssbug.at.infoseek.co.jp/detail/winie/b053.html を紹介していたので、もしかしたらこの状態なんでしょうか？あるいは、決定的なミスをしているのでしょうか？ どなたかご存じの方、いらっしゃったら、どうぞお願いいたします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>無題ドキュメント</title> <style type="text/css"> <!-- .style1 { color: #000000; font-size: 12px; } .style2 {font-size: 12px} .style4 {color: #000099; font-weight: bold; } --> </style> </head> <body> <style type="text/css"><!-- html, body { scrollbar-base-color: #D5D0F7; } --></style> <table width="800" border="0" cellpadding="0" cellspacing="0"> <!--DWLayoutTable--> <tr> <td width="279" height="357">&nbsp;</td> <td colspan="2" valign="top"><style type="text/css"> <!-- .memo { width: 470px; height: 220px; overflow: auto; } --> </style> <div class="memo style1"> <p align="left" class="style1 style2">&nbsp; </p> <p align="left"><span class="style4">2008年1月4日更新</span><br> あけましておめでとうございます。<br> </p> <p align="left" class="style1 style2">&nbsp;</p> <p align="left" class="style1 style2">&nbsp;</p> <p align="left" class="style1 style2">&nbsp;</p> <p align="left" class="style1 style2">&nbsp;</p> <p align="left" class="style1 style2">&nbsp;</p> <p align="left" class="style1 style2">&nbsp;</p> <p align="left" class="style1 style2">&nbsp;</p> <p align="left" class="style1 style2">&nbsp;</p> <p align="left" class="style1 style2">あけましておめでとうございます。<br> </p> </div></td> </tr> <tr> <td height="43"></td> <td width="248" valign="top">pppp</td> <td width="273">&nbsp;</td> </tr> </table> <br> </body> </html>

  • 表（table）の字の大きさの設定

    ブログに表を載せたいと思って調べているところなのですが、↓のようにして、入力すると、字が１４くらいの大きさになってしまいます。９くらいの小さめの字にしたいのですが、字の大きさは、どのように入力すれば良いのでしょうか？教えて下さい。どうぞ宜しくお願い致します。 <div align="center"> <table border=1><tr><tdalign="center"colspan="3"bgcolor="#99ee66">あ<BR>あ</td></tr><tr><td align="center" colspan="3"bgcolor="#ffcd59">あ</td></tr><tr><td width="30" align="left" valign="top" bgcolor="#efefde">あ</td><td width="45" align="left" valign="top" bgcolor="#efefde">あ</td><td align="left">・あ<BR>あ</td></tr><td width="30" align="left" valign="top" bgcolor="#efefde">あ</td><td width="45" align="left" valign="top" bgcolor="#efefde">あ</td><td align="left">あ</td></tr></table></div>

    • ベストアンサー
    • HTML

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する