代码之家 › 专栏 › 技术社区 › Lyubomyr Shaydariv

如何使用CSS在Mozilla Firefox中启用子输入文本选择?

textselection gecko webkit firefox css

4

Lyubomyr Shaydariv · 技术社区 · 14 年前

让我们考虑下面的场景。我有以下页面,其中所有呈现的元素都必须是不可选择的。

<html>
<head>
    <style type="text/css">
        body {
            -webkit-user-select: none;
            -moz-user-select: none;
        }
        div {
            border: solid 1px green;
            padding: 5px;
        }
    </style>
</head>
<body>
    <div>
        Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy
        nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
        Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper
        suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem
        vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat
    </div>
    <div>
        <input type="text" value="You can select the text from me" />
        <textarea>
            And me too.
        </textarea>
    </div>
</body>
</html>

这个 input 和 textarea 文本在Google Chrome中仍然是可选择的,但在Firefox中文本是不可选择的。我已经尝试了以下方法:

input, textarea {
    -moz-user-select: text !important;
}

还有…它根本不起作用,因为(据我所见) 输入 和 特克斯塔利亚 嵌套在已不可选的文档正文元素中。那么,是否可以使用CSS在Firefox中启用嵌套用户输入元素的文本选择?

谢谢你的建议。

1 回复 | 直到 14 年前

1

11

Salman Arshad 14 年前

做:

    body {
        -webkit-user-select: none;
        -moz-user-select: -moz-none; /* changed from none to -moz-none */
    }
    input, textarea {
        -moz-user-select: text;
    }

工作?

见 this page .