如何解决有没有办法隐藏不适合其父div的div?
我正在使用可调整大小的网格(gridstackjs),当文本溢出单元格时,我想在其中隐藏文本。我用一个包含单元格DIV中文本的DIV完成了此操作。
我已经尝试使用CSS和媒体查询,但是找不到正确的方法。有一张图片:
谢谢你,希望我自己解释一下。
.elemento {
overflow: hidden;
}
.texto-elementos {
text-align: center;
font-weight: bold;
color: white;
text-shadow: 2px 2px #474747;
overflow: hidden;
}
.iconoAlturas {
margin-top: -22px;
margin-right: 8px;
float: right;
}
<div class="grid-stack-item-content elemento ui-draggable-handle">
<div class="mt-2 texto-elementos">U1001</div><div class="iconoAlturas"><i class="fas fa-layer-group"></i></div></div>
解决方法
属性“溢出:隐藏”将仅隐藏溢出的内容。要隐藏页面调整大小时的元素,您需要使用“ display:none”属性以及媒体查询。
@media only screen and (max-width:300px){
.texto-elementos {
display:none
}
}
当屏幕宽度小于300px时,这将隐藏您的文本元素。我认为这会对您有所帮助。
,在无效的代码上添加以下CSS样式
overflow: hidden
,
使用带显示:none属性的媒体查询来查询各个设备的大小。
@media only screen and (respective screen size){
.[class] {
display:none
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。