css懸停未執行

我想讓圖像在懸停時略微增長。我知道這很簡單，但我已經尋找了一個比其他例子好一個小時，似乎無法弄清楚我缺少的東西。我很感激幫助。這些圖像保存到我的電腦。css懸停未執行

範圍

<link type="text/css" rel="stylesheet" href="stylesheet.css"/> 
<embed src="73797^alarmclock.mp3"; autostart="true"; loop="true"; hidden="true";/> 

<body> 

    <img src ="alarm clock2.jpg"/> 

    <p> Pulling the sheets into my body, I begin to sink back into the bed... 
      uggh... my alarm clock... time to get up.. 

     <img style = "position:absolute; top:300px; right: 0px; z-index:1" 
      src="computer.jpg"/> 

     <IMG ID="grow" STYLE= "position:absolute; TOP:1157px; LEFT:599px; 
      WIDTH:47px; z-index:2; HEIGHT:47px" SRC="icon2.gif"/> 

</body> 

</html>

這裏是stylesheet.css中

#grow:hover { 
width: 100px; 
height: 150px; 
}

來源

2013-08-29 user2719596

不要使用內聯樣式。你的問題是內聯樣式比CSS更優先。把它們放在'stylesheet.css'中，它就可以工作。 – Itay

爲什麼你使用內聯樣式和混亂的CSS。 – Sir

和不在引號中的所有內容都應該是小寫。你用微軟的話創造了這個嗎？ – PlantTheIdea

的內聯樣式這在HTML元素聲明具有比其它CSS規則更高的優先級。因此，考慮制定規則!important或將內聯樣式移出。

無論如何，!important規則不建議定期使用。所以，你有更好去除您的內嵌樣式，並把它們放在.css文件（或內<head>至少<style>元素）

來源

2013-08-29 18:08:59

定期使用！非常不宜使用！尤其是當他可以通過停止使用內聯樣式來修復它時。 – Itay

我同意你的意見，我只是給他所有可用的選項。我想我應該把它包括在我的回答:) –

謝謝你們。我得到了它的工作。這個東西很新。沒有更多的內聯樣式。 – user2719596

嘗試這種風格

#grow:hover { 
width: 100px !important; 
height: 150px !important; 
}

因爲你已經寫了內嵌樣式。爲了覆蓋它，您需要將!important添加到樣式中。也嘗試以小寫字母寫入html，並避免不必要的空格。

你能做的最好的事情是避免內聯樣式和風格寫如下：

#grow 
{ 
    position:absolute; 
    top:1157px; 
    left:599px; 
    width:47px; 
    z-index:2; 
    height:47px 
} 

#grow:hover 
{ 
    width: 100px; 
    height: 150px; 
}

來源

2013-08-29 18:09:39

這會起作用，但經常使用'！important'是非常不明智的，尤其是當他可以通過停止使用內聯樣式來修復它時。 – Itay

內聯樣式在CSS我相信有優先權。

更改您的CSS和HTML如下：

#grow { 
    position:absolute; 
    top:1157px; 
    left:599px; 
    width:47px; 
    z-index:2; 
    height:47px 
} 
#grow:hover { 
    width: 100px; 
    height: 150px; 
}

HTML：

<IMG ID="grow" SRC="icon2.gif"/>

來源

2013-08-29 18:10:24 Sir

css懸停未執行

回答

相關問題