<a>リンクが飛ばない・・
パソコン初心者です 、本を見ながらHTMLで<a>でコードをかいたのですがWebに表示されません、本に書いてある通りにスペルも何度も見直しましたがリンクが飛びません
そして以下の表示が出てました↓
☆【 このコンピューターが差出人に識別されることを予防するため画像がブロックされています画像を表示するには、このアイテムを開いて下さい。】
意味がわからなくて困っています!
対応策をご存知の詳しい方おられましたら教えてください。
よろしくお願いいたします。
No.6ベストアンサー
- 回答日時:
例えばの操作を書かせて頂きます。
Bracketsを起動します。
上部メニューの「ファイル」→「新規作成」をクリックします。
出た画面に、以下の線内のソースをコピー&ペーストします。
―――――――――――――――――
<html>
<head>
</head>
<body>
<a href="https://www.google.com/"><img src="https://www.google.co.jp/favicon.ico"></a>
</body>
</html>
―――――――――――――――――
上部メニューの「ファイル」→「名前を付けて保存」をクリックします。
保存先となる任意の場所やフォルダを開き、「ファイル名」の欄に「index.html」と全て半角で入力し、「保存」をクリックします。
(同名のファイルがある場合は他の名前で結構です。使用する文字は、全て半角で、英数字と「 - _ . 」のみが無難です。)
Google Chromeで、保存したHTMLファイルを開きます。
画像が表示され、それをクリックするとGoogleのサイトへジャンプすれば正常です。
間違えやすいポイントとしましては、以下のようなものがあるかと思います。
・半角で記述すべき所を、半角で記述していない
・拡張子を付けていない
(「index.html」で言えば、「.html」の部分)
・必要な部分の打ち忘れ
(「<a href="https//www.google.com/">Googleへリンクする</a>」は、「https//」に「:」を入れて「https://」にする必要があります。)
こちらで「Windows11」+「Brackets」で検証しても当該のエラーは出ませんでしたので、何かそちらで問題のある操作をされている可能性が高いと思われますが、それはこちらからは分かりませんので、とにかく細かいミスに注意してみてください。
又、画像ファイル等の指定方法は、「絶対パス」「相対パス」「ルート相対パス」(ルートパス)等がありますので、これは押さえておいてください。
「絶対パス 相対パス ルート相対パス」でWEB検索すると、詳しく解説しているサイトが見付かるかと思います。
HTMLファイルと同じ場所に画像ファイルがあるなら、ファイル名を書くだけで認識されます。これは相対パスです。
No.5
- 回答日時:
> このコンピューターが差出人に識別されることを予防するため画像がブロックされています画像を表示するには、このアイテムを開いて下さい。
これは主にメール画面にて出るメッセージのように思いますが、そうではないでしょうか。
一般的なWEBブラウザ(Microsoft Edge、Internet Explorer、Google Chrome、Firefox等)でそのメッセージが表示されたのでしょうか。
あるいは、Windowsからのメッセージでしょうか。
当該のメッセージの意味は、つまり、「その画像を読み込むと、相手方のサーバー(コンピューター)にアクセスする事になり、あなた(あなたのメールアドレス)が生きている事が相手にバレてしまう可能性があるが、それでもいいか」という意味です。
詳しくは、以下が参考になるかと思います。
https://detail.chiebukuro.yahoo.co.jp/qa/questio …
とりあえず、当該のメッセージは、何のソフトで出たメッセージなのか、どういう操作を行った時に出たのかを補足された方が良いかと思います。
出来れば、例えば、以下のような感じで書いてもらうと分かりやすいです。
---------------------
Windows10のパソコンで、メモ帳を使い、HTMLを書いています。
「~」というコードを書いて、Microsoft Edgeで表示すると、「~」というメッセージが出て、正しく表示されません。
どうしたら良いでしょうか。
---------------------
回答ありがとうございます
HTMLを学ぼうと本を見ながらやったのですが
エディターはAdobe社のBracketでGoogle Chrome、Windows11を使用しました
◆コードを書いてWebに表示されるか確認する段階でプログラムから開く→ Google Chrome
と進めました。
教科書通りやったのに訳のわからない結果が出て頭の中は真っ白です・・
アドバイス頂ければとても助かります
よろしくお願いいたします。
No.4
- 回答日時:
では、試しに、以下をコピーしてから、
テキストに貼り付け、Webサーバーにアップして、表示&クリックしてみましょう。
<a href="//google.com">Google</a>
---------
<a>コードと画像は無関係なので、何をやりたいのか、私や他の回答者さんにもわからないです。
環境問題やセキュリティ問題があるのではないでしょうかねぇ・・・
だから、1つ1つ解決していくべきなので、上記のテキストアンカーで、リンクが動作するか?試すだけです。
回答ありがとうございます
表現に問題があり申し訳ございませんでした、リンクには飛ばすことができたので問題は他にあるかと思います。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS HTMLの条件によって表示方向が切り替わる実装のコードを教えて下さい。 (コードは下記リンクを参照) 1 2022/09/25 14:35
- その他(スマホアプリ・スマホゲーム) アプリをスマホにダウンロード、インストールする方法 3 2022/08/13 11:26
- JavaScript 【GAS】WEBアプリでハイパーリンクを挿入したい 1 2023/03/12 19:20
- ドライブ・ストレージ テレビ録画用の外付けHDDが急に認識されなくなりました。 検索した方法でテレビのコード、USBのコー 4 2022/06/14 00:37
- WordPress(ワードプレス) wordpressでphpを読み込みたい 1 2022/10/30 23:40
- 防犯カメラ・監視カメラ・小型カメラ VHSを高画質な動画ファイルにしたいです。 3 2022/05/06 12:08
- HTML・CSS リンクバナーのHTMLタグ。画像を変えたり、設置位置を変えるとバナー貼付け側はどう見える? 2 2023/02/01 12:01
- その他(データベース) Q&Aフォームを作成したいのですが、どう設計してよいか分かりません、アドバイスお願い致します。 1 2023/07/27 19:04
- Windows 10 フォルダ内の全ての画像を矢印キーでスライドできるようにしたい 1 2022/10/21 12:53
- JavaScript HTML&CSS Javascriptによる動的テーブル 1 2023/03/27 19:51
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
ボタンを押したままにする。
-
拡張子無しで画像を表示したいです
-
ホームページにサウンドの「ON...
-
バナーの貼り方とバナーにリン...
-
画像のアドレスについて
-
リンクの上にマウスカーソルを...
-
背景が透明なリンクボタンで、...
-
画像クリックでクリップボード...
-
フォルダ内の画像をウェブでラ...
-
pngやjsの後ろの英数字の意味は...
-
HTMLでデスクトップの画像がでない
-
HTMLタグで画像が表示されない
-
すいません HTMLです この画像...
-
画像を二枚ずつ表示して、選ん...
-
IMGタグでTIFF画像を表示
-
タイトルバーに画像を入れるHTM...
-
崩れたレイアウトが更新すると...
-
IEでのalt属性ポップアップ表示...
-
リンクとして認識されない
-
画像を入れ替える方法
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ボタンを押したままにする。
-
背景が透明なリンクボタンで、...
-
バナーの貼り方とバナーにリン...
-
HTMLにQRコードを挿入する方法
-
IMGタグでTIFF画像を表示
-
スライドショーの上にロゴマー...
-
pngやjsの後ろの英数字の意味は...
-
タイトルバーに画像を入れるHTM...
-
拡張子無しで画像を表示したいです
-
form以外でのpostってできますか?
-
クリッカブルMAP領域が分かる様...
-
クリックしても、リンクに飛ば...
-
予約語の表示について
-
HTMLでデスクトップの画像がでない
-
崩れたレイアウトが更新すると...
-
カーソルを合わせると文字が出...
-
カウンターのHTMLソースを教え...
-
画像クリックでクリップボード...
-
tifファイルが表示されない
-
IFRAME内に収まるように画像を...
おすすめ情報