基础使用
1.img
<img src="/i/eg_tulip.jpg" alt="上海鲜花港 - 郁金香" />
alt:规定图像的替代文本。
src:规定显示图像的 URL。
基础width,height
2.background-image:url()
background-image: url(bgimage.gif);
background-color: #000000;
//默认值 none
//可选值 inherit 继承父级
//url() 图片地址
// 很多属性都具有inherit
--background-image
属性为元素设置背景图像。
元素的背景占据了元素的全部尺寸，包括内边距和边框，但不包括外边距。
默认地，背景图像位于元素的左上角，并在水平和垂直方向上重复。
提示：请设置一种可用的背景颜色，这样的话，假如背景图像不可用，页面也可获得良好的视觉效果。
由于background-images 是背景属性的一个属性，即背景属性设置背景图像
eg:
1.background-size:;
设置背景图像的大小
2.background-position:;
设置背景图像的位置，有两个参数，水平和垂直方向的距离 ...此处只写了我最常用的属性，其他的都可以去MDN查看
个人使用
img background-image与响应式
1.img 标签可以只设置一个宽度，他的高度则会根据高度进行自适应
当屏幕大小变化时，若设置的百分比，则img则会随着浏览器窗 的变化自动适应大小
2.使用bgi标签必须给外层的盒子一个宽高，这样当前盒子才会显示，即bgi无法撑起父级的高度
3.写轮播图时，两种方法均可以
优缺点
使用bg时，对响应式更加友好，可以直接media屏幕宽度之后，改变当前盒子的bgi, 而使用img时，若想改变当前图片的src可以获取dom改变，或者写多个img标签，通过媒体查询控制不同img标签的显示与隐藏，达到响应的效果。
