2017-05-01 17 views
1

私はCSSで最も基本的なことの一つをしようとしています。私のボタンのホバー状態ですが何らかの理由で何もしません!何が起こっているのですか?ホバー状態が動作しないCSS

仕事情報

<label>Your Note:</label><br/> 
     <input type="text" id="noteTitle" placeholder="Note Title..."><br/> 
     <textarea id="note" placeholder="Add Content..."></textarea> <br/> 
     <button onclick="createNote()" class="btnStyle">Create Task</button> 



<br/> <br/> 
<label>Note Id:</label><br/> 
    <input type="text" id="noteId" placeholder="Type Note Id..."> <br/> 
<div class="align"><button onclick="deleteNote()" class="btnStyle">Delete Task</button></div> 

    <div id="noteTitlesId"></div> 

     <div class="align"><button onclick="getNoteTitles()" class="btnStyle">Get Task Titles</button></div> 
     <div class="align"> <button onclick="updateNote()" class="btnStyle">Update note</button></div> 

     </div> 

それのための私のCSS:

.btnStyle { 
    border: 0.5px solid gray; 
    border-radius: 5px; 
    background-color: transparent; 
} 



.btnStyle :hover { 
    background-color: #eb9356; 
    color: #ffff; 
} 
+4

「.btnStyle:hover」 –

+0

それはうまく動作しないと思われます。私はそれを逃したとは信じられません。あなたは人生の節約者です。 – Catalina

+1

あなたはあなたが何をしたのか正確に知っています。 2番目のセレクタを 'descendant of'にします。効果的にあなたが持っているのは、被告が「btnStyle」を捨てたときです。このスタイルを子孫に適用します。 –

答えて

0

.btnStyle の間にスペースを与えてはいけない:

:ホバーはそのための1つのスペースとのコードは以下であることを取り除きます
.btnStyle:hover { 
} 
関連する問題