css:background

1.背景图片的平铺

background-repeat:repeat,repeat-y,repeat-x,no-repeat

背景的图片是外部来源


原理

应用场景:

如果图片很大传输的很慢,小会很快

如何让网页的图片变小,提高网页访问速度

方法:对于有规律的图片,将其减下来一小块然后平铺

2.背景定位

1)background-color和background-image可以同时设定,图片会覆盖颜色

2)背景图片默认为左上角

background-position:0 0;水平 垂直

取值:方位名词,像素(单位一定要有)

水平:left center right

垂直 :top center bottom

应用:

1)通过图片显示完整,将滚动条不显示出来

使用background-image+background-position:center top,宽度不要给定

3.缩写bg+

background:背景颜色 背景图片 平铺方式 关联方式 定位方式;任何一个属性都可以省略

4.关联方式

默认情况下背景图片会随着滚动条移动,如果不随着滚动条滚动,改变图片的关联方式

backround-attament:srcoll/fixed;

5.背景图片和插入图片的区别

背景图片不会占用div的空间,有定位属性,但是插入图片的语义比背景图片的语义强,如果企业中如果你的图片想被搜索引擎收录,那么推荐使用插入图片

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容