之前在百度知道我提问过这一个问题,后来解决了。不过好多人来问我时怎么解决的,源码。
其实很简单。这里我贴一下代码。有需要的小伙伴不用再加我qq了,直接来这里取吧。

里面的图片是我随便找的。

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title></title>
<style>
html,
body {
height: 100%;
} body {
margin: 0;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
background-attachment: fixed;
background-image: url(http://pic1.win4000.com/wallpaper/b/589d687069ed9.jpg);
} h1{
height: 100%;
width: 100%;
margin: 0;
padding: 0;
color:#fff;
background-color: rgba(0,0,0,0.5);
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content: center;
align-items: center;
}
</style>
</head> <body>
<h1>按住Ctrl+滚动滚轮:可以看到文字缩放,背景不动</h1>
</body> </html>

html背景图不随滚轮滚动,而且按住Ctrl并滚动滚轮时,图片不会变大缩小,就像百度的首页一样的更多相关文章

  1. Jquery 点击按钮将其背景图换成另一张,再次点击恢复默认图片

    这是Jquery代码: $(function () { $("#h1").toggle(function () { $("#h1").css("bac ...

  2. CSS实现背景图尺寸不随浏览器大小而变化的两种方法

    一些网站的首页背景图尺寸不随浏览器缩放而变化,本例使用CSS 实现背景图尺寸不随浏览器缩放而变化,方法一. 把图片作为background,方法二使用img标签.喜欢的朋友可以看看   一些网站的首页 ...

  3. css背景图充满屏幕

    代码: body { /* 加载背景图 */ background: url(resource/inv_bg.png); /* 背景图不平铺 */background-repeat: no-repea ...

  4. Visual Studio 2017 设置透明背景图

    一.前言 给大家分享一下,如何为VS2017设置透明背景图.下面是一张设置前和设置后的图片. 设置前: 设置后: 二.设置背景图片的扩展程序 我们打开VS的扩展安装界面:[工具]->[扩展和更新 ...

  5. html的css背景图的repeat

    HTML里background-image中,可以设置background-repeat实现平铺,前面博文中关于css样式换行的(相关博文:超文本css样式换行),其中有个三个div组合的,中间的di ...

  6. 用ctrl+鼠标滚动调节字体大小

    如此设置之后,按住ctrl+鼠标滚动,可以放大和变小代码的字号.

  7. [Unity3D插件]2dtoolkit系列二 动画精灵的创建以及背景图的无限滚动

    经过昨天2dtoolkit系列教程一的推出,感觉对新手还有有一定的启发作用,引导学习使用unity 2dToolKit插件的使用过程,今天继续系列二——动画精灵的创建,以及背景图的无限循环滚动,在群里 ...

  8. IE6下 input 背景图滚动问题及标签规范

    ie6 背景图滚动问题: <title>ie6下input背景图滚动问题</title> <style> .box{ height:20px; width:300p ...

  9. pc页面滚动的时候,背景图不动只是页面滚动

    代码如下,直接拷贝出去就能看效果: 用到的方法 background-attachment 属性设置背景图像是否固定或者随着页面的其余部分滚动. <!DOCTYPE html> <h ...

随机推荐

  1. 小程序onLaunch事件的坑

    记一个小程序踩过的坑 小程序项目中app.js里面定义了globalData,即全局变量,里面定义了一个token字段 需求是这样的,每次进入小程序的时候需要检验该token有没有,没有就请求后台获取 ...

  2. Django下orm学习 一对多

    概念说明 ORM:关系对象映射的全称是 Object Relational Mapping, 简称ORM SQLAlchemy: 是Python编程语言下的一款ORM框架,该框架建立在数据库API之上 ...

  3. Android开发 互相调用模式之提供扩展类

    此种方法适用于:比如你要让Android做一些事情,这些事用不到任何资源,在Android下用纯代码就能实现它,这样就可以在Android下写好,将它封装成一个方法,打成包按照下面的方式丢给Unity ...

  4. jvm的学习笔记:二、类的初始化,代码实战(3)

    首次主动此用导致类的初始化 MyParent4 myParent4 = new MyParent4(); MyParent4 myParent5 = new MyParent4(); 输出: MyPa ...

  5. 思科设备自动退出配置界面、打断命令输入、禁用DNS查询

    1.自动退出配置界面 问题及原因:当设备没有被操作,空闲一段时间后,控制台回到初始化界面.控制台默认会话时间为10分钟,过期后跳转初始化界面 解决办法:配置控制台永不超时 Switch(config) ...

  6. appium环境搭建(二)----搭建android开发环境

    一.安装Java环境: java 环境分JDK 和JRE ,JDK就是Java Development Kit.简单的说JDK是面向开发人员使用的SDK,它提供了Java的开发环境和运行环境. JRE ...

  7. GrapeCity Documents for Excel 文档API组件 V2.2 新特性介绍

    GrapeCity Documents for Excel 文档API组件 V2.2 正式发布,本次新版本包含诸多重量级产品功能,如:将带有形状的电子表格导出为 PDF.控制分页和电子表格内容.将Ex ...

  8. C++学习 之 控制程序流程 (笔记)

    1.使用if...else有条件的执行 在一些时候语句需要进行有条件的执行.比如如果输入"Y"就执行赋值语句N=1:否则N=0: #include<iostream> ...

  9. Windows下使用SVN版本控制工具

    一.SVN工作原理 SVN(SubVersion)的基本工作思路是这样的:在一台服务器上建立一个源代码库,库里可以存放许多不同项目的源程序,由源代码库管理员统一管理这些源程序. 每个用户在使用源代码库 ...

  10. java native本地方法详解(转)

    文章链接出处: 详解native方法的使用 自己实现一个Native方法的调用 JNI 开始本篇的内容之前,首先要讲一下JNI.Java很好,使用的人很多.应用极 广,但是Java不是完美的.Java ...