Home > Article > Web Front-end > How to enlarge pictures in html
How to enlarge pictures in html
- WBOYOriginal
- 2021-12-23 14:24:3017123browse
Method: 1. Use the width and height attributes to enlarge the image, the syntax "
"; 2. Use the style and transform attributes to enlarge the image, the syntax "
".
The operating environment of this tutorial: Windows 10 system, HTML5 version, Dell G3 computer.
How to enlarge pictures in html
There are two ways to enlarge pictures in html
One is to reset The height and width of the picture element, this time the width and height attributes are used.
The second method is to use the style attribute and transform attribute to set the magnification of the picture element.
The example is as follows:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<img src="1115.How to enlarge pictures in html" style="max-width:90%"How to enlarge pictures in html" >
<img src="1115.How to enlarge pictures in html" style="max-width:90%" alt="How to enlarge pictures in html" >
</body>
</html>Output result:
Recommended tutorial: "html video tutorial"
The above is the detailed content of How to enlarge pictures in html. For more information, please follow other related articles on the PHP Chinese website!