当前位置: 移动技术网 > IT编程>网页制作>CSS > 课时100.背景图片和插入图片区别(掌握)

课时100.背景图片和插入图片区别(掌握)

2018年06月15日  | 移动技术网IT编程  | 我要评论

快捷键补充:

bc  background-color:;

bi  background-image:;

bgr background-repeat:;

gp  background-position:;

ba  background-attachment:;

bg +  background:#fff   url()   0  0  no-repeat;

到这里属性基本就讲完了,然后我们还有一些CSS3的属性没有讲,但是要用到CSS盒子模型,现在我们没有学盒子模型,所以不用讲

1.背景图片和插入图片区别?

我们先来看一个例子

如何快速的打出以下代码?

div.box$*2   tab键

现在,我们要分别用背景图片和插入图片的方式插入两张图片,要让div的宽和高等于图片的宽和高

现在我们要在.box1中放一些内容

<div class="box1">我是文字</div>

1.1 背景图片仅仅是一个装饰,不会占用位置,插入图片会占用位置

我们修改了一些代码

我现在,想把左上角的背景图移到右下角,背景图片有定位属性,我可以在第一个div的范围任意修改位置

这样我们背景图就移到了div的右下角,而我们想把box2的图片移动到右下角,目前我们没有知识能够做到

1.2背景图片有定位属性,所以可以很方便的控制图片的位置,插入图片没有定位属性,所以控制图片的位置不太方便

1.3插入图片的语义比背景图片要强,所以企业开发中如果你的图片想被搜索引擎收录,那么推荐使用插入图片

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网