如何使背景图像即使滚动也保持在左下角

2023-12-31

我想知道是否有一种方法可以使我的背景图像始终保持在左下角,即使用户滚动浏览器也是如此。我当前的CSS可以在网站加载时使图像位于浏览器底部,但是如果我滚动浏览器,它仍然会停留在同一位置。我很感激任何帮助。

html, body 
{
background-image:url("backgroundBottom.png");
background-position:bottom left;
background-repeat:no-repeat;
background-attachement:fixed;   //I just add this, don't think this would work.
font-family:"Georgia, self";
font-size:"30px";
margin:0px;
height:100%;
text-align:center;
}

您正在设置 HTML 和 BODY 元素的背景。

代码看起来不错,background-attachment:fixed就是你所需要的。

所以在简写 CSS 中,只需写

body {
    background: url(backgroundBottom.png) bottom left no-repeat fixed;
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使背景图像即使滚动也保持在左下角 的相关文章

  • 如何更改 Material UI 版本 5 自动完成中的选项字体大小?

    我想更改下拉项目的字体大小 我尝试了不同的方法来改变字体大小 如下所示 如何更改 Material UI 自动完成字体大小 https stackoverflow com questions 62492939 how do i change
  • 是否可以将CSS应用于半个字符?

    我在寻找什么 一种打造风格的方法HALF一个角色的 在这种情况下 一半的字母是透明的 我目前搜索和尝试过的内容 没有运气 设置半个字符 字母样式的方法 使用 CSS 或 JavaScript 设置字符的一部分样式 将 CSS 应用于字符的
  • 多列定义列表[重复]

    这个问题在这里已经有答案了 我有一个 dl 像这样 dl dt Quantity dd dt Size dd dt Rise dd dt Color dd dd dt dd dt dd dt dd dt dl 该列表是通过 php 动态生成
  • 为什么 Flexbox 会拉伸我的图像而不是保留纵横比?

    Flexbox 具有这种行为 它将图像拉伸到其自然高度 换句话说 如果我有一个带有子图像的 Flexbox 容器 并且我调整了该图像的宽度 则高度根本不会调整大小 并且图像会被拉伸 div display flex flex wrap wr
  • @Font-face 不适用于 IOS

    我正在开发一个 WordPress 网站 并且在每个页面上都有一个 H1 标签作为该页面的标题 我正在使用 font face 的特殊字体 它在每个浏览器的 Windows 上都运行良好 但是当我切换到 Mac 时 它不会显示 h1 标签
  • 您能否确定 CSS 文件的范围,使其仅适用于给定元素的后代?

    给定一个 css 文件 有没有办法限制整个文件的范围 使其仅适用于给定元素内的元素 例如给定 div span class some element span div 有没有一种方法可以将整个 css 文件的范围应用于 容器 中的所有元素
  • CSS - SASS:使用基于@each的mixins来生成多个背景

    我正在使用 CSS 创建发型和颜色目录 我有 55 种不同颜色和发型的组合 每种发型和颜色都有自己的图像 SVG 文件 我需要将它们全部组合成一个背景 使用 CSS3 的多背景功能 我编写了这个混合来生成多个背景 它基于 mixin在这篇文
  • 如何在表格的 tbody/thead 部分周围创建边框?

    我正在尝试创建一个包含表格数据的页面 该页面必须显示为多个表格 然而 我有两个相互冲突的要求需要解决 每个表格周围都必须有边框 每个表格的列宽必须能够根据内容重新调整大小 但是 所有表中的列宽必须一致 即列的大小基于所有表中该列中最大的单元
  • 自定义 WP 主题时,我应该将导航栏放在“”标签之前还是之后?

    我正在通过制作子主题来自定义 WP 主题 我将 Bootstrap 中的导航栏放入子主题目录中的 header php 文件中 但是 我不确定在哪里放置导航栏代码 我可以把它都放在前面and之后标记成功 例如 无论我选择哪一个 导航栏都显示
  • 将 Div 放置在另一个 DIV 下方

    我有两个 DIV 元素 其中之一具有绝对位置 主 DIV 的左下角 第二个 DIV 是隐藏的 只有单击链接才能显示 我需要第二个出现在第一个下方 但由于第一个 div 的位置是绝对的 第二个 div 出现在第一个 div 之上 HTML 代
  • 可以将position:absolute元素设为粘性吗?

    In CSS position sticky使元素能够显示position static行为 即 它采用文档流中的默认位置 直到到达某个滚动位置 然后采用position fixed行为 那么 这是否意味着我们不能使用position st
  • 在 ember-cli 中安装 Foundation 5

    我对 ember 相当陌生 对构建工具也很陌生 我目前正在使用通常的基础安装以及基础 cli 和指南针来编译我的 css 这有点痛苦 并且对于团队工作来说非常糟糕 我认为用 Bower 安装文件并使用会更好ember cli compass
  • div 中的中心文本?

    我有一个div 30px高和500px宽的 这div可以包含两行文本 一行在一行 并相应地设置样式 填充 但有时它只包含一行 我希望它居中 这可能吗 要水平居中 请使用text align center 要垂直居中 只能使用vertical
  • Sass:@use 出错,未定义变量

    我正在使用 Sass 并且想要使用 use关键字而不是 import 因为 import有很多问题 另外只有dart sass支持这个功能 我将node sass改为dart sass 然而 问题出现了 我原来的代码 import carb
  • 固定 div 位于居中 div 旁边

    我有一个网页 其中有可滚动的内容 此内容包含在 content 内 位于页面的中心 现在我希望导航栏出现在内容左侧 50 像素处 该栏应具有固定位置 不应滚动 这是我到目前为止所尝试过的 nav position fixed top 50
  • 如何在Yii框架中向Form添加类?

    我在 Yii 中有一个表单 我想向该表单添加一个类
  • 两列表:一列尽可能小,另一列占据其余部分

    我在 div 中有一个 to columns 表 div table tbody tr td class action a a td td class content p Bigger text variable size p td tr
  • javascript 选择自定义光标 (svg)

    我正在动态地将光标更改为悬停时的本地 svg element on mouseover function this css cursor url svgs pointer svg 9 30 auto 工作正常 但我想选择该 svg 来操纵其
  • 获取手机的 z 轴和磁北极(而不是 y 轴)之间的角度

    我知道如何使用 getOrientation 方法获取手机 y 轴和磁北之间的方向角 如此处所述https developer android com guide topics sensors sensors position https
  • 使用javascript动态更新css内容

    需要将 css 更新为动态值 我不确定最好的方法是什么 div style zoom 1 div 缩放级别将根据窗口大小调整触发 应用程序将相应缩放 我将此应用程序加载到 cordova 中并让它在 iPAD 中运行 然后我意识到需要使用

随机推荐

  • void_t“可以实现概念”?

    我在看第二部分 期间他讨论了他的小说的用途void t lt gt 建造 在他的演讲中 Peter Sommerlad 问了他一个我不太明白的问题 链接直接指向问题 所讨论的代码就发生在该问题之前 萨默拉德问道 沃尔特 这是否意味着我们现在
  • 向 numpy 数组中的所有奇数或偶数索引元素添加一个数字,无需循环

    假设你的 numpy 数组是 A 1 1 2 3 4 您可以简单地执行以下操作 A 1 向 numpy 数组的每个元素添加一个数字 我正在寻找一种将数字添加到奇数或偶数索引数字的方法A 2 1同时保持整个阵列完好无损 是否可以在没有任何循环
  • 使用 IntelliJ IDEA 运行 Maven 项目

    我是 IntelliJ IDEA 的新手 我想使用它运行一个简单的 Maven 快速入门项目 我按照所有说明进行操作 该项目已成功构建 但是当我尝试编译并运行它时 Run按钮未激活 看来 IntelliJ IDEA 无法弄清楚主类在哪里 这
  • CGDataProviderCopyData() 实际上复制字节吗?或者只是指针?

    我正在尽可能快地连续运行该方法 并且越快越好 所以显然如果CGDataProviderCopyData 实际上是逐字节复制数据 那么我认为必须有一种更快的方法来直接访问该数据 它只是内存中的字节 任何人都知道如果CGDataProvider
  • 2D 弹性球碰撞物理

    我正在制作一个涉及弹性球物理学的程序 我已经计算出了与墙壁和静止物体碰撞的所有数学公式 但我无法弄清楚当两个移动的球碰撞时会发生什么 我有质量和速度 确切地说是 x 和 y 速度 但每个球的速度及其方向都可以 并且想要这些的公式 请记住 这
  • 为什么自动向下转换不应用于模板函数?

    有人问这个问题 https stackoverflow com questions 45505477关于字符串附加 它是string s s s 2 不编译 人们给出的答案是operator 被定义为模板函数 而operator 不是 所以
  • 更改 Azure AD B2C 注销 URL(将 AzureADB2C/Account/SignedOut 更改为自定义 URL)

    我目前正在构建一个 C Net Core 2 2 应用程序 该应用程序使用 Azure B2C OIDC 进行登录 身份验证 我已经自定义了登录页面 并且知道如何使用自定义页面布局使用我的网站上托管的 CSS 和代码来自定义编辑 忘记密码屏
  • 使用委托作为 LINQ 的 Distinct() 的相等比较器

    我有一个 LINQ Distinct 语句 它使用我自己的自定义比较器 如下所示 class MyComparer
  • 在 Win7 中,某些字体无法像在 Win2K/XP 中那样工作

    我的问题是如何更改字体处理才能在 Windows 7 下正常工作 我确信我已经对以前有效但不再有效的内容做出了假设 但我什至不知道从哪里开始寻找 我祈祷有人可以帮忙 以下是我理解的详细信息 我还在 Microsoft Windows 开发人
  • 应用内购买:用户绑定购买上的“恢复购买”按钮

    我目前正在我的 Swift 应用程序中实现应用内购买 该产品是一种非消耗性产品 可为用户激活一种高级版本 通常 对于非消耗品购买 您必须在应用程序中放置 恢复购买 按钮 强制 然而 我的问题是 该应用程序以及因此的购买是受用户约束的 因此
  • UIPageViewController 子视图控制器之间的水平填充

    我正在使用 UIPageViewController 来显示嵌入在子视图控制器中的图像 NSDictionary options NSDictionary dictionaryWithObject NSNumber numberWithIn
  • Coq - 在 if ... then ... else 中使用 Prop (True | False)

    我对 Coq 有点陌生 我正在尝试实现插入排序的通用版本 我正在实现一个以比较器作为参数的模块 该 Comparator 实现了比较运算符 如 is eq is le is neq 等 在插入排序中 为了插入 我必须比较输入列表中的两个元素
  • 可以从多个模块访问包

    我的项目在 Java 1 8u151 上运行良好 我正在尝试将其升级到 Java 12 但出现以下错误 Package is accessible from more than one module
  • 如何在 emacs 中永久启用 hs-minor-mode

    我在 emacs 文件中使用 thhs 代码来永久启用 hs minor mode 并更改快捷方式 setq default hs minor mode t global set key kbd C c C h kbd C c C h hi
  • 在 Windows Phone 10 中安装 appx 或 appxbundle?

    我正在开发一个 UWP 应用程序 当使用 VS2015 调试它时运行没有任何问题 但当使用 appx 或 appxbundle 安装它时 我已经阅读了很多打包和安装指南 似乎我并没有遗漏任何步骤 我只需要在设备中部署应用程序以仅用于测试目的
  • MySQL 查询值列表

    我想从值列表创建一个查询并返回每个匹配的数据cat 这可行 但不需要options价值 查询值列表的更简单方法是什么 SELECT FROM table1 WHERE option R cat 12 cat 18 cat 30 您可以使用I
  • 设备可锁定第 n 次尝试时的自定义消息

    我正在寻找一种方法来显示设计可锁定模块中各种失败尝试次数的自定义消息 我发现默认情况下只能通知最后一次尝试 https github com plataformatec devise blob master lib devise model
  • 如何使用 C# 获取 .NET 中的当前用户名?

    如何使用 C 获取 NET 中的当前用户名 string userName System Security Principal WindowsIdentity GetCurrent Name
  • 如何在自己的线程上创建表单并在整个应用程序生命周期中保持其打开状态

    我正在创建一个小测试组件 但遇到了问题 基本上 该组件是控制对数据库的所有访问的类上的装饰器 它创建一个带有两个按钮的表单 模拟丢失连接 和 重新连接 按下按钮 不再让函数调用通过包装器 而是开始抛出 NoConnectionExcepti
  • 如何使背景图像即使滚动也保持在左下角

    我想知道是否有一种方法可以使我的背景图像始终保持在左下角 即使用户滚动浏览器也是如此 我当前的CSS可以在网站加载时使图像位于浏览器底部 但是如果我滚动浏览器 它仍然会停留在同一位置 我很感激任何帮助 html body backgroun