时间:2021-07-01 10:21:17 帮助过:33人阅读
演示图:
main.js
index.html
jquery js css html
style.css
/*globle*/ ul, li{ margin: 0; padding: 0; list-style-type: none; } a{ display: inline-block; width: 100%; height: 31px; text-decoration: none; color: #fff; font-size: 13px; } a:hover{ background: #52718A; } /*sidebar*/ .sidebar{ width: 210px; height: 335px; margin: 50px auto; border-radius: 5px; font: 14px '新宋体'; color: #f4f4f4; } .title{ width: 95%; line-height: 32px; border-bottom: 1px solid #ccc; background: #1ABC9C; cursor: pointer; } .title > span{ margin-left: 10px; } /*in-sidebar*/ .in-sidebar{ width: 100%; display: none; } .in-sidebar > li{ width: 100%; height: 32px; background: #34495E; line-height: 32px; text-align: center; border-bottom: 1px solid #ddd; } /*arrow*/ .arrow{ float: right; display: inline-block; margin-right: 5px; width: 20px; height: 32px; background: url(../img/down.png) no-repeat center; } .arrow-up{ background: url(../img/up.png) no-repeat center; }
以上所述就是本文给大家分享的全部内容了,希望能够对大家学习jQuery有所帮助。