I'm trying to do somewhat of the opposite of the <q> tag. The q tag visually displays quotes in the web page, but if you copy paste the text, the quotes are not present in the pasted text. I want the opposite - no visual quotes in the web page, but quotes are present in the copy pasted text.
Why? Because I sometimes prefer to use other visual styles in my webpage instead of quotes. But when a user copies the text, since I cannot rely on them pasting the text into something capable of preserving the rich formatting/styles, I wish to revert to using quotes because they're simple ascii characters which will work in any plain text context.
I'll give a concrete example to help clarify.
Given:
.qq { background-color: yellow; }
I am <span class=qq>some quoted</span> text.
When the user views the page, they should see:
But if they were to copy the text and then paste it somewhere, the pasted text would be:
I am "some quoted" text.
Is it possible via just css? I'd prefer not to use js.
I don't really care what the html/css needs to be, so if quotes, or the q tag etc... need to be present in the html source instead of a span, that's totally ok.