inline-block img标签
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>无标题文档</title>
<style>
</style>
</head>
<body>
<img src="1.png" alt="cat"/>
<img src="1.png" alt="cat"/>
</body>
</html>
运行结果显示：
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>无标题文档</title>
<style>
img{width:60px;}
</style>
</head>
<body>
<img src="1.png" alt="cat"/>
<img src="1.png" alt="cat"/>
</body>
</html>
运行结果显示：
结果分析：对于image图片如果只设定宽或高样式就会进行等比缩放
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>无标题文档</title>
<style>
img{width:60px;height:100px;}
</style>
</head>
<body>
<img src="1.png" alt="cat"/>
<img src="1.png" alt="cat"/>
</body>
</html>
运行结果：
结果分析：img标签支持宽高属性