Home >Web Front-end >Front-end Q&A >How to change the height and width of an image with css

How to change the height and width of an image with css

青灯夜游Original: 2022-01-20 15:17:575699browse

In CSS, you can use the width and height attributes to change the height and width of an image. You only need to add the "width: width value; height: height value;" style to the image element. The width attribute sets the width of the element, and the height attribute sets the height of the element.

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

In CSS, you can use the width and height attributes to change the height and width of an image.

The width attribute can set the width of the element, and the height attribute can set the height of the element.

Example:

<!DOCTYPE html>
<html>
	<head>
		<style>
			.img1 {
				width: 400px;
				height: 400px;
			}
		</style>
	</head>
	<body>

		<p>原图片宽度:200px，高度：200px</p>
		<img  src="img/1.jpg" alt="How to change the height and width of an image with css" >
		<p>使用css设置宽度为:400px，高度为：400px</p>
		<img  class="img1" src="img/1.jpg" alt="How to change the height and width of an image with css" >
	</body>
</html>

How to change the height and width of an image with css

(Learning video sharing: css video tutorial)

The above is the detailed content of How to change the height and width of an image with css. For more information, please follow other related articles on the PHP Chinese website!

html5 css css3

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：What is the css statement to convert an inline element to a block elementNext article：What is the css statement to convert an inline element to a block element

See more

How to change the height and width of an image with css

Related articles