本文介绍了选择:: before或:: after伪元素中的文本的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

看看这个非常简单的代码

 <!DOCTYPE html> 
< html>
< head>
< style>
p :: before {
content:之前 - ;
}
< / style>
< / head>
< body>
< p>你好< / p>
< p>再见< / p>
< / body>
< / html>

Css增加¨Before - at the每一个< P> 的开始并且像这样呈现



如果您使用鼠标选择文本(用于复制粘贴),您可以选择原始文本,但不是css添加的Before或Aftter文本。




我有一个非常具体的要求,我需要允许用户选择前面的文字。做到这一点吗?

解决方案

你不能这样做,伪前类和后伪类不能用于这个目的。 / p>

Look this very simple code

<!DOCTYPE html>
<html>
<head>
<style>
p::before {
    content: "Before - ";
}
</style>
</head>
<body>
<p>Hello</p>
<p>Bye</p>
</body>
</html>

Css adds ¨Before -" at the start of every <P> and renders like this

If you use your mouse to select the text (for copy paste) you can select the original text, but not the Before or Aftter text added by css.

I have a very specific requirement where I need to allow users to select with the mosue the Before text. How would you do it?

解决方案

You can't, the before and after pseudo classes are not meant to be used for that purpose.

这篇关于选择:: before或:: after伪元素中的文本的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-31 06:21