imagepng

Demo

源码地址

https://github.com/b3log/index/tree/master/src/main/webapp/sym

原理

使用 background-attachment 属性设置背景图像是否固定或者随着页面的其余部分滚动

html 结构

imagepng

css

.bg {
    position: relative;
    width: 100%;
    height: 600px;
    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(images/bg2.jpg);
}

  • B3log

    B3log 是一个开源组织,名字来源于“Bulletin Board Blog”缩写,目标是将独立博客与论坛结合,形成一种新的网络社区体验,详细请看 B3log 构思。目前 B3log 已经开源了多款产品: PipeSoloSymWide 等,欢迎大家加入,贡献开源。

    3063 引用 • 3705 回帖 • 661 关注
  • CSS

    CSS(Cascading Style Sheet)“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    69 引用 • 291 回帖 • 3 关注
  • Sym

    Sym 是一个用 Java 实现的现代化社区(论坛 / 社交网络 / 博客)平台,“下一代的社区系统,为未来而构建”。黑客派就是使用该系统搭建的 ❤️

    300 引用 • 3531 回帖 • 601 关注
感谢    赞同    分享    收藏    关注    反对    举报    ...