HTML CSSのホバーが動作しない

-5

今日、私はアニメーションのアイコンを達成しようとしていましたが、CSSに問題がありました。HTML CSSのホバーが動作しない

.Menu { 
 
    width: 100%; 
 
    height: 50px; 
 
    position: fixed; 
 
    background-color: #35f5ca; 
 
    top: 0; 
 
    left: 0; 
 
} 
 

 
.title { 
 
    font-family: "Sans-Serif"; 
 
    position: fixed; 
 
    top: 1%; 
 
    left: 0; 
 
    vertical-align: middle; 
 
    font-size: 150%; 
 
    color: white; 
 
} 
 

 
.icon:hover { 
 
    width: 45px; 
 
    height: 45px; 
 
    position: fixed; 
 
    right: 0px; 
 
    top: 0px; 
 
    opacity: 1.0; 
 
} 
 

 
.body {}

<div class="Menu"> 
 
    <p1 class="title"> 
 
    <b> 
 
\t Mettu 
 
\t </b> 
 
    <img class="icon" src="images/iconplanet.png" style="transition: all 0.5s; width:40px; height:40px; position:fixed; right: 5px; top: 0.5%; opacity: 0.5;" /> 
 
    </p1> 
 
</div> 
 

 
<div class="body"> 
 

 
</div>

ちょうど私のコードを修正しないでください、と私は間違って何をしたかを教えてください：upcommingコードは、私が言うことができる以上のことを言うだろう。ありがとうございました！

出典

2017-04-07 A Random Dude

-1

CSSにスタイルを追加し、.Menuは

.Menu 
 
    { 
 
    \t width: 100%; 
 
    \t height: 50px; 
 
    \t position: fixed; 
 
    \t background-color: #35f5ca; 
 
    \t top: 0; 
 
    \t left: 0; 
 
    } 
 
    .title 
 
    { 
 
    \t font-family:"Sans-Serif"; 
 
    \t position:fixed; 
 
    \t top: 1%; 
 
    \t left: 0; 
 
    \t vertical-align: middle; 
 
    \t font-size: 150%; 
 
    \t color: white; 
 
    } 
 
    .icon 
 
    { 
 
     transition: all 0.5s; 
 
     width:40px; 
 
     height:40px; 
 
     position:fixed; 
 
     right: 5px; 
 
     top: 0.5%; 
 
     opacity: 0.5; 
 
    } 
 
    .icon:hover 
 
    { 
 
    \t width:45px; 
 
    \t height:45px; 
 
    \t position:fixed; 
 
    \t right: 0px; 
 
    \t top: 0px; 
 
    \t opacity: 1.0; 
 
    } 
 
    .body 
 
    { 
 
    \t 
 
    }

<html> 
 
    <head><title>Mettu</title> 
 
    
 
    <head> 
 
    <body> 
 
    <div class="Menu"> 
 
    <p1 class="title"> 
 
    \t <b> 
 
    \t Mettu 
 
    \t </b> 
 
    \t <img class="icon" src="images/iconplanet.png" /> 
 
    </p1> 
 
    </div> 
 

 
    <div class="body"> 
 

 
    </div> 
 

 
    <?php 
 
    //Menu 
 

 

 
    //Menu's Brain 
 

 

 
    ?> 
 

 
    </body> 
 

 
    <html>

を.menuする必要があります

出典

2017-04-07 07:33:04

スタイル属性は、任意のルールセットでmore specificです。

ルールセットに同じプロパティーが.icon:hoverであり、スタイル属性にある場合は、スタイル属性の値が勝ちます。

style属性は使用しないでください。

出典

2017-04-07 07:29:56 Quentin

HTML CSSのホバーが動作しない

答えて

関連する問題