• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:htmlでテキストを画面の中央になるように)

htmlでテキストを画面の中央になるように

aozakana_dhaの回答

  • ベストアンサー
回答No.1

そこにiframeを使用することが適切かどうかは別にして… (1)tableの幅が小さくなって左に寄っていますので、tableの幅をいっぱいに広げます。 また、ピンク色の枠が入るセルをiframeと同じ300ピクセルに固定します。 具体的には、1行目を <table style="width: 100%"><tr><td style="width: 300px"> のように書き換えます。 これでリンクの文字が白い部分の中央、ウィンドウ全体の右寄りに表示されます。 (2)ウィンドウの右側にも左側のピンク色の部分と同じ幅の余白を設けます。 具体的には、 <DIV style="font-size:600%"> の部分を <DIV style="font-size:600%; margin-right:300px"> のように書き換えます。 これでリンクの文字がウィンドウ全体の中央に表示されます。

yuuneko333
質問者

お礼

わかりやすい回答ありがとうございます! 無事できました!

関連するQ&A

  • html 画像を並べて表示したい

    html初心者です。 前回質問したときにインラインフレームと真ん中のロゴを並べて表示していただきました。 今回は3つ横に並べて表示したく、前に教えてもらったタグをいじってみたのですが3つ並ぶことはなく、どうしても下にずれてしまいます。 画像の右下にずれてしまった画像(オレンジのやつ)があるのですがそれを真ん中のロゴの左に移動させたいのですが どうすればできますか? html↓ <table style="width: 100%"><tr><td style="width: 300px"> <iframe src="file:///C:/Users/yuri/Desktop/%E3%81%BF%E3%81%84hp/%E3%82%A4%E3%83%B3%E3%83%95%E3%83%AC%E5%86%85.html"frameborder="0"width="440" height="500" style="background-color: #FFC0CB">みーちゃん</iframe> </td> <td> <A Href="URLまだ" Title="JUMP!!"> <font color="#FF69B4"> <DIV style="font-size:600%; margin-right:300px"> <div align="center"> <font face="HGS創英角ポップ体,Courier New">Miiko's<br>Photo.</font> </div> </font> </A> </b> </td></tr></table> <hr style="border:dashed;color:カラーコード;"> <img src="file:///C:/Users/yuri/Desktop/%E3%81%BF%E3%81%84hp/flower4800.jpg" width="400px" height="296px" align="right"><br> <br> </div>

  • HTML?スタイルシートの表センタリングについて

    以下のSampleでやってみましたが、うまくセンタリング できません。 表をPageの真ん中に置いて かつ、表の中のセル内、文字列は左によせるには どうしたらよいのでしょうか? またこのような作業、確認は皆さんどうやって書いているのですか? ホームページビルダーでしょうか? 常に表には苦労しています、今までは<CENTER>を使っていました。キレイなHTMLを勉強しようとしているのですが 非常に難しいですね。よい方法ないでしょうか? スタイルシート部分: <style type="text/css"> div.ctable { text-align: center; /* IEでセンタリングさせる方法 */ } div.ctable table { margin: auto; /* 標準のセンタリング方法 */ text-align: left; /* IE用方法の弊害対策用 */ } </style> HTML部分: <div class="ctable"> <table> <tr><th>スタイルシート</th><th>センタリング</th></tr> <tr><td>CSS</td><td>Centering</td></tr> </table> </div>

  • テーブルが左右上下中央表示にできない。

    <style type="text/css"> <!-- .tableley { text-align: center; } .tableley table{ margin-left: auto; margin-right: auto; } .tableley caption{ margin-left: auto; margin-right: auto; } bodytd{ letter-spacing :2px; line-height :15pt; font-size:80%;font-family:'Verdana'; color:#ffffff; } br{letter-spacing:normal;} body{overflow-y:hidden; margin:0;padding:0; background-attachment:fixed; } a{ text-decoration:none; color:#000000; } a:hover{ color:#808080; } --> </style> </head> <body> <table border="0" width="100%" height="100%" cellspacing="0" summary="テーブル"> <tr> <td colspan="3" style="border-bottom:1px solid #000000" bgcolor="#000000" valign=bottom><font size=5><b>SITE NAME</b></font> </td> </tr> <tr> <TD height="80%" width="250" align="center" valign="top" colspan="3"><BR> <BR> <table style="border: 1px dotted #cccccc;"> <tbody> <tr> <TD><IMG src="ConvertImage/ice.png" width="187" height="131" border="0"></TD> <TD height="120" width="200"> <div style="width: 270px; height:140px;color:#cccccc;font-size:10px;font-family:Verdana;overflow:auto; scrollbar-face-color:#000000; scrollbar-highlight-color:#000000; scrollbar-shadow-color: #000000; scrollbar-3dlight-color: #000000; scrollbar-arrow-color: #cccccc; scrollbar-darkshadow-color: #000000; scrollbar-track-color: #000000;"><FONT color="#cecfce">ここにテキスト<BR> </FONT></div> </TD> </tr> </tbody> </table> </TD> </tr> <tr> <td colspan="3" style="border-top:1px solid #000000" bgcolor="#000000" align="right" valign="top"><FONT color="#ffffff">SINCE</a> </td> </tr> </table> </body> と、ビルダーでフレームを使わず横三分割のサイトを作ったのですが 真ん中の白い部分にあるテーブルを白ページ上下左右中央に設置出来ず悩んでいます。どうか解決策を教えてくださいお願いします。

    • ベストアンサー
    • HTML
  • td要素内のdiv要素をセンタリングしたい

    いつもお世話になっております。 HTMLのセンタリングで困っております。 どなたか教えていただけないでしょうか。 HTML <table> <tr> <td> <div><a href="#"></div> </td> </tr> </table> 上記のdivをtd内でセンタリングさせたいです。 どうかよろしくお願いいたします。

    • ベストアンサー
    • HTML
  • FireFox2.0でCSSを使ってテーブルそのものをセンタリングしたい

    IE6だと #wrapper { text-align: center; } <div id="wrapper"> <TABLE border="1"> <tr><td>テキスト</td></tr> </table> </div> とやればテーブルそのものがセンタリングされるのですが、 FireFox2.0だと左に寄ったままです。 CSSを使わずに<center>で囲めばセンタリングされますが、 そうではなくてCSSを使ってやるやり方はないでしょうか?

    • ベストアンサー
    • HTML
  • スタイルシートでのデザイン

    HTMLを組む際、今までレイアウトはtableタグで組んでいたのですが、CSSで組もうと思っています。 例えば、 <table align="center"> <tr> <td colspan="2" width="500" height="80">aaa</td> <td rowspan="2" width="300" height="200">bbb</td> </tr> <tr> <td colspan="2" width="500" height="20">ccc</td> </tr> <tr> <td width="200" height="100">ddd</td> <td width="300" height="100">eee</td> </tr> </table> をスタイルシートで配置しようと思い、 <div align="center" style="width:800px"> <div style="float:left;width:500px;height:80px;background-color:#ff9999">aaa</div> <div style="float:right;width:300px;height:200px;background-color:#9ff999">bbb</div> <div style="float:left;width:500px;height:20px;background-color:#9999ff">ccc</div> <div style="float:left;width:200px;height:100px;background-color:#99ffff">ddd</div> <div style="float:center;width:300px;height:100px;background-color:#ffff99">eee</div> </div> としたのですが、センタリングされないのと、eeeの箇所がdddの隣に来ないで次の行に移ります。 うまく出来ないので、どなたか教えて下さい。お願いします。

    • ベストアンサー
    • CSS
  • 2つのタグを合わせたいのですが・・・

    下記のテーブル内にカラーラインを掲載したいのですが、どうやってもできません。いろいろ調べてるんですが、組み合わせたタグが見つからない状態です。 テーブル内にカラーラインを挿入することは不可能なんでしょうか? 皆様、ご多忙と存じますが、教えていただけると幸いです。 稚拙な文章で申し訳ありませんが、宜しくお願いいたします。 ・テーブル <DIV ALIGN="CENTER"><TABLE BORDER="1" BORDERCOLOR="#12DAB5"><TR><TD BGCOLOR="#C0FFC0"> <FONT COLOR="#000000">文字</FONT></TD></TR></TABLE></DIV> ・カラーライン <TABLE WIDTH="100%"><TR><TD BGCOLOR="#7FFFFF"> <DIV ALIGN="CENTER"><FONT COLOR="#000000">文字</FONT></DIV></TD></TR></TABLE>

    • ベストアンサー
    • HTML
  • WEB上とPC上で font が・・・

    <Div style="width:200;height:100;overflow:auto; scrollbar-darkshadow-color:#ffffff; scrollbar-face-color:#ffffff; scrollbar-highlight-color:#ffffff; "> <table style="font-size: 12px; padding: 3; width: 180px;"><tr><td> ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・ ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・ ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・ </td></tr></table> </Div> これをPC上で表示すると、font 12px になりますが、 WEB上で表示すると、何故か 12px より大きくなります。 何故そうなり、どうやったらWEB上でも 12px になりますでしょうか?

    • ベストアンサー
    • HTML
  • テーブルのテキスト色について

    ブログ初心者です。 テーブル(表)を作ることはできたのですが、 テキストの色が真っ黒なので変更したいと思い、色々と試してみましたが、分かりません。 <table style="font-size:0.8em;" "font color=#8b8b8b;" border=1><tr><td>あいうえお</td></tr></font></table> ↑のようにフォントカラーを入力してみましたが、黒字のままです。 どのようにしたら表の中の字の色を変更できるのか教えて下さい。 どうぞよろしくお願い致します。

  • CSSを使った丸ナンバー付きテーブルの挿入

    HTMLで作成した丸ナンバー付きテーブルをスタイルシートを使って挿入しようと思っているのですが、肝心の数字の部分が真っ白になってしまいました。関係しそうなところだけ抜き出してみました。 (↓headの中に書いてある) body {background-color: white; background-image: url(dolp2.gif); color: #000000} table, td {width: 800px; border: 2px #C0C0C0 solid; border-collapse: collapse; background-color: #ffffff;} (↓body以下に書いてある) <div><Table border="0"><Tr><Td> <Table border="0" cellspacing="0" bgcolor="#009500" cellspacing="0" cellpadding="5" style="color:#ffffff;font-size:25px;font-weight:bold;width:40;filter:Alpha(opacity=100,finishopacity=0,style=2);"> <Tr><Td align="center" valign="middle"> 1 </Td></Tr></Table> </Td><Td width="350"> ===ここに文章を書いて下さい1=== </Td></Tr> <Tr><Td> <Table border="0" cellspacing="0" bgcolor="#009500" cellspacing="0" cellpadding="5" style="color:#ffffff;font-size:25px;font-weight:bold;width:40;filter:Alpha(opacity=100,finishopacity=0,style=2);"> <Tr><Td align="center" valign="middle"> 2 </Td></Tr></Table> </Td><Td width="350"> ===ここに文章を書いて下さい2=== </Td></Tr> <Tr><Td> <Table border="0" cellspacing="0" bgcolor="#009500" cellspacing="0" cellpadding="5" style="color:#ffffff;font-size:25px;font-weight:bold;width:40;filter:Alpha(opacity=100,finishopacity=0,style=2);"> <Tr><Td align="center" valign="middle"> 3 </Td></Tr></Table></div> </Td><Td width="350"> ===ここに文章を書いて下さい3=== </Td></Tr></Table> このようなタイプのものはheadやcssにあげたほうがいいのでしょうか? 最初はこのままbodyのなかに収めておこうかと思っていたのですが、上記のような事態になってしまったのでどうしたらいいのか困っています。 HTML初心者なので、なにとぞ宜しくお願いします。

    • ベストアンサー
    • HTML