因为next.js可以用pages文件夹中的js文件进行route,所以不需要public文件夹和html,因此没有body tag。

body自带8px的maigin,我想要给整个页面设置背景颜色,想去掉body的margin。

尝试方法1:

给最上层div设置样式  margin: -8px;

上左右边距都可以抵消,但是底部仍有body的8px margin。

2:

搜了一下网上的solution,大致有两种,一种是安装如Helmet一类的包,可以管理body tag;另一种是在_document.js中操作html。

而我不想要为style body这个小功能装东西。。还是想找到简单有效的方法。

其实,只要像下面这样设global style就可以啦:

<style global jsx>{`
body {
margin:;
}
`}</style>

react - next.js 设置body style的更多相关文章

  1. js设置css样式.

    在js设置css样式做法 var obj = document.getElementById('div'); obj.style.width = '100px'; obj.style.height = ...

  2. JS设置cookie

    cookie 与 session 是网页开发中常用的信息存储方式.Cookie是在客户端开辟的一块可存储用户信息的地方:Session是在服务器内存中开辟的一块存储用户信息的地方. JavaScrip ...

  3. js设置控件的隐藏与显示的两种方法

    js设置控件的隐藏与显示,设置控件style的display和visibility属性就可以了,下面有个示例,需要的朋友可以参考下用JavaScript隐藏控件的方法有两种,分别是通过设置控件的sty ...

  4. js设置、获取、清除cookie

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  5. React+Ant Design设置左侧菜单导航路由的显示与隐藏(与权限无关)

    最近在学习react时,用到了很流行的UI框架Ant Design,也了解了一下Ant Design Pro,发现它们都有导航组件,Ant Design框架的导航菜单在这里,Ant Design Pr ...

  6. js设置div透明度

    原生js设置透明度 为了兼容IE与其他浏览器对透明度的设置,我们需要对以上两种样式分别进行设置: 复制代码代码如下: var alpha = 30; //透明度值变量 var oDiv = docum ...

  7. 怎么用js设置a标签点击链接改变当前颜色

    怎么用js设置a标签点击链接改变当前颜色 20 例如:多个a标签为白色,当点击其中一个a标签时改变那一个a标签的字体颜色为黄色,并且跳转到对应链接,当点击下一个a标签链接时,下一个为黄色,之前一个恢复 ...

  8. js设置加载进度提示

      CreateTime--2017年8月23日09:17:46Author:Marydon js设置加载进度提示 第一部分:CSS /*加载样式*/ .Loading { position: abs ...

  9. js设置元素float的问题

    用js设置一个元素的float样式 div.style.float = 'left'; 这句话在谷歌浏览器或许没问题,但是在IE,火狐下会无效 正确写法是 div.style.styleFloat = ...

随机推荐

  1. React脚手架create-react-app

    1.安装过程 $cnpm install -g -create-react-app $create-react-app apps $cd apps/ $npm start 2.图片路径 不能用相对路径 ...

  2. Centos7 pcs pacemaker高可用安装配置详解

  3. 用Cocos2dx开发棋牌游戏的观点解析

    众所周知,目前棋牌游戏特别的火.很多游戏公司都想在这一块赚钱,可是却不知用什么软件比较好的去开发棋牌游戏,对此,我列出了两款比较靠谱的软件去开发棋牌游戏,希望对大家有帮助! 第一款软件是cocos2d ...

  4. 单片机C语言基础编程源码六则

    1.某单片机系统的P2口接一数模转换器DAC0832输出模拟量,现在要求从DAC0832输出连续的三角波,实现的方法是从P2口连续输出按照三角波变化的数值,从0开始逐渐增大,到某一最大值后逐渐减小,直 ...

  5. Cannot locate BeanDefinitionParser for element [scoped-proxy]

    指定使用 CGLIB 而不使用 JDK 生成代理对象:注意:此两个标签必须同时出现,不然会报:Cannot locate BeanDefinitionParser for element [scope ...

  6. 1.字符串操作:& 2.英文词频统计预处理

    1.字符串操作: 解析身份证号:生日.性别.出生地等. ID = input('请输入十八位身份证号码: ') if len(ID) == 18: print("你的身份证号码是 " ...

  7. Jmeter上传附件EXCEL

    1.通过对上传附件接口进行抓包,获取的信息如下: 2.在jmeter脚本中添加http请求,并添加http请求头信息如下: 3.在http请求中添加上传附件的内容如下,由于我上传的是excel,所以M ...

  8. vue的三种通信方式

    一 确定组件关系二 使用第一步确定的组件关系在下面找到使用方法 1 父子通信(子组件使用父组件数据渲染) a) 在 子组件 中添加props props: [自定义prop名字] b) 在子组件中把自 ...

  9. JZ2440学习笔记之第一个裸机程序(Keil-MDK)

    CPU:S3C2440, ARM920T, Internal 4KB RAM, Support boot from NAND flash, 128MB for each bank. JZ2440:Me ...

  10. Python母版使用

    设定base.html为母版,母版是页面的公共部分,可以减少代码冗余: 母版中变化的部分用:  {% block page-main % }  <!--page-mains是自己起的名称--&g ...