電子書籍の厳選無料作品が豊富!

  お願いします。
他人様のHPを見ていると、長~く縦に続くページを拝見します。
私の能力では、A4サイズくらいの縦横比のページだけしか作れません。

◎長~いページの作り方を教えてください。
  もしかしたら、横にも広~いのができたりして?

A 回答 (3件)

 初心者です。

   
初歩的な方法でよろしければ、ページサイズは下記のようにして決めています。

【ツール】→【オプション】→【ページサイズ タブ】→【幅(W)】→【高さ(H)】→【長~いページ と説明 】→【登録】
でいかがでしょうか。

【幅(W)】→【高さ(H)】はデフォルトを参考に決めて見てはどうですか。
    • good
    • 0
この回答へのお礼

 ありがとうございます。
高さを二倍にすることができました。
まずは、所期の目標を達成できました。
幅一定にして(800)にして高さを(1800)で成功しました。

お礼日時:2011/04/03 03:15

NO.1です(お礼拝見済み)


ソースを初めて見ましたか?、それは失礼しました。
先日、
同じような方の修正を頼まれましたが、おそらく同じような作り方をしていると思います。
一旦、横道にそれますが、
最初にホームページビルダーの簡易モード?で作りませんでしたか?
そのモードは、誰でも簡単に作る事が出来るのですが、
作り方は、貼り絵です。(好きなコンテンツを好きな場所に固定する方法)
本来、HTMLは、文字の量や大きさによって流動的に、見る環境によっても変化させますが、固定の場合は、それが出来ません。
質問者さんの作り方は、貼り絵の様に簡単に作れますが、ウェブページとしてはデメリットが出るでしょう。
簡単に作りたい人(個人で楽しむ程度)はそれで十分なのですが、
表示に関する不具合には対応・対処できず、今回の様に不満がでるでしょう。
更に、複数の関連ページを増やす場合には、苦労するでしょう。

1、面倒だったり、難しければ、現状で我慢する。
2、お好みに作りたければ、時間を掛けて作り変える。
どちらかの選択です。
趣味の範囲なら、HTMLは自由だし、自己満足もあると思いますが、どちらでも良いでしょう。

HTMLは、基本的には、HTMLを書いた上からの順番で表示するのですが、
貼り絵(座標)の場合は、順番はどうでも良いのです。
見た目被らないようにすれば良いから。
貼り絵なのだから、全部座標によって固定されるわけです・・・
HTMLの最後部に書いたコンテンツを座標固定で上部にする事も出来ますから。
座標固定だから、流動的には出来ません。
更に、HTMLソースで読んだ人には意味が分からないウェブページになるでしょう。検索エンジンも同じ。
ですから、
最初の <BODY では全体の背景画像などを配置・設定しているのですが、
次の、<DIV style="top : 485px;left : 173px;
これは、小さな文章枠かな?は、最上部のコンテンツではないですよね?・・・
id="Layer12"って事は、もしかして、中盤のコンテンツなのに、
HTMLソース上では、何故か、一番上から書いています・・・
本来は、ヘッダーなどの一番上に来る部分が<BODY の次に配置します。

座標固定の部分とは、
style="top : 485px;left : 173px;
position : absolute;
z-index : 5;
この部分です。
各コンテンツのこの部分を取り去り、座標固定にするのではなく、
上から順番にコンテンツを書いていき並べます。
当然、縦や横に並べるのは、更にテクニックが必要です。
ここでCSSで配置を調整します。
という事は、修正修正でグダグダになる可能性もあるので、
最初から作りなおした方が早で、
HTMLの参考書があれば、勉強で遠周りなようでも、結果(将来的にも)早く・綺麗に・上手くできるでしょう。

一般的には、
<body>
<div id="wrapper"> <!-- 全体枠開始 -->
<div id="head"><h1>上部タイトル</h1><h2>タイトルや説明</h2></div>
<div id="side"><ul><li>サイド</li><li>メニュー</li></ul></div>
<div id="main"><h3>内容</h3><p>内容</p><p>内容</p></div>
<div id="foot"><p>フッター</p><p>(下部)</p></div>
</div> <!-- 全体枠終了-->
</body>

とHTMLで構造化したほうがよいでしょう。
ソースの日本語の部分を見れば誰でも内容が順番通りに読み進めます。
毎回、座標を使わなくてもカンバスは自由に使えます。
コンテンツが増えれば、勝手に下に長くなります。
CSSで各コンテンツの幅や配置(横に配置とか)を決めます。

NO.1の回答は、上記の
<body>
<div id="wrapper"> <!-- 全体枠 -->
の部分を、
<body>
<div id="wrapper" style="width:800px; margin:0 auto; background:#F5F5F5;"> <!-- 全体枠 -->
のように横width幅だけを設定して、heightの縦は設定しないという意味。
とすれば、縦が流動的になり、コンテンツを増やしてもどんどん下に伸びます。
    • good
    • 0
この回答へのお礼

 大変詳しくありがとうございました。  <m(__)m>

日本語は読めるのですが、理解ができません。

昔N-ベイシックで並び替えをして、MSDOSー5.0を少しさわり、Excelのマクロ記述の一部をわずかに修正できる程度です。

HTMLの今回は、イメージが全く浮かびません。

 試行錯誤も全くできないレベルです。 <m(__)m> 悔しい!

ありがとうございました。

お礼日時:2011/04/02 22:15

<body><div>文章を溢れるぐらい永遠長く・・・・</div></body>


デフォルトで、この場合、永遠と長く表示されますよ。
A4の概念を取っ払い、広いカンバスを自由に使いましょう。

もしかして、heightで縦を固定してコンテンツを入れてませんか?
heightは設定せずに、開放してやって下さい。
コンテンツを増やせば増やすほど縦長になり、
ブラウザの表示範囲より長ければスクロールバーが出てきます。

横サイズは、widthで600px~1200px前後で枠幅を固定する場合が多いですが、
サイドバー設置の場合で、よくwidthで幅を指定して広くします。
widthで幅を固定しないと、ブラウザで表示した範囲が100%となります。
逆に、ブラウザよりwidthの指定が広ければ、下部に横用のスクロールバーが出ます。

ウェブページに縦の概念はありません。
縦のheightを設定しない場合が多く、
heightを設定する場合は、
画像や動画などのメディアを固定表示したい場合などです。
仮に、文章などにheightを設定してしまうと、
その長さ以上に文章などがある場合には、
heightの指定範囲内で切れてしまいますし、
全体ズームではなく、文字サイズを大きくされたらその範囲で収まらなくなります。

つまり、
heightを設定しない事で、縦長ページが勝手に作れます。
    • good
    • 0
この回答へのお礼

 早速のご回答ありがとうございます。   私は、普段
主にアイコンやプルダウンメニューの操作に頼っています。
おそるおそるnaokita様の言われる部分と思えるトコロを開いてみました。
もしここなら、どうすればよいのか、いま少し教えてください。 <m(__)m>

◇HMLソースの9行目から下記の様になっています。
◇編集スタイルはスタンダードから始めています。



</HEAD>
<BODY bgcolor="#CCFF99" text="#336633" link="#663300" vlink="#CC9966" alink="#CC3366" background="bu03_bg.gif">
<DIV style="top : 485px;left : 173px;
position : absolute;
z-index : 5;
width : 137px;
height : 128px;
visibility : visible;
" id="Layer12" align="center"><BR>

お礼日時:2011/04/02 09:50

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!