
横にリンク先を3つ並べたいのです
どのようにしたらいいのでしょうか
左 中央 右
3月10日 3月25日 4月3日
左 3月10日 は どちらも同じところに飛ばしたいです。
中央 3月25日 も どちらも同じところに飛ばしたいです。
右 4月3日 も どちらも同じところに飛ばしたいです。
更にこの下側に別に
横3つ で 縦2つ で配置させたいです。
B左 B中央 B右
3月10日 3月25日 4月3日
C左 C中央 c右
3月10日 3月25日 4月3日
上下で縦は きれいに見えるように 一定間隔でそろえたいです。
以上にてよろしくお願いします。
A 回答 (3件)
- 最新から表示
- 回答順に表示
No.3
- 回答日時:
No2です
>しかしこれでは 左 中央 右の文字が表示されません。
>左の下に3月10日を表示させたいです。
> 左
>3月10日
「左」、「中央」・・ってのは、てっきり説明用の文章だと思いました。
とは言え、表示する文字だけの話のようですから、文字の内容だけを変更すれば済む話ではないのでしょうか??
<a href="#1">左<br />3月10日</a>
とか。
わかりやすさのために、リンク要素に色を付けておいたので、それを見ればリンク要素がブロック状になっていることはわかると思うのですが・・
もともとHTML構成のご提示もない質問でしたので、No2はレイアウトの方法を例として紹介したものです。
HTMLや文章の内容に関しては質問者様にしかわからないので、それに合わせて応用してください。
もしも、もっと複雑な内容構成なら、<div><a>という構成にするよりも、<ul><li>等による構成の方が良いのかも知れませんね。
No.2
- 回答日時:
こんばんは
なさりたいことが正確にはわかりませんが・・・
手っ取り早いのはテーブルでレイアウトしてしまうことかな?
とは言え、昨今はテーブルレイアウトは推奨されないので、以下ではいかがでしょうか?
※ 列幅は均等3分割で良いものと解釈
※ ご質問文にない部分は適当に設定
※ レイアウトの状態がわかりやすいように、リンク要素には背景色を付けてあります。
<!DOCTYPE HTML>
<html lang="ja">
<head><title>Sample</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style>
#hoge{
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-auto-rows: minmax(80px, auto);
gap: 5px;
}
#hoge a{
text-align: center;
background-color: #AEC;
}
</style>
</head>
<body>
<div id="hoge">
<a href="#1">3月10日</a>
<a href="#1">3月25日</a>
<a href="#1">4月3日</a>
<a href="#2">3月10日</a>
<a href="#2">3月25日</a>
<a href="#2">4月3日</a>
<a href="#3">3月10日</a>
<a href="#3">3月25日</a>
<a href="#3">4月3日</a>
</div>
</body>
</html>
回答ありがとうございます。
しかしこれでは 左 中央 右の文字が表示されません。
左の下に3月10日を表示させたいです。
左
3月10日
です。
この2行をクリックすると
wordをダウンロードさせたいです。
<a href="11-.docx">左</a>
<a href="11-.docx">3月10日</a>
飛ぶという表言は適切ではなかったです。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Excel(エクセル) vba シートの並び替え 1 2023/04/19 13:44
- 妊娠・出産 受精日、排卵日について。 長くなりますが至急ご回答どうかよろしくお願いします。 ルナルナ推定排卵日2 4 2022/04/17 23:36
- アニメ ドラえもんで 初代 富田耕生(1936年2月4日生まれ) 1973年4月1日〜1973年6月24日 2 2023/02/21 18:36
- 邦楽 サザンオールスターズの皆さんは、何故武道館まで時間がかかったのでしょうか 3 2022/06/03 21:06
- 筋トレ・加圧トレーニング 自宅で『ダンベルとベンチ、チンニングスタンド』でトレーニングをしています。初心者なので、完全に行えて 2 2022/05/03 22:02
- その他(エンターテインメント・スポーツ) ニートは、過去へ戻るしかないですよね? 1 2023/02/19 22:06
- Excel(エクセル) エクセル関数について 2 2022/04/13 18:25
- その他(スポーツ) 大谷翔平の一番スゴいのはなんですか? 2 2023/02/24 15:35
- 怪我 内出血しました。いつからお風呂に入れますか? 3 2023/03/03 18:41
- その他(エンターテインメント・スポーツ) 2007年の想い出はありますか? 1 2023/03/03 20:54
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
ワードで席札を作りたい!
-
ワードです。罫線の枠でが次の...
-
エクセルのコピーで罫線無しを...
-
WORDでmm単位で指定して罫線を...
-
イラストレーターCS5|直線の塗...
-
ワード 罫線の中の文字が隠れ...
-
ワードで文書作成 右端に線が入る
-
一太郎で書写練習用のマスを...
-
方眼紙の升目を薄くする
-
Wordで家系図を書きたいです。
-
WORDで、黒い枠の中に白の文字
-
テキストボックスの枠線を絵柄...
-
ワードの中に入れたセルの角を...
-
フリーソフトで簡単に罫線が引...
-
B5の白紙に便箋のような線を引...
-
一太郎にエクセルの表をはりつ...
-
一太郎での罫線高さ調整
-
一太郎12で印刷すると文字が重...
-
Wordで変な枠が出ます。
-
パワポで曲がった両矢印の簡単...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
Wordで家系図を書きたいです。
-
エクセルのコピーで罫線無しを...
-
ワードで席札を作りたい!
-
ワードです。罫線の枠でが次の...
-
ワード 罫線の中の文字が隠れ...
-
Excelで罫線を引いていな...
-
ワード文章のあみかけ部分の検...
-
WORDでmm単位で指定して罫線を...
-
ワードでA4の紙にA5の書面を二...
-
ワードで文書作成 右端に線が入る
-
Word 台本 縦用紙 縦書きのコツ
-
WORDで、黒い枠の中に白の文字
-
WORDでシナリオのように書...
-
一太郎での罫線高さ調整
-
一太郎でB4を2ページとして中...
-
一太郎で罫線枠2行、その縦中...
-
ヘッダー、フッターの線の色を...
-
イラストレーターCS5|直線の塗...
-
A4用紙に大きな文字を、一文字...
-
Word(縦書き)の質問を2点。(行...
おすすめ情報
html はノートパッドで作成したいです。