js展开闭合效果，为什么dl不向下移动而是和第二条，第三条重叠

答案:4 悬赏:0 手机版

解决时间 2021-11-26 11:35

提问者网友：临风不自傲
2021-11-26 00:21

最佳答案

五星知识达人网友：持酒劝斜阳
2021-11-26 01:07

展开闭合效果

.open {
height: auto;
overflow: visible;
}
dl {
height: 16px;
overflow: hidden;
}

展开闭合效果1

展示内容，展示内容。

展开闭合效果2

展示内容，展示内容。

展开闭合效果3

展示内容，展示内容。

我给你改了一下，因为你的dl设置高了，所以按照16px的高度继续往下排，那么第二个dl的位置就是那里，而dd根据dl的位置继续排，所以就重叠了，而且close那个css是没用的，js中添加close的那个地方可以直接将className设置为空

全部回答

1楼网友：长青诗
2021-11-26 03:11

展开闭合效果

展开闭合效果1: 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。

展开闭合效果2: 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。

展开闭合效果3: 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。

2楼网友：纵马山川剑自提
2021-11-26 03:04

引用s524797336的回答：
展开闭合效果

展开闭合效果1: 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。

展开闭合效果2: 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。

展开闭合效果3: 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。; 展示内容，展示内容。

我给你改了一下，因为你的dl设置高了，所以按照16px的高度继续往下排，那么第二个dl的位置就是那里，而dd根据dl的位置继续排，所以就重叠了，而且close那个css是没用的，js中添加close的那个地方可以直接将className设置为空
.open{
overflow:visible;
height:auto;
}
在open里加上height:auto;

3楼网友：洎扰庸人
2021-11-26 02:29

        展开闭合效果


   .open dd{
    display:block;
   }
   .close dd{
    display:none;
   }
   dd{
display:none;
   }

展开闭合效果1

展示内容，展示内容。

展开闭合效果2

展示内容，展示内容。

展开闭合效果3

展示内容，展示内容。

改成上面的就可以了。把高度去掉，用display设置隐藏和显示。

我要举报

如以上回答内容为低俗、色情、不良、暴力、侵权、涉及违法等信息，可以点下面链接进行举报！

点此我要举报以上问答信息