13

我正在一个收集著名语录的网站上工作。引用的文本是做其他事情的链接 [...] 但我也希望用户可以选择和复制引用的文本。

但在几乎所有浏览器中，用户都无法轻松地选择链接中的文本。

是否可以在 CSS 中覆盖它并使用户可以选择文本？

4

7 回答 7

11

在 Firefox 中，您可以通过按键选择部分超链接Alt，然后像往常一样使用鼠标进行选择。因此，一种选择是使用以下方法实现类似的功能jQuery：如果Alt按下键（或您指定的键）并且鼠标指针位于链接上方，则禁用链接。释放密钥后，启用链接。当然，您必须告诉您的用户如何进行选择。

于 2012-07-19T20:33:13.410 回答
8

你可以，

步骤1 ：

创建一个可拖动到锚标记的属性。

<a href="http://www.exaple.com" **draggable="false"**>Select Text From Here</a>

第2步 ：

使光标样式自动和用户选择必须是文本或全部

a
{
    cursor: auto;
    -webkit-user-select: text;
    -moz-select: text;
    -ms-select: text;
    user-select: text;

}
于 2018-08-14T08:52:19.233 回答
2

This isn’t really a job for CSS, as this is functionality, not rendering. And it is a difficult issue, because a click on a link is supposed to mean following the link, and breaking this would create a major usability problem.

The best approach is to avoid making the quotations links and use links separately along with them. For example, the credits below a quotation, or the name of the cited resource in the credits, would be a natural link. And if you want a click to “do something else”, then perhaps you should use buttons, not links, associated with the quotations.

于 2012-07-19T20:15:51.823 回答
1

You can't. You can, however, make an element look like a link but use JS to actually handle the "link" part of it.

jQuery:

$(".q").click(function() {
    window.location.href=$(this).attr('data-link');
});

HTML:

<span data-link="link.html" class="q">text here</span>

CSS (to give it the "hand" cursor)

.q {
  cursor: pointer;
}

Demo

I would just keep the quote just text (no link) and then add a smaller link at the end for more info or whatever it may be.

于 2012-07-19T20:15:27.630 回答
1

假设您有一个“框”，例如号召性用语链接，其主要目的和用途是将用户带到新页面。但同样重要的是，一种“选择”某些文本（例如地址、电话号码，或者在您的情况下 - 歌词）的方法，如下所示效果很好。

需要注意的是，“可选”文本本身是不可点击的。但是话又说回来，对于打算选择不会成为问题的文本的人。对于其他试图点击该链接的人来说，他们将不得不点击超出可选文本边界的一点点。

<!-- See stylized version in CodePen link below -->
<div class="box-link">
  <a href="#" class="box-link__anchor"><span>Apple Park Visitor Centre</span></a>
  <span class="box-link__text">10600 North Tantau Avenue<br />Cupertino, CA 95014</span>
</div>

CodePen 链接：

https://codepen.io/mjoanisse/pen/YMNaae

于 2019-04-09T18:55:13.007 回答
0

No, but you shouldn't have massive blocks of text in a link - a link should ideally be just one or two words, not an entire paragraph.

于 2012-07-19T20:13:32.133 回答
0

如果没有看到您的网站在运行，我无法判断，但我怀疑问题在于您的链接标签包含的不仅仅是引用。

如果链接显示为“To be or not to be——这就是问题”，那么选择它应该与选择任何其他问题相同。如果链接是“这里有一句名言：‘成为或不成为——这就是问题。点击这里做其他事情！” 那么他们将无法选择中间的文本，而这正是他们想要的。

确保您的链接文本只是他们想要选择的文本，并将其他任何内容放在标签之外，您会没事的。

于 2012-07-19T20:16:24.927 回答