html 隐藏元素占位/不占位

隐藏/显示元素

关于循环定时隐藏/显示元素，从而实现一个一闪一闪的效果如图:

实现方法：

1. 设置 display
   但是display在设为none是不占位置隐藏的

display:none;

2. 设置visibility
   而visiblity是占位隐藏

visibility:hidden;

动画实现

@keyframes fadenum{
   0%{opacity: 0;}
   100%{opacity: 1;}
}

拓展

var falg= true;
window.setInterval(() => {
    var text = document.querySelector(".text");
    if (num) {
        text.style.visibility = "visible";
        falg= !falg;
    } else {
        text.style.visibility = "hidden";
        falg= !falg;
    }
}, 1000)

脱离文档流拓展
position:absolute;不占位置
position:relative占位置