差異處
這裏顯示兩個版本的差異處。
兩邊的前次修訂版前次修改 下次修改 | 前次修改 | ||
bootstrap [2024/10/27 08:41] – host | bootstrap [2024/12/17 22:11] (目前版本) – host | ||
---|---|---|---|
行 1: | 行 1: | ||
- | < | + | [[NOD|《奉愛的甘露》]]\\ |
- | < | + | [[CC|《永恆的采坦亞經》]] |
- | <ul class=" | + | |
- | < | + | |
- | < | + | |
- | < | + | |
- | <ul class=" | + | |
- | < | + | |
- | < | + | |
- | < | + | |
- | <ul class=" | + | |
- | < | + | |
- | < | + | |
- | < | + | |
- | < | + | |
- | </ | + | |
- | </ | + | |
- | </ | + | |
- | </ | + | |
- | </ | + | |
- | </ | + | |
- | </ul> | + | |
- | /* Remove default bullets */ | + | |
- | ul, #myUL { | + | |
- | list-style-type: | + | |
- | } | + | |
- | </ | + | |
- | < | + | |
- | #myUL { | + | |
- | margin: 0; | + | |
- | padding: 0; | + | |
- | } | + | |
- | + | ||
- | /* Style the caret/arrow */ | + | |
- | .caret { | + | |
- | cursor: pointer; | + | |
- | user-select: | + | |
- | } | + | |
- | + | ||
- | /* Create the caret/arrow with a unicode, and style it */ | + | |
- | .caret:: | + | |
- | content: "\25B6"; | + | |
- | | + | |
- | display: inline-block; | + | |
- | margin-right: | + | |
- | } | + | |
- | </ | + | |
- | < | + | |
- | /* Rotate the caret/arrow icon when clicked on (using JavaScript) */ | + | |
- | .caret-down:: | + | |
- | transform: rotate(90deg); | + | |
- | } | + | |
- | + | ||
- | /* Hide the nested list */ | + | |
- | .nested { | + | |
- | display: none; | + | |
- | } | + | |
- | + | ||
- | /* Show the nested list when the user clicks on the caret/arrow (with JavaScript) */ | + | |
- | .active { | + | |
- | display: block; | + | |
- | } | + | |
- | var toggler = document.getElementsByClassName(" | + | |
- | var i; | + | |
- | + | ||
- | for (i = 0; i < toggler.length; | + | |
- | toggler[i].addEventListener(" | + | |
- | this.parentElement.querySelector(" | + | |
- | this.classList.toggle(" | + | |
- | }); | + | |
- | } | + | |
- | < | + | |
- | </ | + |