本贴最后更新于 353 天前,其中的信息可能已经天翻地覆

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 等,欢迎大家加入,贡献开源。

    3309 引用 • 3947 回帖 • 654 关注
  • CSS

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

    70 引用 • 292 回帖
  • Sym

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

    329 引用 • 3697 回帖 • 612 关注
感谢    关注    收藏    赞同    反对    举报    分享