您好,登錄后才能下訂單哦!
這篇文章主要介紹HTML改變圖片大小的方法,文中介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們一定要看完!
我們改變圖片的大小有兩種方法:一種是在HTML標簽內更改寬度和高度;另一種是使用CSS樣式控制width和height屬性。
我們先來看HTML標簽內更改圖像寬度和高度
直接在圖片img標簽中使用width和height屬性即可控制圖片寬和高。
代碼如下
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <img src="img/tupian.jpg" width="150" height="150"> </body> </html>
效果如下(原圖為1072x768px):
我們可以直接在圖片標簽設置width和height,看起來會很直觀。
接著我們來看使用CSS樣式控制width和height屬性
我們用同一張圖片,代碼如下
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> img{ width: 150px; height: 150px; } </style> </head> <body> <img src="img/tupian.jpg" > </body> </html>
效果如下:圖片也變為了150x150px
以上是HTML改變圖片大小的方法的所有內容,感謝各位的閱讀!希望分享的內容對大家有幫助,更多相關知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。