- ベストアンサー
ＨＰのスタイルシート
テーブル（3行２列）を左に、画像（１枚）を中央に配置したいのですが、 cssはどのように書けばいいのでしようか？
- fukuzyusou
- お礼率46% (63/135)
- ホームページ作成ソフト
- 回答数2
- ありがとう数12
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
結局、自動改行されてしまうから、「中央配置」ではなく、CSSで画像とテーブルのレイヤーの位置を指定した方がいいと思います。 ただ、他のコンテンツ内容とCSS内で整合性を取ってないと、ぐちゃぐちゃになるけど。 以下は添付画像に使ったソースです。 <STYLE> <!-- #contentsBody{ top : 0px; left : 50px; position : absolute; } #Layer2{ top : 30px; left : 240px; position : absolute; } #Layer1{ top : 30px; left : 150px; position : absolute; } --> </STYLE> <BODY> <DIV id="contentsBody"> <DIV id="Layer1"><IMG src="くまモン.jpg" width="80" height="80" border="0"></DIV> <DIV id="Layer2"> <TABLE border="1"> <TBODY> <TR> <TD>sel1</TD> <TD>sel1-1</TD> </TR> <TR> <TD>sel2</TD> <TD>sel2-1</TD> </TR> <TR> <TD>sel3</TD> <TD>sel3-1</TD> </TR> </TBODY> </TABLE> </DIV> </DIV> </BODY>
その他の回答 (1)
- AsarKingChang
- ベストアンサー率46% (3467/7472)
CSSはいらないと思いますが。 <table> <tr><td>x0y0</td><td>x1y0</td><td rowspan=2 align=center>grp</td></tr> <tr><td>x0y1</td><td>x1y1</td></tr> </table> ポイントはこの部分、 縦に２カラム占有、センター表示（何もしてない蹴れば縦もセンタリングされる＝middle） <td rowspan=2 align=center>grp</td> grpのところに、<img src=...>を置けば画像が中央に出ます。 意味合いが違いそうであれば、再度追加情報をもらえますか？
補足
ありがとうございます。 この方法だとテーブル内に入れることになりますが、 できればCSSで表現したいのですが。
関連するQ&A
- スタイルシートで、画像の横にリストを表示するには？
テーブルを使えば、1行2列のテーブルに左に画像、右にリストを入れれば、横並びができるかとおもいますが、スタイルシートを使った場合、画像の横にリストをおこうとすると、どうしても下に流れてしまいます。divで、画像とリストを囲って、floatをつかって右、左とすればできるかもしれないかなとおもいましたが、もっと簡単にできる方法がありそうなんですが。。。 なにとぞよろしくお願いいたします。
- ベストアンサー
- HTML
- スタイルシートでボックスを中央に表示する方法
大ボックスを中央に配置して その中に、小ボックスを上から10、左から20の位置に配置させたいのですが、 大ボックスが中央に配置できません。 少し右側にズレてしまいます。 （ソースは文章最後にあります） そこで大ボックスの position: absolute; を削除すると 中央に配置できるものの、小ボックスが外に飛び出して ブラウザを基点とした上から10、左から20の位置に配置されてしまいます。 tableタグを使わずにCSSのみで 大ボックスを中央に。 その大ボックスの中に大ボックスの左上を基点として上から10、左から20の位置に 小ボックスを配置する方法はないのでしょうか・・・。 よろしくお願い致します。 <html> <head> <title>box</title> <style type="text/css"> <!-- .boxL { /* 大ボックス */ width: 400px; height: 100px; background-color: green; position: absolute; } .box1 { /* 小ボックス */ width: 75px; height: 30px; background-color: lightblue; position: absolute; top: 10px; left: 20px; } --> </style> </head> <body> <div align="center"> <div class="boxL"> <div class="box1">小ボックス</div> </div> </div> </body> </html>
- ベストアンサー
- HTML
- スタイルシート
スタイルシートを使ってホームページを作り始めたんですが、左にメニューを作りたかったので body { margin: 0px; padding: 0px; } .main { width: 580px; position: absolute; left: 210px; } .side { width: 180px; margin-left:10px; } とcssファイルを作り何個かのページに記述したらトップページを除いて他のページは配置がおかしくなったりレンタルサーバの広告がど真ん中に重なったりしてしまいます。なぜでしょうか？ 配置がおかしいとはsideとmainが ■■という配置にして欲しいのですが ■ ■という風になってしまいます。 わかりにくくてすみません。
- 締切済み
- HTML
- ホームページのスタイルシートについて質問があります。
ホームページのデザインでわからないことがあります。 一つの背景画像の中に複数の小さな画像を任意の場所に配置したいのですがCSSの書き方とhtmlでのコーディングがわかりません。 CSSタグリファレンスなどは見たのですが、「これっ」というものが探せませんでした。 すみません、ご教授よろしくお願いいたします。
- ベストアンサー
- その他（プログラミング・開発）
- dreamweavweでテーブルを中央に配置するようにしたのにsafariは左による
dreamweavweでテーブルを中央に配置するようにcssでもテーブルの設定でもなにもかもしたつもりです。そのたと見てみるとsafariだけがテーブルがセンターにならず、左によります！お手上げです！なぜかわかりません何か方法があるのでしょうか？
- 締切済み
- HTML
- サイトは中央配置、背景に画像、または色をつける
css初心者です。 サイト（すみませんこの言葉でいいでしょうか？）を ブラウザ画面の中央に配置したいとき cssでbodyを中央配置にしています。 その両サイドにも、色または画像をつけたいのです。 テーブルを使用せず 下記のページのように サイトは中央に配置、背景に色や画像をつけるには cssでどのように指定すれば よろしいでしょうか？ http://www9.nhk.or.jp/umechan/ http://www.nikoand.jp/ よろしくお願いいたします。
- ベストアンサー
- CSS
- スタイルシートで対応できますか？
ショッピングカートを作成しており、スキンテンプレートHTML内に$cart_in変数を 入れること、横１列で縦並びに商品が陳列されます。これを、CGIをいじらないで（CGI内では横に繰り返しすることは出来ないので・・・）、CSS段組等で横に２列、３列で折り返し、縦に繰り返す方法で対応できないでしょうか？ 例えば、一番外はテーブルを使い、入れ子でCSS段組をして、テーブルサイズを調整すれば、横に繰り返すとか？初心者なのでできれば、簡単なソースで回答していただけるとありがたいです。 ------------------------------------------------------------------------------- <table> <tbody> <tr> <td> $cart_in </td> </tr> </tbody> </table> ---------------------------------------------------------------------------------
- 締切済み
- HTML
- HP作成 スタイルシート
ビルダーを使ってHPを作成しています。そこで、ページの背景の上だけにgif画像を指定したくスタイルシートを追加してみたのですがうまくなりません。ビルダーのHTMLに追加しているのですが追加する場所を間違えているような気がします。ビルダーで背景色を#cc0000設定しています。 <TITLE></TITLE> <STYLE type="text/css"> <!-- BODY { background-image: url("image/gurad1.gif"); background-repeat: repeat-x } --> </STYLE> <LINK rel="stylesheet" href="image/table.css" type="text/css" id="_HPB_TABLE_CSS_ID_"> </HEAD> <BODY bgcolor="#cc0000" link="#ffffff" alink="#009900">
- 締切済み
- その他(ソフトウェア)
- スタイルシートによる支配を抜けるには？
私の勤務先の自社サイトを、外部の業者がリニューアルしたのですが、その時にその業者が、全部で約200ページを支配する外部スタイルシートに、<TABLE>タグを使うと全て左に20pxマージンがつくような設定を入れてあるようです。 社長は、大規模なリニューアルはその業者に任せ、あとは自社で更新するという前提でこのリニューアルを行ったので、これからは私が更新して行かなければならないのですが、私はスタイルシートのことが殆どわかりません。 今、その外部の業者が設定したスタイルシートのおかげで、テーブルの中に更にテーブルを配置した場合など、内側のテーブルを競るの左にピッタリつけたいのに強制的に左側を20ピクセル空けられてしまいます。 業者が設定したスタイルシートをいじってその20pxマージンを0pxに変更してしまえば、私が今いじりたい部分は目的通りの配置で作れるのですが、もちろん、そのかわりに他のテーブルがみんな左に片寄ってしまい、これでは話になりません。 私が特例としてマージン無しで配置したいテーブルだけをスタイルシートの支配から除外するにはどうしたら良いでしょうか？
- ベストアンサー
- HTML
- シート名が半角数値だったら、それら全シートに設定を。
エクセル2000です。 マクロを作成したいのですが、どなたかお知恵をお貸しください。 やりたいこと。 シート名が半角数値だったら、それら全てのシートに下記の設定を施しなさい。 ↓ココから 選択した全シートの１行目は左揃え。 選択した全シートの２行目，３行目は中央揃え。 選択した全シートの４行目以下の全行について、横位置を・・・ Ａ列→中央揃え Ｂ列→左揃え Ｃ列→中央揃え Ｄ列→右揃え Ｅ列→左揃え＆折り返して全体を表示する。 Ｆ列→中央揃え Ｇ列→中央揃え 選択したシート全ての縦位置を・・・ 全てを中央揃え ↑ココまで ↓ココから ↑ココまで は、自動マクロですでに作成してあるので、ＯＫです。 知りたいこと。 シート名→1，2,3,・・・、いくつまでシートがあるかは不明確であり（今後増える）、 かつ、数値が飛び飛びになる可能性がある場合の設定の仕方を知りたいです。 シート名が1,2,4,5,10・・・などとなる場合があります。 このような場合、どのように設定したら良いのでしょうか。 よろしくお願いいたします。
- ベストアンサー
- オフィス系ソフト
お礼
ありがとうございます。 大変参考になりました。