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

2018-06-24 02:28:11来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

快捷键补充:

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

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:课时88.权重问题(掌握)

下一篇:2. HTML常用标签