調整一個圖像的大小，在一個格內

我想調整一個ID爲「homeLink」的div。我將首先聲明自己是CSS的一員，並且我正在尋找骨子，只是因爲我知道這很簡單。我也確信它會解釋一些基本的CSS使用，我不明白，所以任何指向鏈接，這將有助於讚賞。調整一個圖像的大小，在一個格內

我看到this後，但我不知道我明白爲什麼我不能做我想做的事。我做了RTFM（我能找到的那個），但我仍然不明白。我想避免爲此調用js，但也許我不需要不管。

感謝您的幫助;代碼如下。

<html> 
     <head> 
      <style> 
       #homeLink { 
        /*this doesn't work */ 
        // width: 50%; 
        position:absolute; 
        left:10px; 
        top: 770px; 
       } 

       /* nor does this */ 
       #homeLink a { 
        width: 10%; 
       }  
      </style> 
     </head> 

     <body> 
      <div id="homeLink"><a href="http://www.someurl.com"><img src="homebutton.png"/></a></div> 
     </body> 
    </html>

來源

2012-05-06 jml

<img class="image" src="homebutton.png"/>

然後在你的CSS樣式它：

.image { 
height: 200px; 
width: 300px; 
}

來源

2012-05-06 19:41:47

非常感謝。嘿，你可以向我解釋什麼時候使用課程，何時使用ID？例如，我試圖在這種情況下使用一個id與img標籤，但它不起作用。 – jml

一個類是每當你失去某些東西時（認爲它像一個類），其中一個id是唯一的東西。如果我們把它放在學校的角度來看，你會有一班同學都屬於同一個班級，所以他們可能有相似的禮節，但他們也都有獨特的屬性，因此他們有一個ID。因此，他們將屬於這個階層，並繼承一些禮儀，但也有一個個人唯一的ID。 –

由於@Mr d說，你需要調整圖像本身不股利。

這一部分：

#homeLink a { 
width: 10%; 
}

是在CSS的條款a其實錯了沒有width財產。您可以預格式化使用CSS某些行爲或鏈接，如下劃線whilie懸停鼠標放在鏈接，改變已訪問鏈接的顏色：

a.hover {text-decoration: underline} 
a.visited {color: #999999}

來源

2012-05-06 19:50:35 darf

爲了增加這個好的解釋，改變#homeLink a的高度就像做一個更大的房子，你可以把它做得像你想要的那麼大，但它裏面的冰箱不會改變。爲了做到這一點，你必須讓冰箱變得更大。在這裏它的原理是相同的，你使容器更大，但不是實際的圖像。 –

藍色和金色：非常感謝你的精彩解釋。 – jml

這一點，因爲在div容器形象，可能比集裝箱更大的不調整widht and height

您可以通過向容器div添加隱藏溢出來實現此目的。
，或者使用下面的CSS

#homeLink,#homeLink a img { 

        width: 50%; 
        position:absolute; 
        left:10px; 
        top: 770px; 
       } 
or 

#homeLink{ 
     width:50%; 
     position:absolute; 
     left:10px; 
     top:770px; 
     overflow:hidden; 
}

來源

2012-05-06 19:52:17 Yasir

我發現這與我所要求的相關非常複雜。這裏可能有很多信息可供探索，但我認爲它不像其他用戶的信息那樣多。 – jml

調整一個圖像的大小，在一個格內

回答

相關問題