CSS 和 HTML:如何创建单击时展开的 DIV

CSS and HTML: How to create an Expanding DIV On Click?

本文关键字:单击 DIV 创建 HTML 何创建 CSS      更新时间:2023-09-26

我需要创建一个包含一些内容的 DIV(其中一些是隐藏的),当您单击它时,它会展开并显示其其余内容。

我找到了很多HOWTO,但使用jQuery。

我想要一个使用CSS和HTML的解决方案(Javascript也很好!

提前感谢!

<div id="sample"></div>

.css

#sample {
    border: 1px solid black;
    height: 15px;
    padding: 12px;
    overflow: hidden;    
}

JavaScript

document.getElementById("sample").onclick = function() {
    this.style.height = 'auto';
}

你可以使用一些jQuery进行动画div