背景图像未完全拉伸

2024-03-31

前几天我刚刚启动了一个网站,并认为它没有奇怪的 CSS 错误,但显然事实并非如此。我在这里尝试做的是拉伸图像以适应页面的高度和宽度。

问题:我有以下标记:

<img src="images/night_sky7.jpg" class="stretch" />

并对其应用了以下 CSS:

img.stretch { 
left: 0px;
position: absolute;
top: 0px;
width: 100%;
z-index: 0;
}

这在我的 17.1 英寸笔记本电脑(分辨率为 1440x900)上工作正常,但我注意到它在其他屏幕分辨率上无法正常工作。发生的情况是背景不会延伸到底部,而是延伸到底部下方,甚至延伸到页面的中间。

现在,我已经尝试更改很多 CSS,但无法使其完全伸展。

任何帮助表示赞赏。

如果您愿意,可以测试的网址是:http://bit.ly/eOEzX​​J http://bit.ly/eOEzXJ.

如果有必要,我可以做以下任何事情:

  • 将 Photoshop 中的图像更改为任意尺寸
  • 添加任意JS或CSS,但高度:100%;解决方案不起作用,至少,不像我所看到的那样

查克在这里走对了路,但你可能需要添加

html {
    height: 100%;
}

as well.

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

背景图像未完全拉伸 的相关文章

  • 如何垂直对齐div内的图像

    如何在包含的内容中对齐图像div Example 在我的示例中 我需要将 img in the div with class frame div class frame style height 25px img src http jsfi
  • chrome 中选择选项元素的额外填充

    我有一个选择元素 用户可以在其中选择分类和描述 仅在 Chrome 浏览器中 我有一个额外的填充 无法使用 padding 0 或其他 css 标签删除它 Chrome 的屏幕 https i stack imgur com m3iIb p
  • 从字体到跨度(大小和颜色)和背面的正则表达式(VB.NET)

    我正在寻找一个正则表达式 可以将我的字体标签 仅具有大小和颜色属性 转换为具有相关内联CSS的span标签 如果有帮助的话 这将在 VB NET 中完成 我还需要一个正则表达式来实现相反的效果 下面详细说明的是我正在寻找的转换示例 font
  • 使用内联样式有哪些风险?

    A 内容安全政策 https developer mozilla org en US docs Web HTTP CSP with a default src or style src指令将阻止内联样式应用于
  • CSS使背景图像使用字体字符

    我想使用字体字符 例如来自 font awesome 作为输入元素的背景图像
  • 如何在日期选择器中设置不在当前月份的单元格的样式

    我目前正在为我的 JavaFX 应用程序制作注册表 问题是 当日期选择器中的单元格不在页面的月份上时 我想让该单元格变灰 让我们看看我当前的日期选择器 我的日期选择器 正如您所看到的 我希望下个月的日期 27 日 28 日 30 日以及 1
  • 如何将大于整个页面 100% 的元素居中对齐?

    我有一个宽度为 100 的 div 并且隐藏了一个宽度为 3000px 的 div 我希望3000px的div左右均匀地被切断 我会使用背景位置 中心 然而 事情比这更复杂 3000px div 包含 30 100px div 我尝试过在
  • 在按钮之间添加空间?

    嗨 我这里有一个代码 除了一件事之外 一切都很完美 代码中每个按钮之间没有空格 我尝试过 margin 但不幸的是它是一个无序列表 所以我有点困惑 我将添加或替换什么以在两个按钮之间留出空间 帮助
  • 引导标签输入宽度

    我正在尝试使用引导程序标签输入 http timschlechter github io bootstrap tagsinput examples 以模态中包含的形式 像这样 div class form group div
  • 将输入中每个单词的第一个字符设为大写

    我想知道如何在输入区域自动生成单词的第一个字符 目前我的代码是 Name
  • 使用 CSS 覆盖透明 div 中的不透明文本

    我试图使透明 div 内的文本没有不透明度 也就是全黑 div style background 3cc p style background 000 This text should be all black p div 只用 CSS 就
  • CSS - div 与父 div 底部对齐(内联块)

    我知道这个 html 很草率 有一些不必要的额外 div 但无论如何 我无法理解为什么 ID 为 info box right 的 div 与父 div 的底部对齐 您可以看到 文本 与下面的 jsfiddle 示例的底部 有什么想法可以让
  • 如何更改 aptana studio 的背景颜色?

    如何将 Aptana IDE 或整个主题 的黑色背景更改为其他背景 例如蓝色 正如 gyozo 在评论中提到的 对于蓝色主题 请使用 窗口 gt 首选项 gt Aptana Studio gt 主题 并选择 Eclipse 主题
  • 如何在jqplot中显示饼图之外的标签?

    Jqplot 有如下图表 jqplot 图表 http www jqplot com tests pie donut charts php 我的问题是如何在 a 之外显示标签jqplot chart像下面这样high chart 高图表可以
  • 使用deployJava.runApplet来定位特定元素

    经过多年成功维护一个使用旧有的小程序 嵌入Java小程序的方法 我们无法捂住耳朵唱 啦啦啦 不再了 是时候使用 deployJava runApplet 当我使用点击处理程序触发此方法时 此处通过 jQuery 在按钮上使用事件侦听器 但这
  • 调整文本区域大小

    我需要使用文本区域来显示一些文本 问题是 如果我放置 4 5 行文本 就会出现滚动条 如何使用 CSS HTML 使文本区域与其内容一样大 没有滚动条 文本区域不需要动态更改其大小 我仅使用它来显示文本 我也可以使用禁用的文本区域 我希望文
  • 动画进度元素值

    我有一个progress元素 该元素如下所示 div class container div div div
  • 如何将此 HTML 表格布局解决方案转换为浮动 div 解决方案?

    我经常需要列出各种尺寸的项目images在左边和text在右边 像这样 替代文本 http www deviantsart com upload 7s01l5 png http www deviantsart com upload 7s01
  • 如何将送货地址复制到帐单地址

    我想知道是否可以将送货地址复制到帐单地址 当用户单击与送货地址相同的复选框时 送货地址值将被复制到账单输入字段 我完成了大部分部分 但我不确定如何将选择菜单 状态 值复制到帐单地址 我真的很感谢任何帮助 My code document r
  • Twitter 嵌入时间轴小部件

    我继续下载http platform twitter com widgets js http platform twitter com widgets js And the http platform twitter com embed t

随机推荐

  • 设计:新错误(可加密)

    我已经一周没有碰过我的代码了 但是当我捆绑并尝试运行我的网络服务器时 我现在收到以下错误 这让我死在了水里 按照错误输出中的建议包含可设计加密的 gem 并不能解决问题 并且仍然会导致相同的错误 任何帮助是极大的赞赏 DEVISE Devi
  • Reactjs:使用 shouldComponentUpdate() 停止在特定状态更改时重新渲染

    我的组件 onload 中有多个 setState 我的页面在单击下拉值时重新呈现 因为单击时我通过以下方式存储这些值setState 为了停止点击时重新渲染 我使用下面的代码 shouldComponentUpdate return fa
  • Nginx 反向代理配置

    我在使用 nginx 进行简单配置时遇到问题 我有一台托管 docker 容器的服务器 因此 nginx 位于容器中 所以我们调用 urlfoo com 我想要网址foo com service1实际上只是去另一个端口上的 foo com
  • CSS 中如何使用“大于”或“>”字符?

    我在 CSS 文件中多次看到这个字符 但我不知道它是如何使用的 谁能向我解释一下并展示它们如何使页面样式变得更容易 这是一个 CSS 子选择器 P gt SPAN表示将以下样式应用于作为子级的所有 SPAN 标记P tag 请注意 孩子 的
  • Visual Studio Code 中是否有像 DocBlockr 这样的代码注释功能?

    我使用 Sublime Text 3 Atom io 和 Bracket io 作为以前的编辑器 我也非常喜欢新的 Mac 版 Visual Studio 代码编辑器 Sublime 有类似 DocBlockr 的代码注释功能吗 这对我来说
  • Android Studio 0.5.9错误代码42

    每次我尝试从 eclipse 导入项目时 我都会收到这样的错误 Error Execution failed for task app mergeDebugResources 错误 无法运行命令 D Android sdk build to
  • 如何优化间接基数排序? (又名如何优化不可预测的内存访问模式)

    我用 C 编写了一个间接基数排序算法 间接 我的意思是它返回项目的索引 include
  • Kubernetes TLS 秘密证书过期

    我使用 openssl 创建通配符自签名证书 我将证书有效期设置为 到十年 我通过使用 openssl 检查证书来仔细检查有效期 我使用步骤 1 中准备的私钥和证书创建一个 Kubernetes 密钥 如下所示kubectl命令 kubec
  • 如何从ocaml列表中获取子列表

    我正在查看列表文档 图书馆好像没有提供sublist功能 我正在尝试从中获取元素列表i to j 现在我必须把它写成 let rec sublist list i j if i gt j then else List nth list i
  • 如何解析会导致非法 C# 标识符的 JSON 字符串?

    我一直在使用NewtonSoft JSON 转换 http james newtonking com json用于解析 JSON 字符串并将其转换为 C 对象的库 但现在我遇到了一个非常尴尬的 JSON 字符串 我无法将其转换为 C 对象
  • JavaMail 与 Oauth 和 Office365

    我正在用 Java 构建一个简单的命令行应用程序 它可以登录我的电子邮件箱 IMAP 并下载所有附件 我使用了基本身份验证 但 Microsoft 正在禁用它 因此我尝试将我的应用程序转换为使用 OAuth 在阅读了不同的 OAuth 流程
  • 部署时出现 aws beanstalk 403 错误

    您好 我正在使用亚马逊网络服务弹性豆茎 每次我使用 git aws push 时 我的 php 应用程序都会成功上传但是 当我单击 url 时 它会显示 Forbidden You don t have permission to acce
  • 自旋锁与忙等待[关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 请解释原因忙碌等待通常不受欢迎 而Spinning通常被认为还可以 据我所知 它们都会无限循环 直到满足某些条件 A 自旋锁通常在资源争用较少时
  • 使用Mysql lower_case_table_names为1

    我已经使用 yum 在 linux 中安装了 mysql v5 5 17 现在我想要默认的小写表名 所以我添加了 set variable lower case table names 1 in etc my cnf 但如果我这样做 我就无
  • 获取安装目录安装盾

    我想通过安装盾来创建我的设置 我使用命令参数Setup exe path SETUPEXEDIR log txt我的设置位置是Desktop myapp Setup exe使用 SETUPEXEDIR 时返回临时文件夹 我希望在使用 SET
  • 为什么我不能让单个 Redis 客户端在同一连接中充当 PUB 和 Sub ?

    我的思维模型是 聊天 我订阅了某个频道 并且可以向该频道发布消息 由于 pub sub 是异步的 因此发布的消息可能随时出现 包括当您期望命令响应时 尽管 Redis 是单线程的 通常会阻止此类事情 但网络延迟可能会导致一些有趣的影响 根据
  • 如何修复“属性没有初始值设定项并且未在构造函数中明确分配”错误?

    我对这些课程有疑问 我想使用该方法doSomething 班级独有B无需每次都进行类型转换 但是当我指定属性时a属于类型B 它告诉我它没有在构造函数中分配 这有点错误 因为父构造函数进行了分配 class A class B extends
  • 在 Android 模拟器上安装 Flash Player

    我想知道在android模拟器上安装flash播放器的过程 请详细 我需要执行此操作来测试应用程序 但目前我没有任何物理设备 我已经尝试过的事情 1 我已经检查了有关此主题的所有堆栈溢出链接 2 我已经知道adobe已经停止了android
  • 如何实现 STL 风格的迭代器并避免常见的陷阱?

    我创建了一个集合 我想为其提供一个 STL 风格的随机访问迭代器 我正在寻找迭代器的示例实现 但没有找到 我知道需要 const 重载 and 运营商 迭代器 STL 风格 的要求是什么 还有哪些其他需要避免的陷阱 如果有 附加上下文 这是
  • 背景图像未完全拉伸

    前几天我刚刚启动了一个网站 并认为它没有奇怪的 CSS 错误 但显然事实并非如此 我在这里尝试做的是拉伸图像以适应页面的高度和宽度 问题 我有以下标记 img src images night sky7 jpg class stretch