css 溢出隐藏的内容显示在填充区,可能隐藏它?

rekjcdws  于 12个月前  发布在  其他
关注(0)|答案(4)|浏览(151)
<style>
   div{padding:5px;overflow:hidden;height:20px}
</style>
<div class="container">
  something something   something something   something something   something something   something something   something something   something something 
<div>

字符串
小提琴:https://jsfiddle.net/v21vgzfc/
在CSS中,是否可以在不添加另一层的情况下,使文本隐藏在填充区域中?

qnzebej0

qnzebej01#

是的,我会使用边框而不是填充。像这样:

div{
border:solid 5px #00f;
overflow:hidden;
height:20px
}

字符串

dxpyg8gm

dxpyg8gm2#

我认为plz给予div一个宽度

<style>
   div{padding:5px;overflow:hidden;height:40px; width:250px; background:#009}
</style>

字符串

14ifxucb

14ifxucb3#

你可以通过使用边框而不是填充来解决这个问题。

div {
   border: 5px solid blue;
   overflow: hidden;
   background-color: blue;
   height: 40px
}

字符串
了解它在this Fiddle.中的工作原理

esbemjvw

esbemjvw4#

您应该在父元素中创建一个嵌套元素,并将overflow: hidden应用于该嵌套元素。

<div class="parent">
  <div class="child">
    <!-- Content here -->
  </div>
</div>

个字符

相关问题