CSS @starting-style 规则

<p> CSS @starting-style 规矩 界说和用法 <p>CSS @starting-style 规矩用于正在元素与得其第一次花式更新之前界说元素的初始花式。</p> <p>那可以用于为像弹出框、模态框或任何从 display: none 形态变成可见形态的元素创立滑腻的进入和退出过渡成效。</p> 真例 例子 1 <p>运用 @starting-style让盒子以通明度 0 初步,并从顶部落下:</p> .boV { width: 150pV; height: 150pV; background-color: pink; opacity: 1; transition: all 0.9s ease; @starting-style { opacity: 0; translate: 0 -80pV; } } <p>亲身试一试</p> 例子 2 <p>正在弹出框和对话框中运用 @starting-style:</p> #myPopoZZZer { transition: opacity .5s ease-in, scale .5s ease-in; @starting-style { opacity: 0; scale: 1.1; } } #myDialog { transition: opacity .5s ease-in, scale .5s ease-in; @starting-style { opacity: 0; scale: 1.1; } } <p>亲身试一试</p> CSS 语法 @starting-style { css 声明; } 阅读器撑持 <p>表格中的数字默示首个彻底撑持该 @ 规矩的阅读器版原。</p> Chrome Edge FirefoV Safari Opera <br /> <span>117</span> &nbsp; <span>117</span> &nbsp; <span>129</span> &nbsp; <span>17.5</span> &nbsp; <span>103</span> &nbsp; <br />

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://aiend.cn