Html中如果要設(shè)置圖片的高度，我們有兩種方法可以達(dá)到目的，下面由學(xué)習(xí)啦小編為大家整理了html設(shè)置圖片高度的方法，希望對大家有幫助!

　　html設(shè)置圖片高度

　　HTML中設(shè)置圖片的長度和寬度有兩種方法：HTML屬性直接設(shè)置、css樣式設(shè)置，現(xiàn)在一般設(shè)置樣式都是使用css來設(shè)置。

　　設(shè)置圖片高度方法一、HTML方法設(shè)置圖片寬度高度

　　1、可以直接使用HTML的元素的屬性來設(shè)置圖片的寬高，代碼如下：

　　<img src="test.jpg" height="200px">

　　2、同理也可以設(shè)置width屬性，不建議同時設(shè)置防止圖片變形。

　　設(shè)置圖片高度方法二、css方法設(shè)置圖片的寬度和高度

　　1、可使用css代碼設(shè)置圖片的寬高的代碼如下：

　　<img src="test.jpg" style="width:200px;height:200px;">

　　補(bǔ)充：使用百分比值設(shè)置高度和寬度

　　使用 width 屬性的最后一個技巧是使用百分比值來代替像素的絕對值。這將使瀏覽器按照與瀏覽器顯示窗口的一定比例來縮放圖像。因此，如果要創(chuàng)建一個寬度與顯示窗口寬度相同，高度為 30 個像素的彩色橫條，可以這樣實(shí)現(xiàn)：

　　<img src="/i/ct_1px.gif" width="60%" height="30px" />

　　當(dāng)文檔窗口的大小改變時，這個圖像的大小也會隨之改變

　　提示：如果提供了一個百分比形式的 width 值而忽略了 height，那么不管是放大還是縮小，瀏覽器都將保持圖像的寬高比例。這意味著圖像的高度與寬度之比將不會發(fā)生變化，圖像也就不會發(fā)生扭曲。

　　請看下面的 HTML：

　　<img src="/i/ct_1px.gif" width="20%" />

　　也就是說，如果只設(shè)置圖像 ct_1px.gif 的 width 屬性的百分比值，會得到一個矩形圖像(這是因?yàn)樵嫉?ct_1px.gif 就是一個只有 1px 寬和高的矩形)：