如何在 HTML 中更改图片大小

在 HTML 中，我们可以通过以下不同的方式改变任何图片的大小

1. 使用 HTML 标签
2. 使用内联样式属性
3. 使用内部 CSS

使用 HTML 标签

注意：HTML 5 不支持 <img> 的 height 和 width 属性，因此我们必须使用内联样式属性和内部 CSS 选项来改变图片或图像的大小。

如果我们想使用 Html 标签来改变文档中要显示在网页上的图片大小，我们必须遵循以下步骤。使用这些步骤，我们可以轻松地改变图片大小

步骤 1： 首先，我们必须在任何文本编辑器中输入 Html 代码，或打开要改变图片大小的现有 Html 文件。

步骤 2： 现在，将光标放在 img 标签内。然后，我们必须使用 img 标签的 height 和 width 属性来改变图片的大小。所以，我们必须输入这些属性

步骤 3： 最后，我们必须保存 Html 文件并运行它。

上述 HTML 代码的输出显示在以下屏幕截图中

使用内联样式属性

如果我们想使用内联样式属性来改变要显示在网页上的图片大小，我们必须遵循以下步骤。使用这些步骤，我们可以轻松地改变图片大小。

步骤 1： 首先，我们必须在任何文本编辑器中输入 Html 代码，或打开要使用样式属性来改变图片大小的现有 Html 文件。

步骤 2： 现在，将光标放在要改变大小的图片的 img 标签内。然后，我们必须在 src 属性之后输入 style 属性。然后，我们必须在 style 属性中输入 width 和 height 属性，如下图所示

步骤 3： 最后，我们必须保存 Html 文件并运行它。

上述 HTML 代码的输出显示在以下屏幕截图中

使用内部 CSS

如果我们想使用 内部样式表 来改变要显示在网页上的图片大小，我们必须遵循以下步骤。使用这些步骤，我们可以轻松地改变任何图片的大小。

步骤 1： 首先，我们必须在任何文本编辑器中输入 Html 代码，或打开要使用内部 CSS 来改变图片大小的现有 Html 文件。

步骤 2： 现在，我们必须将光标放在 Html 文档的 head 标签中，然后像下面的块中所示，在 <style> 标签内定义样式。然后，在 id 选择器中输入 width 和 height 属性。

步骤 3： 现在，我们必须在要改变大小的图片的 img 标签中输入 id

步骤 5： 现在，我们必须保存 Html 文件并运行该文件。以下截图显示了上述 Html 代码的输出