我已经工作了一段时间，试图让我的链接显示和隐藏它下面的一段。
我需要仅使用 CSS 来完成此操作。该段落必须在加载时隐藏，并在单击链接后显示，然后在再次单击链接时再次隐藏。
我怎样才能做到这一点？
<a …………………>My link</a>
<p>Sed ut perspiciatis unde omnis iste natus</p>
如果有任何帮助，我将不胜感激。
最佳答案
简短回答:您需要 javascript。
毕竟，这就是它的目的:用户交互，以及其他很酷的事情。另一方面，CSS 面向演示，因此它的交互功能是有限的(例如，它响应悬停操作但不响应您期望的单击操作)。
我想到的唯一想法是使用复选框来控制点击“状态”，并在 css 中显示基于该状态的内容。
HTML:
<label><input type="checkbox">My link
<p>Sed ut perspiciatis unde omnis iste natus</p>
</label>
CSS:
input[type="checkbox"] {display: none;}
input[type="checkbox"] + p {display:none; margin-left:1em;}
input[type="checkbox"]:checked + p {display:block;}
但是，这个解决方案不可能是最好的跨浏览器明智的，所以我们回到“Javascript”；)
关于html - 如何仅使用 css 切换 <p> 与 html 链接，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18116780/