css 文本选择覆盖屏幕的整个宽度

xytpbqjk 于 2023-02-10 发布在其他

关注(0)|答案(2)|浏览(109)

每当我选择/突出显示网站上的文本时，该栏会与页面上的所有内容重叠。

(Text选择框实际上不是灰色的，只是需要捕获屏幕截图）我如何才能阻止它这样做，使它留在白色框？
文本所在的白色框使用“自动换行：break-word“来阻止文本与白色框重叠。我不知道问题是否与此有关。

<p> Test Test Test Test Test </p>

p {                         
font-family: "Calibri";
font-style: normal;
font-variant: normal;
font-size: 18px;
color: black; }

谢谢

css

来源：https://stackoverflow.com/questions/27950902/text-selection-covers-entire-width-of-screen

2条答案

按热度按时间

ebdffaop1#

只需为子div添加样式oveflow: hidden;。
超文本标记语言

<div class="wrap">
    <div class="content">
        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled 
    </div>
</div>

中央支助系统

.wrap{
    background: #ddd;
    overflow: hidden;
    padding: 20px;
}
.content{
    width: 50%;
    margin: 0 auto;
    background: #fff;
    overflow: hidden;
}

**一个

赞(0）回复(0）举报 2023-02-10

ergxz8rk2#

只要父元素不是页面的全宽，您也可以通过在父元素上使用position: relative来实现相同的效果。
例如，如果您有

<div class="wrapper">
  <p> Test Test Test Test Test </p>
</div>

在CSS中，您可以将

.wrapper {
  position: relative;
  max-width: 700px; // set this to width you want your content to be
  margin: 0 auto; 
}

你也会得到同样的效果，选中文本的背景只和.wrapper元素一样宽。

赞(0）回复(0）举报 2023-02-10

我来回答

css 文本选择覆盖屏幕的整个宽度

2条答案

相关问题

热门标签

最新问答