微信扫一扫看面试题

关注面试题库

背景图的设置

 

1、背景颜色

background-color:

background-color: pink; 

 

背景图片的显示原则

1)容器尺寸等于图片尺寸,背景图片正好显示在容器中;

2)容器尺寸大于图片尺寸,背景图片将默认平铺,直至铺满元素;

3)容器尺寸小于图片尺寸,只显示元素范围以内的背景图

 

*加载背景图必须有容器区域;

 

border: 1px solid red;

background-image: url(../images/tu.png);

 

background-repeat:

                   repeat(平铺) | no-repeat(不平铺) | repeat-x(水平方向平铺,垂直方向不平铺) |

                   repeat-y(垂直方向平铺,水平方向不平铺);

 

background-repeat: repeat-y;

 

背景图的固定

background-attachment:scroll(滚动) | fixed(固定)

background-attachment:scroll;

 

 

背景定位

background-position: 水平方向的值(left|center|right|数值+单位|百分比) 垂直方向的值(top|center|bottom|数值+单位|百分比);

水平向右 垂直向下移动 是正数值

水平向左 垂直向上移动 是负数值

简写:

background:#00ff00 url(背景图片的路径及全称) no-repeat center top;

posted @   web前端面试小助手  阅读(614)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 三行代码完成国际化适配,妙~啊~
· .NET Core 中如何实现缓存的预热?
点击右上角即可分享
微信分享提示