如何在 HTML 页面中使用图像高度和宽度属性?
HTML代表超文本标记语言。超文本定义了在线页面之间的链接。它用于定义标签内定义网站结构的文本文档。这种语言用于对文本进行注释,以便机器可以了解它并相应地操作文本。大多数标记语言(例如 HTML)是人类可读的。该语言使用标签来定义必须对文本进行的操作。
要在 HTML 页面中添加图像,请使用 标签。有了这个,我们需要使用图像的属性的宽度和高度(以像素为单位)。指定这两个属性。
句法:
属性:
- src: src代表源。每个图像都有一个src属性,它告诉浏览器在哪里可以找到要显示的图像。提供的图像的 URL 指向图像的存储位置。
- alt:如果图像无法显示,则alt属性充当图像的替代描述。 alt属性的值是用户定义的文本。
设置图像的宽度和高度:宽度和高度属性用于指定图像的宽度和高度。默认情况下,属性值以像素为单位指定。
句法:
笔记:
- px:像素 -像素(1px = 1in 的 1/96)
- in:英寸 -英寸(1in = 96px = 2.54cm)
- pt:点 -点(1pt = 1/72 of 1in)
示例 1:一个高度为 600 像素,宽度为 500 像素的图像。 width属性指定图片的宽度,以磅为单位。
HTML
Welcome To GFG
Image with width and height in points
HTML
Welcome To GFG
img tag with width and height attribute
HTML
Setting width and height
attribute of image
Image is inserted using width and
height attribute in pixels.
Height of this image is 250 pixels
Width of this image is 250 pixels
Image is inserted using width and
height attribute in points.
Height of this image is 50 points
Width of this image is 35 points
输出:
示例 2:另一个示例显示宽度和高度属性的使用。我们提到宽度为 450 像素,高度为 220 像素。
HTML
Welcome To GFG
img tag with width and height attribute
输出:
示例 3:另一个 HTML 程序显示使用具有宽度和高度属性的 标记。在这段代码中,我们将高度和宽度的值设为 250 像素。
HTML
Setting width and height
attribute of image
Image is inserted using width and
height attribute in pixels.
Height of this image is 250 pixels
Width of this image is 250 pixels
Image is inserted using width and
height attribute in points.
Height of this image is 50 points
Width of this image is 35 points
输出: