ホームページの行間を広げたい!

このQ&Aのポイント
  • ホームページの行間を広げるために試したhtmlタグが効果がなかったという質問です。
  • 様々なhtmlタグを試しましたが、行間が広がらない問題が発生しています。
  • 行間を広げるためには他に何か原因があるのか疑問に思っています。
回答を見る
  • ベストアンサー

ホームページの行間を広げたい!

先ほどからホームページの行間を広げるべく、ネットで「行間・htmlタグ」などで検索し、その通りのhtmlタグを入力しているのですが、いくらやっても行間が広がりません。 トライしたのは以下のhtmlタグです。 1.<span style="line-height:150%">(文章) </span> →不成功、行間変わらず 2.<table border="0" width="700">(文章)</table> →不成功、行間変わらず 3.<div> </div> →不成功、行間変わらず 4.タグを入れず、単純に行間を開ける。→不成功、行間変わらず どうなっているのでしょうか?何かほかに原因があるのでしょうか?

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

  • ベストアンサー
  • saekikkt
  • ベストアンサー率60% (378/622)
回答No.4

#3の続きの回答 何をなされたいのか???? >単純に、文章1と文章2の間に広いブランクを入れるにはどうしたらよいかということです。 この意味は、下記のような形になれば、良いということでしょうか? ========================================= 文書1  ↑ (この間を空白で開ける)  ↓ 文書2 ======================================== これなら単純に改行(<br>で空白行)を入れれば済む話では、ないですか? こんなことではないようにも思うのですが????? これに近い方法で、貴方は、 「4.タグを入れず、単純に行間を開ける。→不成功、行間変わらず」 でやられていますが、この時の行間を開けるとは、どんな方法をとられたのでしょうか? 先にあげたリンク先にある <p style="line-height:150%">を使っても下記のようにすれば、空白行は開きますが??? --------------------------------------- 文書1こちらは、line-height:400%で設定しています。<p style="line-height:400%"><br></p> 文書2 -------------------------------------

oozora2000
質問者

お礼

>こんなことではないようにも思うのですが????? いや、実はこんなことなのです。 単純に文章間にスペースを開けたいということで・・・。 教えて頂いた両方の方法を試しました。 少し、スペースが開いたように見えますが、際立っての変化は認められませんでした。 「4.タグを入れず、単純に行間を開ける。→不成功、行間変わらず」 でやられていますが、この時の行間を開けるとは、どんな方法をとられたのでしょうか? 文章の塊の後に、</table>と入れ、その後単純に1行スペースを入れましたら、見た目も1行開きました。 まだわからないこと、上手く行かないことが沢山ありますが、見かけたら教えて下さい。

その他の回答 (3)

  • saekikkt
  • ベストアンサー率60% (378/622)
回答No.3

どんなサイトを参考にされているのでしょうか? たとえば、下記のサイトを見られましたか? http://www.1uphp.com/con1/abc/lineheight.html http://www.dspt.net/seo/001/005.html 2~4は、意味がないです。 1.について以下のようにすると一応行間は、変わりますが??? <BODY><span style="line-height:150%">(文章1)<br> </span> こちらは、広めの設定に設定してあります。<br> <br> <span style="line-height:75%">(文章2)<br> こちらは、狭く設定してあります </span></BODY>

oozora2000
質問者

お礼

大変懇切丁寧に教えて頂き、ご投稿には感謝します。 冒頭の2つのサイトも拝見しました。 しかし、その通りにしましたが、相変わらずうまくいきません。 私の知りたいのは、文章1のように行間の広い部分と文章2のように行間の狭い部分を作ることではなく、単純に、文章1と文章2の間に広いブランクを入れるにはどうしたらよいかということです。 しかし、そのことが頂いた資料には書いてありません。色々応用してやってみましたが、上手く行きません。前に比べて行間が広がったようにも見えません。

  • t_ohta
  • ベストアンサー率38% (5071/13248)
回答No.2

下記のようにすると2行目の上下は他の行より隙間が空きますよ。 1行目<br> <span style="line-height:150%;">2行目</span><br> 3行目<br> 4行目<br> 他にも下記のような指定方法もあります。 1行目<br> <div style="margin-top:50px; margin-bottom: 50px;">2行目</div> 3行目<br> 4行目<br>

oozora2000
質問者

お礼

有難うございました。 あいにく書かれたとおりにやってみましたが、代わり映えしません。

  • tsubuyuki
  • ベストアンサー率45% (699/1545)
回答No.1

まぁ・・本気かどうかは置いておいて・・ > 1.<span style="line-height:150%">(文章) </span> →不成功、行間変わらず spanはインラインを想定して使うから、無理かもね。 > 2.<table border="0" width="700">(文章)</table> →不成功、行間変わらず そりゃ、幅だけ指定しても、行間は変わらんわ・・・ > 3.<div> </div> →不成功、行間変わらず いや、高さの記述しないと、どんなタグを使ってもダメでしょ。 > 4.タグを入れず、単純に行間を開ける。→不成功、行間変わらず まぁ、基本ですね・・・・・・・ > どうなっているのでしょうか?何かほかに原因があるのでしょうか? 以上が、主な原因です。

oozora2000
質問者

お礼

有難うございました。 原因はわかりましたが、どうすればよいのかわかりません。

関連するQ&A

  • ホームページの行間設定について

    ホームページの行間設定について質問です。 ページ全体の行間指定は<style type="text/css"> <!-- body,th,td {line-height : 180%;} --> </style> にしています。その中で一部行間を変えたいのですが<p style="line-height: 150%;"> </p> と入れて見ても変わりません。入れる場所が違うのか何が間違っているのかわかりません。どなたか教えてください。

  • 行間を指定できません

    ホームページビルダー6.5で、ページを作成しています。 文章が長く、見づらいので、行間をスタイルシートで指定してみました。(あるサイトで紹介されていたのをそのままやってみました) <head></head> の間にタグを入れるとの事で、その間には検索避けのMETAタグがあるので、METAタグの下に、 <STYLE type="text/css"> <!-- BODY { line-height:180%; } --> </STYLE> というタグを挿入しました。 しかし、ビルダーの「ページ編集」では、ちゃんと行間が変わっているように見えるのですが、ビルダーのプレビュー画面や、ブラウザ上ではなんにも変わってないのです(T T) 行間の空いてない文章のままです。 何か間違いがあるのでしょうか? タグの知識やスタイルシートに関しての知識はほとんどありません。 分かりやすく教えて下さると大変ありがたく思います。

    • ベストアンサー
    • HTML
  • スタイルシート line-heightのバグ?

    ホームページの中で、行幅をあけるのに、line-heightを使っています。 簡潔なタグは以下の通りです。 <html> <body> <span style="font-size:13px; line-height:160%;"> <img src="image/point.gif" border=0 width=6 height=8 alt="">てすと1<br> <img src="image/point.gif" border=0 width=6 height=8 alt="">てすと2<br> </span> </body> </html> 「てすと1」「てすと2」の前に小さな画像を入れています。 WinXP、NN4.XやN7.Xで見た場合は、画像が入っていても問題なく行幅が開きますが、 WinXP、IE6.02で見ると、line-heightが効きません。 これはIEのスタイルシートバグなのでしょうか? また、打開方法ありましたらお願いします! (参考まで:テーブルタグを使いたくないのでline-heightで行間をあけています)

    • ベストアンサー
    • HTML
  • 行間を開けたい

    ヤフーオークションのオークタウンを使って出品したいのですか 次のものをつかって行間を開けました <font size="3"><sup>テキスト~</sup></font>又は <SPAN style="LINE-HEIGHT: 23px"> </SPAN> 確認画面では はなれたのですがそれを保存すると消えて前と同じになります 行間を開けて保存できる方法を教えて下さい

  • Yahooオークションの商品説明 【行間を広げるタグ】

    こんにちは。オークションに使えるタグについて質問なのですが、商品説明欄の 字が見にくく、行間を広げたいのですが <DIV STYLE="line-height:0.5"> を入れても、行間が広がりません。 戻るをクリックすると、その部分だけ消えているのですが、Yahooオークションで 使える、行間を広げる方法って他にあるのでしょうか? よろしくお願いします。

  • HP作成で枠内の行間が変更できない

    ページ全体の行間を変えようと思い <style type="text/css"> body { line-height: 1.5; } </style> と入れたのですが、 枠内の行間だけは変わっていませんでした。 <table style="line-height: 1.5;"> <tr><td>☆☆☆☆</td></tr> </table> と入れたら枠内の行間も変えられたのですが、 枠が多数あるので効率が悪いです。 一気に枠内の行間も変えられる方法はないでしょうか?

  • センタリングのHTMLの挿入場所

    お世話になっております。 前回の質問の追加をしようとしたのですが、うまくできず、新たにスレッドを立てました。すみません。 以下のHTMLは横並びに写真を載せたもの(数行あります)です。(上部に文章を載せるための式がありますが、カットしています。)このプログラムのどこにセンタリングの式を入れたらいいのか、私の知識ではわかりませんでした。またご教示もらえると助かります。 よろしくお願いします。 </DIV> <DIV style="top : 1313px; </DIV> <DIV style="top : 1473px;left : 327px; position : absolute; z-index : 3; " id="Layer8"><IMG src="button2.gif" width="81" height="35" border="0" alt="Back"></DIV> <DIV style="top : 1060px;left : 21px; position : absolute; z-index : 8; width : 698px; height : 123px; " id="Layer6">&nbsp;  <IMG src="DSC_19711.jpg" border="0" width="160" height="106"> <IMG src="DSC_20401.jpg" border="0" width="160" height="106"> <IMG src="DSC_20541.jpg" border="0" width="160" height="106"> <IMG src="DSC_21231.jpg" border="0" width="160" height="106"></DIV> <DIV style="top : 883px;left : 15px; position : absolute; z-index : 7; width : 649px; height : 165px; " id="Layer5">&nbsp;   <IMG src="DSC_19311.jpg" border="0" width="160" height="106"> <IMG src="DSC_19381.jpg" border="0" width="160" height="106"> <IMG src="DSC_19411.jpg" border="0" width="99" height="149"> <IMG src="DSC_19631.jpg" border="0" width="160" height="106"></DIV> <DIV style="top : 572px;left : -3px; position : absolute; z-index : 5; " id="Layer3"> <DIV> <TABLE border="0" cellpadding="15" width="725" height="147"> <TBODY> <TR> <TD height="113" width="549" align="center" style="position : relative;table-layout : auto;">&nbsp;   <IMG src="DSC_17481.jpg" border="0" width="160" height="106"> <IMG src="DSC_18051.jpg" border="0" width="160" height="106"> <IMG src="DSC_18151.jpg" border="0" width="160" height="106"> <IMG src="DSC_18351.jpg" border="0" width="160" height="106"></TD> </TR> </TBODY> </TABLE> </DIV> </DIV> <DIV style="top : 729px;left : 12px; position : absolute; z-index : 6; " id="Layer4"> <DIV> <TABLE border="0" cellpadding="15" width="725" height="147"> <TBODY> <TR> <TD height="113" width="549" align="center" style="position : relative;table-layout : auto;">&nbsp;<IMG src="DSC_18421.jpg" border="0" width="160" height="106"> <IMG src="DSC_18641.jpg" border="0" width="160" height="106"> <IMG src="DSC_18941.jpg" border="0" width="160" height="106"> <IMG src="DSC_19201.jpg" border="0" width="160" height="106"></TD> </TR> </TBODY> </TABLE> </DIV> </DIV> </BODY>

  • テンプレートを使ったHP作成☆リンクタグについて

    nanosという無料のHP作成サイトでHPを作成中です。 テンプレートを使ってtopページを作ろうと思った所、リンクを貼った文字が薄いグレーになり、点線の下線までついてしまいます。カーソルをあてるとそれがピンクになります。 多分そういう設定になっているとは思うのですが、タグを見てもピンクの色指定の場所も無く、どう直したらいいのかわかりません。 ちなみに、カーソルをあてても、文字を変化させずに文字にリンクを貼りたいです。 タグのに何か設定があるのでしょうか? <br><center><pc><table width="550"><tr><td><div style=margin:10px;padding:5px;line-height:16px;></pc><nopc><table width="550"><tr><td><div style=margine:10px;padding:5px;line-height:15px;></nopc><div align="left"><font size="4" color="#000000" face="HGep021">タイトル</font> <a href="ページのurl">コチラ</a>より御入室ください。</font> </span></div></td></tr></table></center> <center><table width="550"><tr><td><div style=line-height:16px;><font size="1"> という感じです。 どこの部分がどんな表現をするのか教えていただけたらありがたいです。 宜しくお願いします。

    • ベストアンサー
    • HTML
  • 画面の中央に配置しようとすると、レイアウトが崩れてしまいます(泣)

    画面の中央に配置しようとすると、レイアウトが崩れてしまいます(泣) ajaxを使用した住所自動入力フォームをあるファイルに作ったのですが、それをコピーしてもう一つのファイルにペーストし、floatでフォームを横並び配置にするところまではうまく出来たのですが、それを画面の中央配置にプロパティでしようとして、ドリームウィーバー上ではちゃんとフォームは横並びに配置されているのですが、アップロードしてブラウザで確認した時になぜか縦配置になってしまっています。どうすればきちんとフォームが横並びになって画面の中央配置にできるでしょうか? <style type="text/css"> div.exampleB table { width: 280px; margin-right: 10px; float: left; } .exampleB { position: absolute; left: 50%; width: 630px; height: 100%; margin-left: -315px; </style> <div class="exampleB"> <div align="center"> <table width="315" height="449" border="2" align="center" cellspacing="0" bordercolor="#006633"> <tr> <td width="315" height="449"><div align="center"><span class="style13"><span class="style15"><a href="/link/moto2.html" target="_blank"></a><img src="../image/dt_022_03.gif" alt="引越元のイラスト" width="290" height="200" /></span></span></div><p align="center"><span class="style13"><span class="style119"><引越<strong>元</strong>住所></span></span><span class="style119"><br /> 郵便番号:(省略) 都道府県:(省略) 市区町村:(省略) 町域(大字):(省略) 丁目番地:(省略)  建物名~号室:(省略) </span></p></td> </tr> </table> <table width="316" height="449" border="2" cellspacing="0" bordercolor="#006633"> <tr cellspacing="0"> <td width="301" height="449"><div align="center" class="style30"><img src="../image/dt_023_03.gif" alt="引越先のイラスト" width="290" height="200" /><br /> <p align="left"><span class="style123"><span class="style15"><span class="style118"><引越<strong>先</strong>住所></span></span><span class="style118"><br /> 郵便番号:(省略) 都道府県:(省略) 市区町村:(省略) 町域(大字):(省略) 丁目番地:(省略)  建物名~号室:(省略) </span></p> </div></td> </tr> </table> </div> </div>

    • ベストアンサー
    • HTML
  • コンテナ内で文字を中央に表示したい

    <div> <table border=0 cellspacing=0 cellpadding=0 style="width: 100%; height: 100%;"> <tr> <td style="text-align: center; vertical-align: middle;"> Hello! </td> </tr> </table> </div> のように、テーブルを使わずに(できればCSSなどで)divタグ内のテキストを中央に表示したいのですが、できますか? よろしくお願いします。

    • ベストアンサー
    • HTML

専門家に質問してみよう