给某个page下template中的第一个div设置如下样式:

.body-bg {
position: absolute;
width: 100%;
height: 100%;
top:;
left:;
overflow-y: auto;
background-color: #000;
}

示例:

<template>
<div class="body-bg">
//其它内容
</div>
</template>

css:

<style scoped>
.body-bg{
position: absolute;
height: 100%;
width: 100%;
top:0;
left: 0;
overflow-y: auto;
background-color: #fff;//背景色为白色
}
</style>

这样就可以使当前页面全屏白色了。

vue 单独页面body css 样式设置的更多相关文章

  1. VUE单独页面body css设置

    使用created周期用JS来处理BODY的样式 export default { beforeCreate: function () { document.getElementsByTagName( ...

  2. HTML+CSS样式设置——CSS一学就会

    HTML+CSS样式设置 CSS:(Cascading Style Sheets)层叠样式设置表. 网页的展示效果跟其排版有非常大的关系.排版则主要依靠CSS来设置.调节. 以下说CSS与HTML的联 ...

  3. CSS样式设置语法全解,样式优先级、值和单位、字体、文本、块级元素,行内元素,替换元素、非替换元素、display、float、position、table、li、光标、边距边框、轮廓、颜色背景

    全栈工程师开发手册 (作者:栾鹏) 一个demo学会css css选择器全解 css操作语法全解 CSS样式设置语法全解: 样式优先级 1. !important标记的样式 > 内联样式(sty ...

  4. TERSUS无代码开发(笔记04)-CSS样式设置

    CSS样式设置 1.常用显示样式 大小尺寸 说明  间距边距 说明  各类颜色 说明  width 宽 margin 外边距         color  颜色        height 高 pad ...

  5. 动态为页面添加CSS样式文件引用

    动态为页面添加CSS样式文件引用: if (document.createStyleSheet) { //IE document.createStyleSheet("./Themes/Def ...

  6. 每天一个JavaScript实例-展示设置和获取CSS样式设置

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  7. Github上html页面(包括CSS样式和JS效果)如何显示出来

    在看Github上项目时,发现有的html页面效果能很好的展现出来,而有的则不能.对这个问题很好奇,因此研究了一下,最终做到了将页面展示出来的目的.下面以我的Github的开源项目bootstrap- ...

  8. 【完美解决】vue,页面跳转样式错位但是刷新又好了的情况

    在vue文件中,做样式分离: 将覆盖样式单独写在一个style标签内,原页面写在 scoped样式作用域下.

  9. 各种CSS样式设置细线边框

    基础知识回顾 : cellspacing:单元格与单元格之间的边距:cellpadding:单元格内的内容与单元格边沿的边距 简单实用的样式,设置所有的单元格为细线效果 <style type= ...

随机推荐

  1. 安装Scala开发环境

    Scala 介绍 Step 1: 安装 Java开发环境 Scala 版本与Java版本的兼容关系 从Oracle网站下载JDK URL: http://www.oracle.com/technetw ...

  2. JWT学习小结

    JWT全称JSON-Web-Tokens,是一套应对Http其无状态且明文传递请求的特性的规范,保证请求的安全性.我们一般用它来在服务端和客户端之间传递用户的身份信息,实现状态保持. 1,相较于常见的 ...

  3. JNI学习笔记_Java调用C —— 非Android中使用的方法

    一.学习笔记 1.java源码中的JNI函数本机方法声明必须使用native修饰. 2.相对反编译 Java 的 class 字节码文件来说,反汇编.so动态库来分析程序的逻辑要复杂得多,为了应用的安 ...

  4. LeetCode——翻转数字

    第七题,Reverse Integer.(https://leetcode.com/problems/reverse-integer/description/) 注意事项:翻转之后,数据有可能会超过I ...

  5. 学习Xposed --记WX功能分析的过程

    首先,这个不是写个新手看的,内容比较粗略,把几个关键点自己列一下,以做记录 首先,我对andriod不懂,对java本身也不是非常熟,也从来没写过andriod或java的程序,但本着曾经对编程的理解 ...

  6. 【转】对象克隆(C# 快速高效率复制对象另一种方式 表达式树)

    原文地址:https://www.cnblogs.com/lsgsanxiao/p/8205096.html 1.需求 在代码中经常会遇到需要把对象复制一遍,或者把属性名相同的值复制一遍. 比如: p ...

  7. TZipFile FileNames中文乱码解决办法

    TEncoding.Default.GetString(zip.FileInfo[0].FileName); 补充说明: Zip.Extract(Zip.FileName[0], 'd:\'); 解压 ...

  8. OpenStack控制节点上搭建Q版nova服务(step5)

    placement组件监听的端口号是:8778 nova组件监听的端口号是:6080.8774.8775 其中6080端口号是novncproxy监听的端口号. 1.安装服务组件 yum instal ...

  9. c# 执行javascript 脚本

    /// <summary> /// 执行JS /// this.ExecuteScript("get('{0}')".FormatWith(token0), File. ...

  10. FPGA例化ROM存储表格

    FPGA例化ROM存储表格 1.选择ROM 2.填写数据位宽和深度 3.加载ROM初始化信息,coe文件