background复合属性顺序_CSS必知|重点属性background|实践技巧|温故知新

学海无涯,不要沉浸在知识的海洋里,迷失自己。

要知道自己想要什么,抓住重点,不忘初心。

这个世界上百分之20的人,掌握着百分之80的财富。

接下来一系列教程,就带领大家抓住重点,一起做那百分之20的人。

往期知识点回顾:

重点属性-display

重点属性-position

重点属性-float

重点属性-flex

重点属性-overflow

重点属性-media

重点属性background

CSS 背景这里指通过background对对象设置背景属性,如通过CSS设置背景各种样式。

background-color

设置颜色作为对象背景颜色

background-image

设置图片作为背景图片

background-repeat

设置背景平铺重复方向

background-attachment

设置或检索背景图像是随对象内容滚动还是固定的。

background-position

设置或检索对象的背景图像位置。

Background

背景样式的值是复合属性值组合,也就是背景单词的值可以跟多个属性值,值与值之间使用一个空格间隔链接上即可。

background背景作用:

1、设置纯色背景。背景background可以设置对象纯色的背景颜色,

2、设置图为背景。可以设置对象背景为图片,如果背景是图片可以让图片重复平铺横铺,或将图片作为对象背景固定在对象任何位置。

Background分析解析

537fcca48e0dc55a8813d814686b8c23.png

属性解析

A.设置背景具体颜色值

B.这是背景的具体图片路径

C.设置图片是否平铺

no-repeat:不重复

repeat-x:水平方向(横向)重复平铺

repeat-y:垂直方向(竖向)重复平铺

如果不设置,为全背景平铺

D.具体左右上下的距离

left 图片靠左

right 图片靠右

top 图片靠上

bottom 图片靠下

E.背景图片固定,还是随上下滚动条滚动

fixed 图片固定

scroll 背景图片内容滚动

代码实践

       flex布局css
背景图
复制代码

面试题:

CSS无法显示背景颜色问题分析解决

1、由使用float浮动造成浮动产生无法显示css背景颜色

2、高度不够而产生背景无法显示

3.如果是float造成:解决方法有三种,一个是设置clear清除浮动、设置css高度、设置css overflow样式。

4.如果是高度原因:解决方案如下,设置够高的高度,或取消删除高度样式即可。

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值