若想實現文字隱藏再顯現的效果,可以使用CSS中的visibility
和opacity
屬性。
.hidden{ visibility:hidden; opacity:0; } .show{ visibility:visible; opacity:1; }
通過使用visibility
屬性,隱藏的元素仍占據著頁面中的空間,而使用opacity
屬性,隱藏的元素不占據頁面空間,但仍保留其占據的位置。
要讓文字隱藏再顯現,可通過添加CSS類來實現,如:
<p class="hidden">這段文字將會隱藏</p> <button onclick="showText()">點擊顯示文字</button> <script> function showText(){ document.querySelector('p').classList.add('show'); } </script>
通過點擊按鈕,為文字所在的p
標簽添加show
類,從而讓文字顯現。
上一篇await vue 同步
下一篇dz帖子顯示html代碼