使用HTML设置图像的长度和宽度

作者: Roger Morrison
创建日期: 18 九月 2021
更新日期: 1 七月 2024
Anonim
CSS 快速简明教程 | 盒子模型/文档流/定位/布局/响应式设计
视频: CSS 快速简明教程 | 盒子模型/文档流/定位/布局/响应式设计

内容

此WikiHow解释了如何使用HTML(超文本标记语言)设置图像的高度和宽度。

  • “宽度”表示图像的宽度,以像素为单位。
  • “高度”表示图像的高度,以像素为单位。
  • 在HTML 4.01中,高度可以以像素或百分比定义。在HTML5中,该值必须以像素为单位。

  1. 编辑要为其显示图像的文件。 例如:default.html
  2. 将此行添加到脚本中
    • img src =“ imagefile.webp” alt =“图像”高度=“ 42”宽度=“ 42”>
    • src是图像的文件路径。
    • alt是您赋予图片的标签。
  3. 根据需要替换“ height”和“ width”,例如,height =“ 19” width =“ 20”
  4. 保存文件并使用任何浏览器打开文件以查看效果。 所有主要浏览器(例如Google Chrome,Safari,Mozilla Firefox,Opera,Internet Explorer等)都支持“ width”属性。

尖端

  • 始终指定图像的高度和宽度属性。如果设置了高度和宽度,则在页面加载时将保留图像所需的空间。但是,如果没有这些属性,浏览器将不知道图像的大小,并且无法为其保留适当的空间。这样的效果是页面布局在加载过程中(图像加载时)会发生变化。
  • 通过调整大图像的高度和宽度来减小大图像的大小将迫使用户下载大图像(即使页面上看起来很小)。为避免这种情况,您需要先使用程序重新缩放图像,然后再将其放置在页面上。