css如何实现网页部分文字可以让用户选择?
网友回复
首先定义body的user-select: none;来禁止用户选择文本,然后再需要用户可以选择的元素css增加user-select: all,完整代码如下:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap'); html, body { margin: 0; padding: 0; width: 100vw; height: 100vh; font-family: 'Roboto', sans-serif; } body { user-select: none; display: grid; place-content: center; place-items: center; } h1 { font-size: 48pt; line-height: 40pt; margin-bottom: 0; } p { width: 75%; font-size: 34pt; text-align: center; } .select-all { user-select: all; } </style> </head> <body> <p>Here is a number which the user needs to copy'n'paste. It is only the number which is relevant, so using CSS you can make it easy to copy.</p> <p>Here is the number <code class="select-all">123456</code>, all other text is not relevant to copy.</p> </body> </html>