web前端-基础篇

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

一、背景图片设置：

　　设置背景图时的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为准

 

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

 

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