web前端---隐藏与展开文本按钮

最新推荐文章于 2024-02-18 02:37:57 发布

JayBOLT

最新推荐文章于 2024-02-18 02:37:57 发布

阅读量1k

点赞数 1

文章标签： html

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/qq_44047479/article/details/109549339

版权

网页设计中有时候会出现大量引用文字的地方，大段文字的出现会显得整个页面布局很杂乱，设置隐藏文本按钮可以使得整个页面布局清晰明了，不繁琐。

<summary>标签为 <details> 元素定义一个可见的标题。
 当用户点击标题时会显示出详细信息。

<body>
    <h2>***</h2>
<details>
<summary>标题1</summary>
<p>第一段</br>
   第二段</br>
   第三段</p>
</details>
<details>
<summary>标题2</summary>
  <h4>（一）***</h4>
  	<p>-------</p>
  <h4>（二）***</h4>
  	<p>-------</p>
  <h4>（三）***</h4>
  	<p>-------</p>
  <h4>（四）***</h4>
  	<p>　-------</p>
</details>
</body>

网页效果如下：

在这里插入图片描述

在这里插入图片描述

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
2
评论
web前端---隐藏与展开文本按钮

网页设计中有时候会出现大量引用文字的地方，大段文字的出现会显得整个页面布局很杂乱，设置隐藏文本按钮可以使得整个页面布局清晰明了，不繁琐。
复制链接

扫一扫

评论 2

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。