background-attachment属性

做网站时想实现背景图不动,上面的内容动的效果.网上搜一下,找到了一篇不错的文章

以下内容均引入自background-attachment属性进阶内容:

前提是定义了background-image属性,然后用background-attachment来指明背景图的位置是固定于视口的,还是随着包含块移动的。可简单理解为定义背景图片随滚动轴的移动方式。

取值:

scroll:默认值,背景图相对元素固定,背景随页面滚动而移动,即背景和内容绑定.

fixed:背景图相对于视口固定,所以随页面滚动背景不动,相当于背景被设置在了body上.

local:背景图相对于元素内容固定.

inhert:继承,规定应该从父元素继承 background-attachment 属性的设置.

该属性可以应用于任何元素。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,790评论 1 92
  • 最近看到许多网页运用了一个效果,网页往下翻背景跟着屏幕滚轮的滚动而滚动。这让我很好奇是什么技术做出来的效果,正巧这...
    AmazingMax阅读 906评论 0 0
  • background-attachment:scroll | fixed | inherit scroll,默认值...
    Andy丶Go阅读 633评论 0 0
  • 学习CSS的最佳网站没有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_阅读 1,089评论 0 1
  • background是CSS的简写属性,包含了数个属性集。 其可以用来设置一个或多个属性: 有一些我们是很熟悉的...
    DHFE阅读 1,880评论 0 0