CSS導入方法4つのまとめ(共有)

CSS導入方法4つのまとめ(共有)

1. インライン参照:ラベルに直接使用されるが、メンテナンスコストが高い

スタイル='フォントサイズ:16px;色:#000000'

2. 外部リンク参照: CSSコードはHTMLコードから分離されており、コードの再利用に便利です。

<link href="css/style.css" type="text/css" rel="スタイルシート" />

style.css ファイルの内容は次のとおりです。

.font{色:青;フォントサイズ:12px;}

3. 内部参照: ページは明確になりますが、他のページからは使用できません

<スタイル タイプ = 'text/css'>
    .font{色:青;フォントサイズ:12px;}
</スタイル>

4. 外部インポート: 1 つの HTML ファイルに複数のスタイルシートをインポートできます。外部リンク参照に類似

これをHTMLファイルのheadタグに追加します

<スタイル タイプ = 'text/css'>
    @import url('./style/style.css');
</スタイル>

以上、CSS導入方法4つのまとめ(共有)が、編集長が皆さんに共有する内容の全てです。皆さんの参考になれば幸いです。また、123WORDPRESS.COMを応援していただければ幸いです。

<<:  Jsonフォーマットの詳細な説明

>>:  ユニアプリプロジェクトでのウォーターフォールレイアウトの実装

推薦する

Centos での Python のアップグレードと Mongodb ドライバーのインストールに関する問題

Python バージョンを確認します (python -V)。2.7 未満の場合は、アップグレードす...

CSS でのフィルタープロパティの使用に関する詳細な説明

フィルター属性は要素の視覚効果を定義しますぼかし画像にガウスぼかしを適用します。 「半径」の値は、ガ...

vue.config.js からプロジェクト最適化までの vue2.x 構成

目次序文vue.config.js 構成オプションパッケージサイズを縮小するためのパッケージの最適化...

Windows 10 での MySQL 8.0.12 解凍バージョンのインストール グラフィック チュートリアル

この記事は、MySQL 8.0.12解凍版のインストールグラフィックチュートリアルを記録しています。...

ライフゲームの JavaScript 実装

目次コンセプト紹介論理的ルール完全なコード主な実装コンセプト紹介セルオートマトンとは、コンピュータの...

Linux 仮想ホストで SourceGuardian (sg11) 暗号化コンポーネントを有効にする詳細な手順

注: sg11 弊社では Linux システム仮想ホストのセルフインストールのみサポートしております...

vue $http の get および post リクエストのクロスドメイン問題を解決する

Vue $http get および post リクエストのクロスドメイン問題まずconfig/ind...

mysql5.7のインストールとNavicateの長期無料利用の実施手順

(I) mysql5.7のインストール: ❀詳細:無料のグリーンバージョン5.7のインストール方法は...

Vue でスクロールバーのスタイルを変更する方法

目次まず、スクロール バーのスタイルを変更するには、疑似要素-webkit-scrollbarを使用...

VMware Workstation Pro 16 グラフィックチュートリアル (CentOS8 仮想マシン クラスタの構築)

目次準備VMware Workstation Pro 16 をインストールするLinux仮想マシンの...

初心者向けに Docker に Jenkins をインストールする方法を詳しく説明したチュートリアル

Jenkins はオープンソース ソフトウェア プロジェクトです。Java をベースに開発された継続...

JavaScriptイベント実行メカニズムの深い理解

目次序文ブラウザJS非同期実行の原理ブラウザのイベントループ実行スタックとタスクキューマクロタスクと...

Centos7 で keepalived ログを別のパスに設定する方法の詳細な説明

Keepalived のインストール: cd <keepalived_sourcecode_p...

カルーセル効果を作成するためのjs

カルーセルはフロントエンド開発において比較的重要なポイントだと思います。ネイティブjsの知識ポイント...

Zabbix カスタム監視 nginx ステータス実装プロセス

目次Zabbix カスタム監視 nginx ステータス1. ステータスインターフェースを開く2. 監...