css加号图标_DIV，CSS如何实现“加减号”“显示隐藏”效果

展开全部

(1)1、js方法，这是一般网站常用的方法。

优点：兼容性好，易管理。

实现方式：按钮32313133353236313431303231363533e58685e5aeb931333337396335 onclick 触发 目标div 显示/隐藏。

代码有很多。

2、纯css方法：这是为了应付考试，掌握灵活性而用

缺点：需要支持css3的浏览器，兼容性不佳。

实现方法：利用css的伪类选择，将整个一体放到一个div中，包括 触发按钮、标题、内容。在div的css上写高度、overflow:hidden，在hover或active伪类上写新的高度即可，并不太实用。特意为你写的示例：HTML>

无标题文档

#box { width:400px; height:30px; border:1px #666666 solid; padding:10px; overflow:hidden;}

#box h5{ border:1px #666666 solid; height:30px; margin:0; padding:0;}

#box p{  border:1px #666666 solid;}

#box:hover { height:100px;}

 + 标题

这里是内容，也可以用   #box:active { height:100px;}，这是鼠标按下的效果。

(2)CSS是用级联样式表是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。