img标签对图片的解析,imgsrc怎么改变图片大小

首页 > 实用技巧 > 作者:YD1662024-01-19 13:29:47

1-直接上img标签即可

img标签是一个标签,不设置宽高默认会以原尺寸显示

1-1没有宽高的图片显示的是图片本身的宽高,

下图是代码和浏览器显示:

img标签对图片的解析,imgsrc怎么改变图片大小(1)


1-2 给img添加了宽高后,调整后是改变的是图片的显示;

下图是代码和浏览器显示:

img标签对图片的解析,imgsrc怎么改变图片大小(2)

2-div标签 背景图片

需要设置div的宽高,因为背景图片只是装饰的css样式,不能撑开div标签。

下图是代码和浏览器显示:

2-1 是有高宽的盒子显示

img标签对图片的解析,imgsrc怎么改变图片大小(3)

2-2 是没有宽高的盒子

下图是代码和浏览器显示:

当没有宽高数据时,盒子就没有被撑开,所以没有显示。

img标签对图片的解析,imgsrc怎么改变图片大小(4)

3-按照重要程度区别

3-1理解img和background的本质不同

img叫做 插入图;

background又叫做 背景图;


3-2 使用的方式

img在工作用作比较重要的图片,比如:宣传图,首图,海报图,产品图必须是img;

背景图片,修饰图,装饰性,美化用的图片;

(仅为个人自学的一点点思考,如有错漏,欢迎留言指正)

栏目热文

文档排行

本站推荐

Copyright © 2018 - 2021 www.yd166.com., All Rights Reserved.