- ベストアンサー
tableの記述方法について
よろしくお願いします。 以下のような表を作成しました。 <table> <tr> <th>イベント案内</th> </tr> <tr> <th>春</th> <td>お散歩しよう</td> </tr> 上記の<td>お散歩しよう</td>のセルの中に画像を入れたいのですが こういった場合はどのような記述をすれば良いのでしょうか？ 画像の下にお散歩しようの文字が中央に来るようにしたいと思っております。どなた様かご指導の程よろしくお願いします。
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
その他の回答 (3)
関連するQ&A
- Tableの記述兵方法について、質問をさせて頂きます。よろしくお願いし
Tableの記述兵方法について、質問をさせて頂きます。よろしくお願いします。 まず、以下のようなtableを作成しました。 <table border="1"summary="お知らせ"> <tr> <th><img src="img/aaa.gif" alt="画像1" width="199" height="64" /></th> <td><img src="img/bbb.gif" alt="画像2" width="547" height="60" /></td> </tr> <tr> <th><img src="img/ccc.gif" alt="画像3" width="199" height="364" /></th> <td><img src="img/ddd.gif" alt="画像4" width="547" height="60" /></td> </tr> </table> よろしければ、画像を拝見してみてください。 画像1と画像2は問題無いのですが、次の画像3と画像4を入れると、画像3のheightが364に設定しているために画像2と画像4の間に隙間が出来てしまいます。 このような場合は、隙間を無くしたいのですが、このような場合はどのようにすれば良いものでしょうか？ 画像4の<td>に右記のclass名を付けて、<td class="1"> cssにtd.1{padding-top:-30px;}としてみたところ、画像3のthまで上がってしまいます。 全く分からずに困っております。 どなた様か、ご指導の程よろしくお願い致します。
- ベストアンサー
- HTML
- テーブルを壊さない方法を
知れたいのですが教えてください <table> <tr><th>a</th><th>b</th><th>c</th><th>d</th></tr> <tr><td>A</td><td>B</td><td>C</td><td>D</td></tr> </table> a,b,c,d,A,B,C,Dの部分が少し長いだけでセル内で折り返されてしまいます 折り返されない方法を教えてください
- ベストアンサー
- HTML
- HTMLのテーブルについて
HTMLのテーブルについて 今、HTMLを勉強しています。下記のようにテーブルを作成し一部にセルの結合を行ったところ、(2)の結合したセル右端から外枠までが広がってしまいます。せっかく綺麗に見えるように上の表と下の表のセル幅を合わせても、上の表の右端が出っ張ってしまって意味がありません。 これを解決するにはどのように改善すればいいのでしょうか？ <html> <head> <title>A</title> </head> <body> <table border="2"> <tr> <th>No.</th> <th>名前</th> <th width="50">備考</th> </tr> <tr> <td>１</td> <td>Ａ君</td> <td>(1)</td> </tr> <tr> <td>１</td> <td>Ｂ君</td> <td rowspan="2">(2)</td> </tr> <tr> <td>１</td> <td>Ｃ君</td> <td></td> </tr> </table> <br> <table border="2"> <tr> <th>No.</th> <th>名前</th> <th width="50">備考</th> </tr> <tr> <td>２</td> <td>Ｄ君</td> <td>(3)</td> </tr> <tr> <td>２</td> <td>Ｅ君</td> <td>(4)</td> </tr> <tr> <td>２</td> <td>Ｆ君</td> <td>(5)</td> </tr> </table> </body> </html>
- ベストアンサー
- その他（インターネット・Webサービス）
- TABLE内でのwidth指定
<table> <tr><th colspan="3">●</th></tr> <tr><td class="1">■</td> <td class="2">▲</td> <td class="3">★</td></tr> <tr><th colspan="3">○</th></tr> <tr><td class="1">□</td> <td class="2">△</td> <td class="3">☆</td></tr> </table> このサンプルについて考えています。 ●○が、割と長い文字列になります。 この時、例えば2段目の左の列が、■,□のうち長い方の文字列に合わせて「width」が表示されるためには、スタイル「class="1"」の内容をどう記述すれば良いのでしょうか。 デフォルトの「width:auto」では、●○の長さに引っ張られてしまい、余分なスペースが出来てしまいます。 2段目の中の列（▲△部分）が短文を記述するセルなので、●○に合わせる必要のあるスペースは、全てここで吸収してしまいたいのです。 同じ仕組みで幾つかテーブルを組みますので、【class="1"】のwidthにpx,%等といった値自体を指定するのは向いていません。 ご指導おねがいします。
- ベストアンサー
- HTML
- テーブルの料金表の複雑な記述方法
練習でメニュー表作成をしているのですが、ややこしくてわかりません。。 やりたいことは、サービス内容と料金、ストレート、パーマ、トリートメントの色を同じに変更したいです。 ストレート、パーマ、トリートメントのところは右サイドの大人のところも料金も含めて色を変更したいです。 値段のところにclassを設定したから、縦には全部色を変えれるのですが、横にとなるとわかりません。 どのように記述すればよいでしょうか？ <table width="558" style="position: relative; top: -506px; left: 240px;"> <thead> <tr> <th rowspan="2" colspan="2"> サービス内容 </th> <th width="99" height="29" colspan="3"> 料金 </th> </tr> </thead> <tbody> <tr> </tr> <tr> <th width="165" rowspan="3"> カット </th> <td class="white" width="270"> 大人（一般） </td> <td class="price"> \4,200 </td> </tr> <tr> <td class="white"> 中学・高校生 </td> <td class="price"> \3,000 </td> </tr> <tr> <td class="white"> 小学生以下 </td> <td class="price"> \2,500 </td> </tr> <tr> <th> ストレート </th> <td class="white"> 縮毛矯正（カット・ブロー込） </td> <td class="price"> \8,600 </td> </tr> <tr> <th> パーマ </th> <td class="white"> カット・ブロー込 </td> <td class="price"> \5,200 </td> </tr> <tr> <th> カラー </th> <td class="white"> ファッションカラー </td> <td class="price"> \4,500 </td> </tr> <tr> <th rowspan="2"> トリートメント </th> <td class="white"> スペシャルプラチナ </td> <td class="price"> \2,300 </td> </tr> <tr> <td class="white"> スペシャルイオン </td> <td class="price"> \4,100 </td> </tr> </tbody> </table>
- ベストアンサー
- ホームページ作成ソフト
- tableタグについて
質問させてください。 今<table>を用いて表を作成しています。 <table> <tr> <th>タイトル</th> </tr> <tr> <td>ダイナマイト</td> </tr> </table> なんて表を作成するときに "タイトル"や"ダイナマイト"の表示される文字を もう少し小さくしたいのですがどうすればよろしいでしょうか？ お願いいたします。
- ベストアンサー
- HTML
- cssでテーブルの位置を設定するには？
<table border="1" align="left">でテーブルの位置を競ってすることはできたのですが スタイルシートで行いたいです。 そもそも他のテーブルはすべて中央に寄せたいため、 table { margin-left: auto; margin-right: auto; } としています。 そのうえで、任意のテーブルのみ左に寄せて表示したいので table.test { align:left; } としたのですが、うまくいきません。 ---------------------------------------------------------- <html> <head> <title>test</title> <STYLE type="text/css"> table { margin-left: auto; margin-right: auto; width: 40%; } table.test { width: 80%; align:left; } </STYLE> </head> <body> <table border="1"> <tr><th>見出</th><th>見出</th></tr> <tr><td>セル</td><td>セル</td></tr> </table> <br><br><br> <table border="1" align="left"> <tr><th>見出</th><th>見出</th></tr> <tr><td>セル</td><td>セル</td></tr> </table> <br><br><br> <table border="1" class="test"> <tr><th>見出</th><th>見出</th></tr> <tr><td>セル</td><td>セル</td></tr> </table> </body> </html> ----------------------------------------------------- このコードだと、 table.test { width: 80%; align:left; } の、 width: 80%; の部分は認識されるようですが、align:left;は無視されます。 スタイルシートでテーブルの位置を設定する方法をご教授ください。
- 締切済み
- CSS
- テーブルの背景を変える
js(外部ファイル)から呼び寄せる方法で１段目と３段目のセルが赤、２段目と４段目のセルが青にする方法 分かりやすくいいますと、奇数が赤、偶数が青になる 方法を教えてもらいたいです。 <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> </head> <body> <table border="1"> <col span="6" width="85" align="center"> <th>ID</th> <th >NO</th> <th >Name</th> <th >身長</th> <th>体重</th> <th >その他</th> </table> <table border="1"> <col span="6" width="85" align="center"> <tr> <td>1</td> <td>1</td> <td>1</td> <td>1</td> <td>1</td> <td>1</td> </tr> <tr> <td>2</td> <td>2</td> <td>2</td> <td>2</td> <td>2</td> <td>2</td> </tr> <tr> <td>3</td> <td>3</td> <td>3</td> <td>3</td> <td>3</td> <td>3</td> </tr> <tr> <td>4</td> <td>4</td> <td>4</td> <td>4</td> <td>4</td> <td>4</td> </tr> </table> </body> </html>
- ベストアンサー
- JavaScript
- テーブルの幅
tableのwidth指定についての質問です。 同じレイアウトで複数のhtmlファイルを作るのですが、その中のテーブル及びセルの幅をwidthで固定してあるのにも関わらず、セル内のテキストの長さによって各ファイルごとのテーブルのセルの幅が、IEでの表示で変わってしまいます。 <table width="450" cellspacing="0" cellpadding="2" border="1"> <tr> <th bgcolor="#ffcccc" width="150">aaaaaaaaa</th> <th bgcolor="#ffcccc" width="286">\100,000</th> </tr> <tr> <td colspan="2">ここには商品説明が入ります。ああああああああああああああああああああああああああああああああああああ</td> </tr> </table> 上記のaaaaaaaaaの部分がファイルによって長さが違うのですが、それによってセルの幅が変わってしまいます。 IE６でプレビューすると変わりますが、firefoxでは変わりません。 <th>を<td>に変更すると、幅は固定され変わりません。 IEの場合、thでwidth指定が出来ないのでしょうか。 なぜ変わってしまうのでしょうか?どこかに記述の問題があれば教えていただければありがたく思います。
- 締切済み
- 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">１</td> <td>あ</td> </tr> <tr> <td>い</td> </tr> <tr bgcolor="red"> <td>２</td> <td>う</td> </tr> </table> </body> </html>
- ベストアンサー
- HTML
