1. 事件穿透属性:pointer-events: none  // auto默认值、none:不捕捉target事件(实现穿透)

用途:当需要使用透明遮罩并且允许点击遮罩下方元素时,或需要使用背景容器展示样式时
 
2. 背景图不跟随滚动条:
  background-image: url('xxx');
        background-size: 100% 100%;
        background-attachment: fixed;  // 不跟随滚动条属性设置
 
用途:背景图不需要决定定位
 
 
我的个人站点:https://www.devloper.top  有大量视频与技术博客

CSS实现事件穿透与背景图不跟随滚动条的更多相关文章

  1. 在css中设置图片的背景图,怎么设置图片纵向拉伸

    css中设置背景图拉伸填充,在css2.1之前这个背景的长宽值是不能被修改的. 实际的结果是只能重复显示,可以使用repeat,repeat-x,repeat-y,no-repeat这些属性来控制背景 ...

  2. CSS之全屏背景图

    吐槽啦:Yeah  明天就是国庆了o(* ̄▽ ̄*)o!哈哈,提前祝福各位园友国庆快乐.假期愉快.生活美满.天天开心!国庆我要回家一趟,把一些不用的东西带回家,走访一下亲朋好友,在家打几天酱油~~~ 言 ...

  3. css背景图与html插入img的区别

    一直以来都认为css背景图与直接插入img图片的效果是差不多的,直到最近拜读了一位大神的作品,发现大部分图片都是通过背景图形式显示的,于是通过搜索各相关资料,在此总结了下二者的区别: 1. css中的 ...

  4. vue的挖坑和爬坑之css背景图样式终极解决方法

    原问题 #wrapper{ width:100%; height:100%; position:fixed; background-image:url(./img/open_bg.jpg) } 在.v ...

  5. 遭遇input与button按钮背景图失效不显示的解决办法

    笔者从事网页前端代码页面工程师已有多年,作为一个网页重构人员常常会遇到一些莫名其妙的DIV+CSS(正确的说法是XHTML+CSS)在 IE.FireFox火狐. 谷歌浏览器CHROME.苹果浏览器S ...

  6. 使用Canvas绘制背景图

    原文  http://www.imququ.com/post/use-canvas-as-background-image.html 最近iCloud Web的Beta版换了UI,整体风格变得和iOS ...

  7. input与button按钮背景图失效不显示的解决办法

    今天做公司的某个网站前端网页页面的时候笔者又遇到了难解决的网页前端DIVCSS代码问题,一个平时不会发生的怪事情发生了:为网页代码中的Form表单中的input 和 button 按钮标签在CSS样式 ...

  8. 冒泡,setinterval,背景图的div绑定事件,匿名函数问题

    1.会冒泡到兄弟元素么? $(function(){ $("#a").click(function(){alert("a")}) $("#b" ...

  9. CSS高效开发实战:CSS 3、LESS、SASS、Bootstrap、Foundation --读书笔记(1)设定背景图

    技术的新发展,除计算机可以接入互联网之外,平板电脑.智能手机.智能电视等其他设备均可访问互联网.在多设备时代,构建多屏体验也不是听说的那么难. 但是这也增加了学习CSS的难度?不知道如何上手,只懂一点 ...

随机推荐

  1. 【LeetCode】347. Top K Frequent Elements 解题报告(Python & C++)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 解题方法 解题方法 字典 优先级队列 日期 题目地址:https://l ...

  2. 1479 小Y的数论题

    小Y喜欢研究数论,并且喜欢提一些奇怪的问题.这天他找了三个两两互质的数a, b, c,以及另一个数m, 现在他希望找到三个(0, m)范围内的整数x, y, z,使得 (xa+yb) Mod m=(z ...

  3. 使用Java对接永中格式转换

    永中格式转换服务基于永中DCS的文档转换能力,支持不同格式文件之间的高质量互转,可实现PDF文档与Word.Excel.PPT.图片的高质量互转,PDF文档转换完美保留原文档的版式,格式等,转换效果出 ...

  4. POJ 3264:Balanced Lineup(区间最值查询ST表&线段树)

      Balanced Lineup Time Limit: 5000MS   Memory Limit: 65536K Total Submissions: 75294   Accepted: 344 ...

  5. Hyperledger Fabric源码分析之Gossip

    Gossip算法正如它的名字,小道消息只需要有人传播一次,那么过一段时间,所有人都会知道,就像新冠病毒一样,所以Gossip算法也有其它的别名"传染病扩散算法"."谣言传 ...

  6. [git]git重连

    使用以下两个命令清理缓存进行ssh清除:$ssh-keygen -f "/home/leoxae/.ssh/known_hosts" -Rxxx.xxx.xxx.xxx(指定IP) ...

  7. 解决opencv:AttributeError: 'NoneType' object has no attribute 'copy'

    情况一: 路径中有中文,更改即可 情况二:可以运行代码,在运行结束时显示 AttributeError: 'NoneType' object has no attribute 'copy' 因为如果是 ...

  8. 【】Apache Ranger剖析:Hadoop生态圈的安全管家

    前言 2016年,Hadoop迎来了自己十周岁生日.过去的十年,Hadoop雄霸武林盟主之位,号令天下,引领大数据技术生态不断发展壮大,一时间百家争鸣,百花齐放.然而,兄弟多了不好管,为了抢占企业级市 ...

  9. monkey怎么做APP自动化?

    前言: monkey是andriod平台自动化测试的一种手段,通过monkey程序模拟触摸屏幕.滑动,滚屏,按键来对设备进行压力测试,检测程序多久会出现异常第一种:设置好命令,做随机自动化 什么时候可 ...

  10. 初识python 之 自动拆分转换文本内容

    上一篇升级版,转换文件内容. #!/user/bin env python # author:Simple-Sir # time:2021/7/9 23:32 def txt_2_list(filen ...