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

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

新規登録して質問してみよう
ただいま回答率
85.46%
ポインタ

ポインタはアドレスを用いてメモリに格納された値を"参照する"変数です。

HTML

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

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

1回答

565閲覧

aタグをつけてないのにポインタが反応する

RYO.K

総合スコア46

ポインタ

ポインタはアドレスを用いてメモリに格納された値を"参照する"変数です。

HTML

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

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2020/02/18 11:01

サブトピック3以降なのですが題の通りaタグをつけてないのに画像の上や何も無いところでもポインタが反応してしまいます。更にこの写真の画像の下にある文字もポインタが当たった瞬間に下線が引かれてしまします。

HTML

1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <link rel="stylesheet" type="text/css" href="test.css"> 8 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"> 9 <title>模写1</title> 10</head> 11<body> 12 <div class="container-fluid"> 13 <div class="row justify-content-between"> 14 <!--##############header##################--> 15 <div class="col"> 16 <a href="#"> 17 <img class="col-auto mt-4" src="logo.jpeg" a href="#" height="30px " width="30px "> 18 </a> 19 </div> 20 <div class="col-auto"> 21 <ul class="row"> 22 <li class="col month">予想月収</li> 23 <li class="col"><h4>¥151,550</h4></li> 24 <li class="button"><a href="#" class="b2">はじめる</a></li></ul> 25 </div> 26 27 </div> 28 <!--##############人数などの検索欄##################--> 29 <div class="box"> <div class="topic"> 30 31 <h1 class="col topic2">Airbnbホストになって、暮らしをレベルアップ</h1> 32 <p >どれくらいの収入が見込めるかチェック</p> 33 <input type="text" placeholder="ロケーション" name="location" class="locate"> 34 <select id="rent" name="rent" class="custom-select sources"> 35 <option value="all">まるまる貸切</option> 36 <option value="only">個室</option> 37 <option value="share">シェアルーム</option> 38 </select> 39 40 <select id="howmany" name="howmany" class="custom-select"> 41 <option value="1">ゲスト1人</option> 42 <option value="1">ゲスト2人</option> 43 <option value="1">ゲスト3人</option> 44 <option value="1">ゲスト4人</option> 45 <option value="1">ゲスト5人</option> 46 <option value="1">ゲスト6人</option> 47 <option value="1">ゲスト7人</option> 48 </select> 49 <h1 class="m">¥80,289<span class="a">月あたり</span></h1> 50 <buttom type="buttom" class="btn btn-danger">はじめる</buttom> 51 52 </div></div> 53 <!--##############サブトピック##################--> 54 <div class="subtopic"> 55 <div class="row"> 56 <div class="col-4"> 57 <h3>Airbnbでホストするこれだけの理由</h3> 58 <p>どんなお家やお部屋でも、Airbnbなら簡単かつ安全にシェアでき、世界中の旅好きな仲間とつながれます。 59 予約可能日から料金、ハウスルール、ゲストとの交流程度まで、すべて自分で決めることができます。</p> 60 </div> 61 <div class="col-4"> 62 <h3>Airbnbならホストも安心安全</h3> 63 <p>万一に備えるUS$1,000,000の財物補償、US$1,000,000の賠償責任保険が全予約に自動付帯。 64 ホストのみなさまと建物・家財の安全をお守りするため全力で取り組んでいます。<br><br> 65 66 <a href="#">ホストを守るAirbnbの仕組みをチェック</a></p> 67 </div> 68 <div class="col-4"> 69 <h3>ゲストは認証済みです</h3> 70 <p>Airbnbは全ゲストを対象に、予約の前に一定の情報(認証済み電話番号、メールアドレスなど)の提供を求めています。 71 さらにご希望の場合は、ほかのホストからの推薦、認証済みIDの取得を追加要件として求めることもできます。</p> 72 </div> 73 </div> 74 <!--##############サブトピック2##################--> 75 <div class="three"> 76 <h2>3ステップでホスティング</h2> 77 <div class="row"> 78 <div class="col-4"> 79 <p class="one">1</p> 80 <h3>無料でお部屋を掲載</h3> 81 <p class="sentence">共有のリビングルームから別荘に至るまで、どんなスペースでも登録料なしで共有しましょう。</p> 82 </div> 83 <div class="col-4"> 84 <p class="second">2</p> 85 <h3>ホスティング方法を設定</h3> 86 <p class="sentence">スケジュール、料金、ゲストへの要件をご自身で選択しましょう。 お困りの際にはいつでもサポートいたします。</p> 87 </div> 88 <div class="col-4"> 89 <p class="three">3</p> 90 <h3>はじめてのゲストが来ます!</h3> 91 <p class="sentence">リスティングが掲載されると、条件にかなったゲストから連絡を受けとることができます。 ゲストの到着前に質問があればメッセージを送信できます。<br><br> 92 93 <a href="#">ホストをはじめる方法をチェック<a</p> 94 </div> 95 </div> 96 </div><br><br><br><br><br><br><br><br> 97 <!--##############サブトピック3##################--> 98 <div class="four"> 99 <img src="sub.jpeg"> 100 <img src="quotemarks.jpeg" class="quote"> 101 <div class="main"> 102 <h3>ホスティングの収入で、キッチンを新調したり、他の改装費用の一部を賄うことができました</h3> 103 104 </div> 105 106 </div> 107 108 109 </div> 110 111</body> 112</html>

CSS

1<!--##############header##################--> 2.logo{margin:25px 30px 30px 5px;} 3ul{list-style: none;} 4li{ margin: 30px 0px;} 5.button{border: solid; 6 color: white; 7 background-color: orangered; 8 border-radius: 8px; 9 margin-right: 70px; 10 padding: 6px 14px 6px 12px;} 11.b2:hover{text-decoration: none; color: white;} 12.b2{color: white; padding-left: 5px;} 13 14/**************************** 15人数などの検索欄 16****************************/ 17 18.box{background-image: url('main.jpeg'); 19 border: solid white; 20 background-repeat: no-repeat; 21 background-size: cover; 22 height: 600px; 23 margin-bottom: 60px; 24 25} 26.month{margin-left: 110px; 27 margin-top: 35px;} 28.topic{float: right; 29 border: solid white; 30 background-color: white; 31 border-radius: 4px; 32 box-shadow:0 12px 40px rgba(0, 0, 0, .12); 33 max-width: 460px; 34 margin: 78px 92px 0 0; 35 padding: 25px 20px; 36 } 37 38.topic h1{font-size: 40px; 39 line-height: 40px; 40 letter-spacing: -0.6px; 41 } 42.topic input{width: 400px; 43 height: 40px; 44 } 45#rent{width: 235px; 46 height: 40px; 47 margin-top: 10px; 48 } 49#howmany{height: 40px; 50 width: 150px; 51 margin-left: 10px; 52 margin-top: 10px;} 53.a{font-size: small; 54 font-weight: medium; 55 letter-spacing: 1px; 56margin-left: 5px;} 57.m{margin-top: 25px;} 58.topic p{margin-top: 25px;} 59.topic buttom{width: 400px; 60 height: 50px; 61 padding-top: 10px;} 62/**************************** 63サブトピック 64****************************/ 65.subtopic{max-width: 1030px; 66 margin: 0 auto; 67 line-height: 1.25em;} 68.subtopic h3{max-width: 320px; 69 margin-bottom: 20px; 70 color: #484848; 71 } 72.subtopic p{max-width: 320px;} 73.subtopic p{color: gray; 74 line-height: 1.8em; 75 font-size: 17px;} 76/**************************** 77サブトピック2 78****************************/ 79.three h2{font-size: 60px; 80 line-height: 64px; 81 letter-spacing: -2.5px; 82 font-weight: 700; 83 color: #333333; 84 text-align: center; 85 position: relative; 86 margin: 120px; 87 } 88.three h2:before { 89 content: ''; 90 position: absolute; 91 left: 50%; 92 top: -20px; /*下線の上下位置調整*/ 93 display: inline-block; 94 width: 70px; /*下線の幅*/ 95 height: 2px; /*下線の太さ*/ 96 -moz-transform: translateX(-50%); 97 -webkit-transform: translateX(-50%); 98 -ms-transform: translateX(-50%); 99 transform: translate(-50%); /*位置調整*/ 100 background-color: #666666; /*下線の色*/ 101 102 } 103.three h3{font-weight: bolder;} 104.three .one{border: solid lightseagreen; 105 background-color: lightseagreen; 106 color: white; 107 width: 40px; 108 height: 40px; 109 text-align: center; 110 padding-top: 2px; 111 border-radius: 25px;} 112.three .second{border: solid lightseagreen; 113 background-color: lightseagreen; 114 color: white; 115 width: 40px; 116 height: 40px; 117 text-align: center; 118 padding-top: 2px; 119 border-radius: 25px;} 120.three .three{border: solid lightseagreen; 121 background-color: lightseagreen; 122 color: white; 123 width: 40px; 124 height: 40px; 125 text-align: center; 126 padding-top: 2px; 127 border-radius: 25px;} 128.three .sentence{line-height: 25px;} 129/**************************** 130サブトピック3 131****************************/ 132.four img{width: 550px; 133 height: 480px; 134 cursor: default;} 135.four .quote{width: 60px; 136 height: 50px; 137 margin-bottom: 200px; 138 margin-left:110px ;} 139 140.four h3{font-size: 37px; 141 font-weight: 500; 142 } 143 144

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

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

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

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

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

m.ts10806

2020/02/18 11:22

<!--##############header##################--> 上記、本当にCSSファイルの中に入ってますでしょうか
RYO.K

2020/02/18 11:47

<img src="sub.jpeg"> <img src="quotemarks.jpeg" class="quote">のcursorをデフォルトにするも画像部分だけデフォルトになり空白の部分はポインタになり文字にも下線がやはり表示されてしまいます。 空白の部分はポインタになり文字にも下線が表示される事についても調べましたが解決できませんでした
m.ts10806

2020/02/18 12:08 編集

htmlint通してみると良いです。構文チェックサービス。 もちろん・・・構文チェック機能のあるエディタ使うのが最も良いのですけど。
RYO.K

2020/02/18 12:17

構文チェックサービス使ってみますありがとうございます!
guest

回答1

0

ベストアンサー

<a href="#">ホストをはじめる方法をチェック<a</p> ← こういう構文エラーがあるからでしょう。

投稿2020/02/18 12:05

kei344

総合スコア69458

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

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

RYO.K

2020/02/18 12:17

解決しましたありがとうございます!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.46%

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

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

質問する

関連した質問