body{} " などのコードを使用して、手書きスタイルを直接適用します。 2. " などの構文を使用して、外部 CSS ファイルの書き込みメソッドを適用します。 @import './index.css'"。"/> body{} " などのコードを使用して、手書きスタイルを直接適用します。 2. " などの構文を使用して、外部 CSS ファイルの書き込みメソッドを適用します。 @import './index.css'"。">

ホームページ  >  記事  >  ウェブフロントエンド  >  vuejsでCSSを使用する方法

vuejsでCSSを使用する方法

藏色散人
藏色散人オリジナル
2021-09-12 15:07:243419ブラウズ

vuejs で CSS を使用する方法: 1. 手書きスタイル、「」などのコードを直接適用します; 2. 外部 CSS ファイルの書き込み、「」などの構文を適用します。 @import './index.css'"。

vuejsでCSSを使用する方法

この記事の動作環境: Windows 7 システム、Vue バージョン 2.9.6、DELL G3 コンピューター。

Vue.js で CSS を使用するには?

css 部分について

vue-cli で css スタイルを記述するには sass およびless を使用します。vue-cli には既に sass およびless が設定されているため、手順は非常に簡単です。 . 、sass 以下を使用して 2 つのモジュールを直接ダウンロードする必要があり、その後、webpack は適切なローダーを自動的に使用して、lang 属性に基づいてそれらを処理します。各 CSS の使用方法を見てみましょう

#css

1. 手書きスタイルを適用し、CSS ルールを使用するだけです。

2. 外部 CSS ファイルを適用する方法

Scss の使用方法


1 Sass モジュール

2 をインストールします。コンポーネントのstyle部分 インライン記述

#3. Sass外部ファイルを引用する書き方。

#Less の使用方法


#1. Less モジュールをインストールします

2. コンポーネントのスタイル部分でインライン記述を使用します

##3. 外部ファイルの引用を減らす方法。

関連する推奨事項: 「vue.js チュートリアル

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

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