NodeJS 项目加入 Normalize.css

原创

tonglei0429

发布于 2022-04-21 10:34:06

9080

文章被收录于专栏：信息安全小学生信息安全小学生

基本介绍：

Normalize.css 是一个精炼的样式文件，它调整了部分网页元素的默认样式，使得网页可以在不同浏览器上呈现出一致的效果。

资源地址：

normalize.css - npm (npmjs.com)

安装方法：

NPM

npm install --save normalize.css

CDN

https://yarnpkg.com/en/package/normalize.css

下载

https://necolas.github.io/normalize.css/latest/normalize.css

在 VUE 项目中使用：

方法一：

在 main.ts 中导入。

// src/main.ts

import { createApp } from "vue";
import App from "./App.vue";
import router from "./router/index";
import "normalize.css"; // 引入 css 文件

createApp(App).use(router).mount("#app");

方法二：

在 App.vue (或任意vue文件) 中导入

// src/App.vue
<template>
  <router-view></router-view>
</template>

<style>
/* 引入样式 */
@import url("normalize.css");
</style>

方法三：

在 index.html 中引入

// index.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" href="/favicon.ico" />
    <!-- 引入 (CDN) 样式文件 -->
    <link rel="stylesheet" type="text/css" href="https://unpkg.com/browse/normalize.css@8.0.1/normalize.css" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>富而喜悦</title>
  </head>
  <body>
    <div id="app"></div>
    <script type="module" src="/src/main.ts"></script>
  </body>
</html>

方法四：

在 css 文件中引入

/* src/assets/style.css */
@import url('normalize.css');

/* 自定义其他样式 */

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

node.js

vue.js

css

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

node.js

vue.js

css

登录后参与评论

0 条评论

热度

NodeJS 项目加入 Normalize.css

NodeJS 项目加入 Normalize.css

基本介绍：

资源地址：

安装方法：

在 VUE 项目中使用：

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐