如何在页面中插入不可选择的引号(通常在开头)?

How to insert an unselectable quotation mark (usually at the beginning) into a page?

提问人:pr0grammar 提问时间:8/12/2021 最后编辑:MetropolisCZpr0grammar 更新时间:8/13/2021 访问量:42

问:

我看过很多次,但我只是不明白如何将其插入页面。它通常在开头是一个双引号,并且不可选择。这就是我要说的:

enter image description here

如何将其插入页面?

html css 双引号

评论

0赞 pr0grammar 8/12/2021
P.S. 如果问题含糊不清,我很抱歉。我不知道如何更好地构图。
1赞 andy mccullough 8/12/2021
这回答了你的问题吗?使用 :before CSS 伪元素将图像添加到模态中(替换为:after:before)

答:

1赞 MetropolisCZ 8/12/2021 #1

或者你可以让它可选,但更容易(IMAO)编码,有两个段落,一个是“,第二个是文本:

<div>
  <p style="padding-left: 10px; width: 50px; height: 100%; font-size: 50px; float: left; color: gray; margin-top: 15px;"><i>"</i></p>
  <p style="width: calc(100% - 60px); float: right;">Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>

编辑:如果需要,您可以使用css使“ unselectable:user-select: none;

<div>
  <p style="user-select: none; padding-left: 10px; width: 50px; height: 100%; font-size: 50px; float: left; color: gray; margin-top: 15px;"><i>"</i></p>
  <p style="width: calc(100% - 60px); float: right;">Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>