ホームページ >ウェブフロントエンド >Vue.js >VueでCSSを参照する方法

VueでCSSを参照する方法

醉折花枝作酒筹
醉折花枝作酒筹オリジナル
2021-07-26 13:33:0334843ブラウズ

Vue は CSS メソッドを指します: 1. グローバル導入、構文形式は「import 'css file address'」; 2. ローカル導入、構文形式は「bab64a26f295faccf2facf6b9a41e4d8@import 'css file」アドレス' ;531ac245ce3e4fe3d50054a55f265927”。

VueでCSSを参照する方法

このチュートリアルの動作環境: Windows7 システム、vue2.9.6 バージョン、Dell G3 コンピューター。

Vue (/vjuː/ と発音、ビューに似ています) は、ユーザー インターフェイスを構築するための進歩的な JavaScript フレームワークです。他の大きなフレームワークとは異なり、Vue は下から上にレイヤーごとに適用されるように設計されています。

外部 CSS ファイルを vue に導入する:

プロジェクトの src ファイルの下に、CSS ファイルを保存する新しいスタイル フォルダーを作成します。

1. Global import

スタイル ファイルの下に外部の css ファイルを置きます。外部ファイルを導入するには、main.js ファイルにインポートするだけです。

import './style/reset.css'

導入しました明確なデフォルト スタイル CSS ファイル

2。ローカルの導入

<style scoped>
  @import &#39;../assets/iconfont/iconfont.css&#39;;这个分号一定要写,要不会报错
</style>

@import CSS@ ルールは、他のスタイル シートからスタイル ルールをインポートするために使用されます。これらのルールは、@charset ルールを除く他のすべてのタイプのルールよりも前に置く必要があります。これはネストされたステートメントではないため、@import はルールの条件付きグループ内で使用できません。

したがって、ユーザー エージェントはサポートされていないメディア タイプのリソースの取得を回避でき、作成者はメディアに依存する @import ルールを指定できます。これらの条件は、URI の後にカンマで区切って指定されたメディア クエリをインポートします。メディア クエリがなければ、インポートは無条件で行われます。すべてのメディアが同じ効果を持つことを指定します。

[推奨学習: JavaScript 上級チュートリアル]

以上がVueでCSSを参照する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。