html - 有什么方法可以在没有 Javascript 的情况下双击选择多个单词?

标签 html css

假设我有一个网页,其中包含供用户复制粘贴的命令行命令。有什么方法可以用 HTML/CSS 显示它,这样双击一个词就可以选择整个命令?

示例:ls -l/myfiles - 单击此处的“myfiles”只会选择该词,但对于用户而言,如果选择整个命令以便于复制,将会获得更好的体验-粘贴。再次声明:这里没有 javascript。

最佳答案

我在问题中评论说,如果没有 javascript,则无法通过双击选择多个单词。至少对于 Firefox 而言,这并非完全正确。我刚刚找到了一种通过双击第一个单词来选择多个单词的方法!

您需要使用一个空格后跟 unicode (从右到左的标记)

仅适用于 Firefox!

jsfiddle demo

或者在演示 block 中双击“Hello”。

Hello ‏my ‏name ‏is ‏Kasper

我不知道为什么会这样。我只是在试验 unicodes...更多信息可以在 w3.org 上找到:

Using a Unicode right-to-left mark (RLM) or left-to-right mark (LRM) to mix text direction inline

编辑:

使用其他 unicode 空格字符可能更接近您想要的行为。例如 unicode DEMO ( jsfiddle ) 或双击下面 block 引号中的任何单词(同样,仅适用于 firefox)

Hello my name is Kasper

其他示例(双击大写单词)

in this SENTENCE ONLY WORDS WITH capitals are selected

关于html - 有什么方法可以在没有 Javascript 的情况下双击选择多个单词?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28251280/

相关文章:

javascript - Bootstrap 表 : sort by date field

html - 网站上的灰色文字有颜色

html - 使 Bootstrap 轮播图像和文本在移动设备中可读

HTML5/CSS3 - 左边距问题

html - 如何使用此命令使 4 个 div 向左浮动,1 个向右浮动?

html - 在同一行中跨 bootstrap 列对齐多个元素

html - 如何在 Bootstrap Jumbotron 中专门定位文本?

Jquery 显示和隐藏子 div 的问题

html - 带有 justify-content :space-evenly, 的 100% 宽度 flex 水平列表如何将元素符号居中放置在空格中?

html - 使用 CSS 背景样式 <li> 元素,仅显示部分图像