基本上,当我使用谷歌浏览器并在某些网站上突出显示文本时,突出显示跨越浏览器的整个宽度,而不仅仅是突出显示文本。如何调整 CSS 以使其在突出显示文本时仅突出显示单词而不是跨越整个页面。一个很好的例子是 http://guides.rubyonrails.org/getting_started.html .尝试在谷歌浏览器中突出显示非代码文本,您就会明白我在说什么。
最佳答案
我的 OCD 部分也想知道这一点:我注意到的唯一一件事(虽然这绝不是一个全面的解决方案)是 float 元素表现出您所追求的行为。 This Fiddle显示了一个实时版本(下面的屏幕截图),其中两个 div
是相同的,除了一个具有声明 float: left;
,这防止文本突出显示跨越整个页面。
如果这对您来说是一个足够大的问题(尽管我会另外说),您可以 float 您的主容器以确保文本突出显示受限于它。 @solendil 的“解决方案”似乎矫枉过正,为了轻微的视觉烦恼而引入了巨大的可用性缺陷(无法选择文本是多么烦人)。
更新:根据@AndreZS 的回答,添加一个 position
值而不是默认的 static
也会限制文本突出显示到该元素(我认为自从我最初的回答以来,这种行为已经发生了变化)。需要熟悉 WebKit 的人才能解释触发所需行为的确切原因:似乎与元素的布局及其绘制方式有关。
关于HTML/CSS如何防止突出显示文本跨越谷歌浏览器中的整个页面宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8239129/