这篇文章将为大家详细讲解有关怎么在css中实现遮罩全屏居中对齐,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。
具体代码如下所示:
<style>#toastLoaderFullScreen { height: 100%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 99999; background-color: rgba(224, 38, 38, 0.5);}#toastLoader { position: absolute; left: 50%; top: 45%; width: 350px; margin-left: -19px; }#toastLoaderText { position: fixed; top: 53%; left: 50%; width: 250px; margin-top: -10px; margin-left: -125px; word-wrap:break-word; text-align: center; }</style><template> <div id="toastLoaderFullScreen"> <div> <mu-circular-progress id="toastLoader" :size="40" color="rgb(24, 143, 254)" v-show="isToastLoader"></mu-circular-progress> <div id="toastLoaderText"> <p>正在登录中</p> </div> </div> </div></template><script>export default { data() { return { isToastLoader: true } }, created() { // setTimeout(() => { // this.isToastLoader = false // }, 2000) }, methods: { }}</script>
什么是css
css是一种用来表现HTML或XML等文件样式的计算机语言,主要是用来设计网页的样式,使网页更加美化。它也是一种定义样式结构如字体、颜色、位置等的语言,并且css样式可以直接存储于HTML网页或者单独的样式单文件中,而样式规则的优先级由css根据这个层次结构决定,从而实现级联效果,发展至今,css不仅能装饰网页,也可以配合各种脚本对于网页进行格式化。
关于怎么在css中实现遮罩全屏居中对齐就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。