質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

1回答

233閲覧

画像の横に見出しが来てしまいますm(_ _)m

ryonakano0809

総合スコア5

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2020/12/27 08:24

編集2020/12/27 09:39

初心者です。HTML
画像の横に見出しが来てしまいます。
下に見出しを置きたいです。
教えて下さい????
H3の勇者ゲーム
H3の神経衰弱が画像の横に来ます

画像 (ここに見出しがくる)
(ここに置きたい)

html

1<!DOCTYPE html> 2<html lang="ja"> 3 <head> 4<meta charset="utf-8"> 5<title>諒のポートフォリオサイト</title> 6<link rel="icon" href="favicon.ico"> 7<meta name="description" content="諒のポートフォリオサイト"> 8 </head> 9 <body> 10 <header> 11 12 <img src="taro.png" width="120"height="120" alt="中野のアイコンです"> 13 <h1>中野諒</h1> 14 <p>妻子持ちです。</p> 15 16 </header> 17 18 19 <h2>works</h2> 20 21 22 <img src="work1.png" width="400" height="260" alt="勇者ゲームの紹介画像"> 23 </h3>勇者ゲーム</h3> 24 <p>楽しいアプリです楽しいあぷりです楽しいアプリです楽しいアプリです 25 楽しいアプリです楽しいアプリです</p> 26 27 28 <img src="work2.png" width="400" height="260" alt="宝探しゲームの紹介画像"> 29<h3>宝探しゲーム</h3> 30<p>楽しいアプリです楽しいあぷりです楽しいアプリです楽しいアプリです 31 楽しいアプリです楽しいアプリです</p> 32 33 34 <img src="work3.png" width="400" height="260" alt="神経衰弱の紹介画像"> 35<h3>神経衰弱</h3> 36<p>楽しいアプリです楽しいあぷりです楽しいアプリです楽しいアプリです 37 楽しいアプリです楽しいアプリです</p> 38 39 <footer> 40 41 <p>(c)dotinstaill.com</p> 42 43 </footer> 44 </body> 45</html>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

miyabi_takatsuk

2020/12/27 08:45

現状のHTMLとCSSのソースコードを記載お願いします。 ```ここに言語を入力 コード ``` このような形式で書くと、 コードブロック形式となり、コードが見やすくなります。 質問本文は修正できますので、 質問本文にて記載下さい。
ryonakano0809

2020/12/27 09:03

よく分かりませんでしたのでコードをそのままコピーしています。 <h3>の勇者ゲーム <h3>の神経衰弱が イメージ画像横に来てしまいます、、、、、、、、
miyabi_takatsuk

2020/12/27 09:21

```html ここに質問者さんのコードを貼り付ける ``` というように直して下さい。 上の文字をまずコピペして、 間に質問者さんのコードをコピペする感じです。
ryonakano0809

2020/12/27 09:40

ありがとうございます!修正しましたが、 勇者ゲームだけうまくいきません、、、 他の神経衰弱、宝探しゲームはうまくいきました!!!
miyabi_takatsuk

2020/12/27 12:31

</h3>勇者ゲーム ↓ 開始タグが終了タグになっているからです
miyabi_takatsuk

2020/12/27 12:32

そのことも回答に追記しますね。
guest

回答1

0

ベストアンサー

html

1<img src="work1.png" width="400"height="260"alt="勇者ゲームの紹介画像" 2 3<img src="work1.png" width="400" height="260" alt="勇者ゲームの紹介画像">

html

1</h3>勇者ゲーム</h3> 23<h3>勇者ゲーム</h3>

というようにすれば直るかと。

属性と属性の間に半角スペースが入ってないのと、>img要素が閉じられてないのが原因です。

下の画像も同様の原因です。

投稿2020/12/27 09:19

編集2020/12/27 12:34
miyabi_takatsuk

総合スコア9528

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

ryonakano0809

2020/12/27 12:45

ありがとうございました‼️
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問