gpt4 book ai didi

css - 表@media查询显示问题

转载 作者:行者123 更新时间:2023-11-28 05:32:12 26 4
gpt4 key购买 nike

我创建了一个表格,其中一行有 5 个单元格,我想以 900 像素的宽度显示所有单元格,如果屏幕尺寸缩小,表格应该在第一行显示 4 个单元格,在第二行显示 1 个单元格,依此类推每行中的 1 个单元格用于移动查看。我在这里发布了代码 https://jsfiddle.net/e8hsmubv/

CSS 代码-

@media all and (max-width:565px){
table{
width:100%;
}
td{
display:block;
width:100%;
}
tr{
display:block;
margin-bottom:00px;
}
}

最佳答案

首先在您的 table 上设置这个样式 border-collapse: separate; 并添加 display:inline-blocktd。在 @media 之前声明它就可以了:).

关于css - 表@media查询显示问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38453646/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com