ここから本文です

回答受付終了まであとわずか 回答を投稿すると知恵コイン15枚が追加されます

HTMLについての質問です。 2つあります。 ①現在、イラストを展示しておく用の...

アバター

ID非公開さん

2017/12/712:25:39

HTMLについての質問です。
2つあります。

①現在、イラストを展示しておく用のサイトを制作しています。
フレームを用いて、左フレーム(width:200px)をメニューとし、小さくトリミングした

画像を並べて、クリックすると右フレーム(width:*)に元画像とテキストメッセージが表示されるつくりにしています。
しかし、その作りにすると、表示させたい画像の分だけ"画像とテキストメッセージが記述されたhtmlファイル"を作成しなければなりません。(<a href="画像とテキストメッセージが記述されたhtmlファイル"><img src="小さくトリミングした画像"></a>と記述する方法の為)
これがかなり面倒なのですが、いちいちhtmlファイルを作成せずとも同じ動作が可能な記述方式はありませんか?

②サイトの見栄えの為に、CSS側で *{ margin:0px; padding:5px;}と記述し、文字・画像の間隔を広げようと思ったのですが、
これを適用すると、特定の部分の<li>要素のみ左インデントがおかしくなり、リストにガタつきが出来てしまいました。このような感じです。
メニュー
サンプル1 ←おかしい
サンプル2
サンプル3
サンプル4
どう弄っても直らないので、*でマージンとパディング共に0pxと指定し、ul li{ padding:5px; }と記述した所、ガタつきなく余白を空けることが出来ました。(サンプル1が2,3,4と綺麗に左揃えに並びます)
どうやらテキスト(この場合li a)に直接マージン、パディングを指定するとガタつきが生まれてしまうようなのですが、何故このようなことが起こるのでしょう?起こる原因も直った理由も分からずモヤモヤします。

長文乱文失礼致しました。よろしくお願い致します。

閲覧数:
48
回答数:
1

違反報告

回答投稿

全角1文字以上で回答を入力してください。

※質問が「投票受付中」「解決済み」になると、回答を取り消すことはできません。
※一度に投稿できるURLは3つ以内です。(プレミアム会員・知恵袋アプリは除く)

エラーが発生しました。お手数ですが、時間をおいて再度お試しください。

あと全角4000文字

回答

1〜1件/1件中

プロフィール画像

カテゴリマスター

2017/12/721:47:50

>いちいちhtmlファイルを作成せずとも同じ動作が可能な記述方式はありませんか?

PHP等でページ生成させればOKです。

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

5文字以上入力してください

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問は選択されたID/ニックネームのMy知恵袋で確認できます。