首页 > Web开发 > 详细

web前端-基础篇

时间:2020-01-03 13:53:53      阅读:104      评论:0      收藏:0      [点我收藏+]

该篇仅是本人学习前端时,做的备忘笔记:

一、背景图片设置:

  设置背景图时的css代码:background-image:url(图片的url路径);

  ps:设置好这个背景后请一定要设置该背景图片的大小和该背景图片的显示区域,css样式设置如下:

        e.g.   background-size:36px 36px;
                 width:18px;height:18px;
  不设置的话,出现的情况就是只有该内容区域有内容时,才会出现背景图片;

  背景图片的平铺css样式:background-repeat:repeat/no-repeat/repeat-x/repeat-y;

  背景图片的定位:background-position:  

     取值 1.x y 以px为单位的数字定义x轴和y轴的位置

               2.x% y%  

            3.x 或者 x%,不写y,默认y为50%

              4.关键字 x:left/center/right  y:top/center/bottom

  背景图片的固定

 

    background-attachment:

 

    取值:1.scroll 默认值,背景图定位以容器为准

 

                  背景图会随着页面滚动条滚动而变化

 

              2. fixed 固定,背景图定位以body为准

 

                  页面的滚动条,滚动,背景图不会随着发生位置变化

 

                  但是,只能在本容器区域内显示

 

 

web前端-基础篇

原文:https://www.cnblogs.com/FriedPotatoes/p/12144501.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!