美文网首页技术随笔
2022-05-19 随笔 CSS pointer-events

2022-05-19 随笔 CSS pointer-events

作者: narcissus灬 | 来源:发表于2022-05-19 10:21 被阅读0次

    pointer-events

    说明与描述

    pointer-events: 属性定义元素是否对指针事件做出反应。

    属性值 描述
    auto 默认值。元素对指针事件做出反应,比如 :hover 和 click。
    none 元素不对指针事件做出反应。
    initial 将此属性设置为其默认值。
    inherit 从其父元素继承此属性。

    示例

    <!DOCTYPE html>
    <html>
      <head></head>
      <body>
        <h1>pointer-events 属性</h1>
        <p>请把鼠标指针移至下面的链接,查看是否对指针事件做出反应:</p>
    
        <h2>pointer-events: none;</h2>
        <div style="pointer-events: none;">
          访问 <a href="https://www.jianshu.com/">简书</a>
        </div>
        <!-- 无法点击访问,鼠标移入无效果 -->
    
        <h2>pointer-events: auto; (默认)</h2>
        <div style="pointer-events: auto;">
          访问 <a href="https://www.jianshu.com/">简书</a>
        </div>
        <!-- 可以点击访问,鼠标移入会变成手 -->
      </body>
    </html>
    
    

    相关文章

      网友评论

        本文标题:2022-05-19 随笔 CSS pointer-events

        本文链接:https://www.haomeiwen.com/subject/ehftprtx.html