标签: normalize-css

我知道什么是CSS Reset,但最近我听说过这个名为Normalize.css的新东西

Normalize.css和Reset CSS有什么区别？

规范化CSS和重置CSS有什么区别？

它只是CSS重置的新热门词吗？

我是一个新的Angular 2用户,我遇到了一些问题.

传统上,我们可以使用<link rel="stylesheet" href="node_modules/normalize.css/normalize.css" />导入css文件,但我想让Angular 2自动导入它import.

当我使用Material 2时,我尝试使用相同的方法:

// angular-cli-build.js

module.exports = function(defaults) {
  return new Angular2App(defaults, {
    vendorNpmFiles: [
      'normalize-path/index.js',
    ]
  });
};

// system-config.ts 

const map: any = {
  'normalize': 'vendor/normalize-path',
};

/** User packages configuration. */
const packages: any = {
  'normalize': {main: 'index.js'},
};

// app.component.ts

import { normalize } from 'normalize-path';

编辑会抱怨:

找不到模块'normalize-path'.

代码将无法编译.但我真的不知道出了什么问题.

我只是好奇,在normalize.css等宽字体规则中包含

font-family: monospace, monospace;

有什么不同吗？

font-family: monospace;

？必须有理由使用它.也许这是某些浏览器行为的解决方法？

我在JSFiddle的HTML中尝试了一些带有无序列表的代码,我对死亡感到恼火,因为发现<ul>没有明显原因的子弹会显示出来.在对我的代码尝试不同的事情时,我终于意识到我需要在jsfiddle页面上取消选中"normalized css"选项.

之后我用Google搜索了它实际上是什么,并从W3C.org 阅读了这个页面.这个页面只讨论变音符号和重音符号,我明白了.但为什么没有检查标准化css选项的子弹？如果选择该选项,会受到哪些其他影响？

谢谢你的关注.

我已经在我的项目中安装了 Modern-normalize，并且从 sass 文件中我尝试包含它的 css 文件，如下所示：

@use '~modern-normalize/modern-normalize' as *;\n

然而我不断收到这个消息：

\n

错误：找不到要导入的样式表。\xe2\x95\xb7 9 \xe2\x94\x82 @use\n'~modern-normalize/modern-normalize' as *; \xe2\x94\x82\n^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ^^^^

\n

即使在我的 IDE (vscode) 中，我可以 CMD+单击它，它会很好地导航并打开文件，我在我的 node_modules 目录中看到

我是否缺少一些与配置相关的东西？

刚刚将包添加normalize-scss到我的新 Vue 项目中，但没有应用任何样式......我都尝试过：

@import 'normalize-scss' 在我的 styles.scss

import 'normalize-scss'在我的main.js页面

难道我做错了什么？该包显然存在，因为该应用程序在运行，但它实际上并未应用任何 css 规则。

我使用命令搭建了一个新的Nuxt.js项目npx create-nuxt-app，并将Bulma用于 UI 框架。我了解到 bulma.css 文件已包含在具有以下配置的nuxt.config.js文件中。

modules: [
  '@nuxtjs/bulma'
]

但后来我想使用normalize.css来确保样式在所有浏览器中保持一致。为了使其正常工作，应将此 normalize.css 文件包含在所有 css 文件的顶部。

我试过将它导入到这样的layout/default.vue文件中。（我参考了这个）

<style lang="scss">
  @import '~/node_modules/normalize.css/normalize.css'
</style>

但是后来我在 Chrome devtools 上检查时了解到 normalize.css 文件实际上包含在底部。

在 normalize.css 之前包含的样式是bulma.css

所以问题是：如何在这个 Nuxt.js 项目中正确导入normalize.css以便将其导入/包含在 css 文件列表的顶部？