調整圖像大小

-2

StackOverFlow。我是新手，我有一個問題。希望有人能幫助我。我想知道如何從這個驚人的Tutorial調整圖像大小。我有我自己的網站，懸停效果工作得很好，但我不知道如何調整圖像大小。根據上面發佈的網站上的代碼，我想請求您的幫助。您的答案將不勝感激！調整圖像大小

來源

2014-07-18 Stefan Alex

http://stackoverflow.com/help/how-to-ask – Blazemonger

調整大小通常是服務器端事務。根據你有什麼後端，有很多工具。調整大小可以在瀏覽器中完成，但您必須考慮不支持畫布等功能的舊版瀏覽器。如果你只是想顯示一個不同大小的圖像，那麼CSS就是你的朋友。 – Graham

用圖的標準是33,33％

<figure class="effect-lily"> 

    <img alt="img01" src="img/1.jpg"></img> 
    <figcaption></figcaption> 

</figure> 

.grid figure { 
    width: 33.333%; 
}

如果此屬性更改爲例如50％，你將有每行2個圖像。在這個例子中，它位於第22行的css/component.css下。

來源

2014-07-18 13:13:42

非常感謝。你是對的。問題解決了！ –

讓我看看我是否理解你的問題。

每個圖像容器是一個HTML數字標籤。所以要調整圖像大小，你真的需要調整它的容器大小。

添加到這一點你的CSS圖中選擇

width: 200%;

如果想要另一個尺寸下，只是玩的價值=）。

來源

2014-07-18 13:05:56

你可以嘗試像下面在HTML

<img class="myImageClass" src="myImg.png >

，然後執行圖像的縮放在你的CSS

.myImageClass { width: x; height: y; }

其中x和y是你新的圖像尺寸。

作爲說明，您應該只以這種方式降低圖像的尺寸，而不要增加圖像的尺寸。

來源

2014-07-18 13:07:58

我假定這是例子<img src="img/1.jpg" alt="img01"/>

如果是的話，我建議你改變它，以便像<img src="img/1.jpg" Class="Image1" alt="img01"/>

然後在你的CSS添加

.Image1{ 
Width:*your chosen width, I would recommend % as the other widths are using that* 
}

我建議你看一下http://www.w3schools.com/cssref/pr_dim_width.asp 它提供了很多有用的幫助或https://developer.mozilla.org/en-US/docs/Web/CSS（搜索右上角你要找的東西）

來源

2014-07-18 13:11:38 ByronMcGrath

調整圖像大小

回答

相關問題