带来一篇CSS3教程:pointer-events属性值详解

在几乎所有的浏览器上都可以使用。15.以前一些非得通过图片转换实现的功能，现在只要用CSS就可以轻松实现，从而更快地下载页面。
破洛洛文章简介：CSS3pointer-events先容.
实在早晓得这个属性，可是一向没有往研讨过。明天恰好在twitter看到这个词，就往研讨了下，恰好办理了今朝碰到的一个小困难，以是分享下。嗯，实在这是个对照复杂的CSS3属性。
在某个项目中，良多元素必要定位在一个舆图层下面，这里就要用到良多相对定位大概绝对定位的元素，可是如许的话，这些浮在下面的div大概别的元素一样平常城市给个宽高，大概relative的元素能够不给宽高，这个时分，这些元素就会挡住上面的舆图层，以致于舆图层没法操纵。。。
然后恰好在Googlemap见到了相似的成绩，拿来当例子来讲：

登录/注册后可看大图

Googlemap中左上角的操纵地区占位是挺年夜的，如白色框地区，然后在这个地区是没法操纵舆图层的。那末我们就能够给这个div设置pointer-events:none，然后你就会发明上面的舆图就能够拖动和点击了。
可是喜剧的是，操纵地区自己却没法操纵了，间接被忽视失落了。不外不必忧虑，我们能够给内里的元素从头设置为pointer-events:auto，固然，只给必要操纵的元素地区设置。
貌似有点儿纠结，不外如许能够包管舆图自己的可操纵地区最年夜化。
嗯，下面只是个复杂的例子，来看下详细用法：

1. pointer-events:auto|none|visiblePainted|visibleFill|visibleStroke|visible|painted|fill|stroke|all|inherit

复制代码

pointer-events属性有良多值，可是关于扫瞄器来讲，只要auto和non两个值可用，别的的几个是针对SVG的(自己这个属性就来自于SVG手艺)。
pointer-events属性值详解

• auto——效果和没有界说pointer-events属性不异，鼠标不会穿透以后层。在SVG中，该值和visiblePainted的效果不异。
  
• none——元素不再是鼠标事务的方针，鼠标不再监听以后层而往监听上面的层中的元素。可是假如它的子元素设置了pointer-events为别的值，好比auto，鼠标仍是会监听这个子元素的。
  
• 别的属性值为SVG公用，这里不再多先容了。
  

扫瞄器兼容性

Firefox3.6+和chrome2.0+和safari4.0+都撑持这个CSS3属性，IE6/7/8/9都不撑持，Opera在SVG中撑持该属性可是HTML中不撑持。好吧，仍是有点儿悲催～～
</p>
一般来说还需要用Photoshop或FireWorks(以下简称PS或FW)等图片处理软件将需要制作的界面布局简单的构画出来。

Dreamweaver在所见即所得添加链接，也可以先选中文字或图片然后在属性栏中的链接栏后的一个小圆圈，用鼠标点击小圆圈按住不放拖动出箭头然后指向文件即可。

可以使用 CSS 检查工具进行设计。

不管老师做怎样的解释，而我却对它感到很是吃力，诸如里面有许多不知道的功能。

布局表格、绘制层、制作CSS样式表等，这些内容迷糊了我的视线，真是没想到制作一个精巧别致的网页是如此的困难，可是心有不甘。

以上大概就是文字图片的一些链接方法，通过学习Dreamweaver、练习让我对dreameaver8有了进一步的认识，他其实是一款很好的建立Web站点和应用程序的软件。它将可视布局工具、应用程序开发功能和代码编辑支持组合在一起，其功能强大，使得各个层次的开发人员和设计人员都能够快速创建界面吸引人的基于标准的网站和应用程序。

只要我们努力，无论是怎样的艰难险阻，成功依然会迎面直击。在刚开始时我觉得dreamweaver mx XX很难理解。

布局表格、绘制层、制作CSS样式表等，这些内容迷糊了我的视线，真是没想到制作一个精巧别致的网页是如此的困难，可是心有不甘。

使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。