发表于: 2016-03-10 23:33:27

3 1703


1,今天完成的事情:task10修真院首页完事了,就是手机端最后图片有点重叠。

2,明天计划的事情:准备着手task11,有信心会缩短时间完成。

3,遇到的问题:用了bootstrap后,手机端有些地方不好,最后才知道,还的用媒体查询来存储一套当时分辨率下的效果。

4,收获:

(1),background-attachment -- 定义背景图片随滚动轴的移动方式

               取值: scroll | fixed | inherit

    • scroll: 随着页面的滚动轴背景图片将移动
    • fixed: 随着页面的滚动轴背景图片不会移动
    • inherit: 继承
  • 引用网址:http://www.dreamdu.com/css/property_background-attachment/
  • 初始值: scroll
  • 继承性: 否
  • 适用于: 所有元素
  • background:背景.attachment:附着.

显示效果:http://www.w3school.com.cn/tiy/t.asp?f=csse_background-attachment

(2),媒体查询:各个分辨率下可以套用不同的样式:

/* 屏幕可见视口宽度>= 1200px */

@media only screen and (min-width: 1200px) {


}

/* 992px≤屏幕可见视口宽度<1200px */

@media only screen and (min-width:  992px) and (max-width: 1199px) {


}

/* 768px≤屏幕可见视口宽度<992px */

@media only screen and (min-width:  768px) and (max-width: 991px) {


}

/* 768px<屏幕可见视口宽度*/

@media only screen and (max-width: 767px) {

}


在括号里面加上你需要的样式,就可以在不用分辨率下显示你要的效果,必要的时候加上!important,css样式权重的问题。


task10地址:http://119.10.57.69/ptt004/ppt299/task7-2/task7.html




返回列表 返回列表
评论

    分享到