No.1ベストアンサー
- 回答日時:
> 間にプリフォーマットで改行を入れてみました。
というと、現状は、
<pre>
<img src="hoge1.gif"(以下属性省略)>
(省略)
<img src="hoge7.gif"(以下属性省略)>
</pre>
という記述ですか?
これが、「メニュー」の意味を持つものなら、画像を直でただ並べる、というマークアップは好ましくありません。
ナビゲーションはulでマークアップするのが論理構造上より望ましい方法として一般的になっています。
また、
> 上記の状態の「中間程度の隙間」と言うのは作り出せないものでしょうか?
要素と要素の間の余白を任意で調節したいのであれば、やはりimgをブロック要素の子要素として配置し、親要素の上下方向のマージンで調節するのが理にかなっているでしょう。
以下は、ごく大雑把なサンプルです。各プロパティの意味や性質については説明を省きますので、ご自分でググるなどして把握して下さい。
【HTML】
<ul class="hoge">
<li><img src="hoge1.gif"(以下属性省略)></li>
(省略)
<li><img src="hoge7.gif"(以下属性省略)></li>
</ul>
【CSS】
ul.hoge {
list-style: none;
line-height: 0;
padding: 0;
margin: 0;
}
ul.hoge li {
margin-bottom: 1px;←任意の値(pxであれば整数)を入れて調整。この値を大きくすれば下方向への余白が広くなり、小さくすれば狭くなります。
}
ul.hoge li img {
vertical-align: bottom;
}
早速のお応え、ありがとうございました。
ホームページを趣味の一部に利用させて頂いてるだけの自分には
少々難しく見えましたが(苦笑)
imgとimgの間に透明な(?)部品を入れるようなものでしょうか?
とりあえず教えて頂いた通りのソースで試作してみます。
丁寧なお答えをありがとうございました!
No.2
- 回答日時:
文書構造に従ったマークアップを行いましょう。
プレゼンテーション(見栄え)のために、本来の意味を超えたマークアップは非推奨です。HTML4.01仕様書(14.1 スタイルシートの概説)
http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401 … より引用
・略
・ テキストを画像に置き換えて表現する。
・ 余白制御のために画像を用いる。
・ ページレイアウトの目的で表を用いる。
略
サイとメニューの一覧ですから、通常はol(番号付きリスト)ないしul(順不同リスト)でしょう。
<ol id="SiteList">
<li><img src="images/NEW" alt="トップページ" title="トップページに戻る"></li>
<li><img src="***" alt="日記" title="日記のページへ進む"</li>
<li>略</li>
<li>略</li>
</ol>
がHTMLになります。
次にプレゼンテーション(見栄え)のためのスタイルシートの記述です。そのページだけなら<head></head>内に、他のページにも適用するなら外部スタイルシートへ
ol#siteList{
display: block;
position: relative;
width: 200px;
margin-right: 10px;
line-height: 0px;
border: 1px solid black;
}
ol#siteList li{
list-style-type: none;
margin: 0px;
}
まあ、すきにデザインすればよいでしょう。
早速のお応え、ありがとうございました。
自分には少々難しい内容ではありましたが、
ホームページを作る上でそのソフト独自の表現等はあまりよろしくない…
と言う事でしょうか?
自分も以前に他のページでもそのような事を読んだ記憶があるので
やはりタグやソースと言ったものを勉強した方がいいのでしょうね~
教えて頂いたもので試作させて頂いて、また勉強してみます!
ありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- 扇風機・冷風機・サーキュレーター 扇風機リモコンの反応劣化。接点復活材で対処。 4 2022/08/14 21:34
- その他(AV機器・カメラ) 至急!Panasonicのリモコンを使ってるのですが、電源ボタンなどや音量ボタン入力切り替えのボタン 3 2022/06/02 14:43
- Visual Basic(VBA) 【ExcelVBA】動的にボタン、ボタン名を生成できますか? 7 2022/04/08 12:54
- その他(プログラミング・Web制作) GASでガントチャートを作りたいです 1 2022/09/05 17:26
- その他(パソコン・周辺機器) ボタン数の多いゲームコントローラー、ゲームパッドを探しています 2 2023/08/17 16:29
- Access(アクセス) Access 登録ボタンからサブフォームの更新 1 2022/07/22 10:23
- Excel(エクセル) 【Excel】指定のセル内容を基に別シートのセルを検索して選択する【VBA】 1 2022/06/16 16:16
- その他(コンピューター・テクノロジー) PC利用中に勝手に起動する窓を消し去る方法を教えて下さい。 1 2023/05/08 16:48
- その他(パソコン・周辺機器) X6 ブルートゥースレシーバー(画像あり) の、使い方を教えてください。 ボタンは、ペアリング時のボ 5 2023/04/19 19:11
- Excel(エクセル) マクロを教えてください 3 2023/07/31 21:57
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
既存画像(gif または png)の背...
-
HTMLで、ホームページが作れる...
-
ホームページビルダー15で作っ...
-
ビルドとリビルドの違いを教え...
-
ホームページを作りたいのです...
-
ビジュアルスタジオの警告が出...
-
ホームページビルダーの右サイ...
-
XREA使用で作成したHTMLファイ...
-
ホームページビルダー19文字化け
-
PC版のサイトをスマホに対応さ...
-
ビフォアーアフターのページは...
-
グリッドレイアウトHTMLとCSS
-
ホームページビルダー11で作...
-
Adobe FLASH に代わるソフトは...
-
友達にドッキリをしたくて、ホ...
-
FFFTPでサーバに新規フォルダが...
-
ページの内容コピペ 範囲が広い...
-
今さらですがHPを作成するに当...
-
ホームページ制作で教えてくだ...
-
ホームページビルダーおすすめ?
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
既存画像(gif または png)の背...
-
ホームページの画面文字を濃く...
-
ホームページビルダー15で作っ...
-
ホームページビルダーを複数の...
-
ページの内容コピペ 範囲が広い...
-
今さらですがHPを作成するに当...
-
友達にドッキリをしたくて、ホ...
-
ホームページビルダー22でリン...
-
XREA使用で作成したHTMLファイ...
-
FFFTPでサーバに新規フォルダが...
-
メールフォームで送信すると「...
-
ビフォアーアフターのページは...
-
Adobe FLASH に代わるソフトは...
-
ホームページの内容変更を無料...
-
web制作(HP作成について教えて...
-
友人のホームページを引き継ぐには
-
ホームページ作成について。「...
-
ホームページビルダー11で作...
-
FC2ホームページの変更に仕方
-
アメーバ・ブログは"HTMLタグ"...
おすすめ情報