CSS インライン スタイル、埋め込みスタイル、外部参照スタイルを使用する 3 つの方法
|
3 つの方法を使用する簡単な例は次のとおりです。 インラインスタイル: <!doctypehtml> <html> <ヘッド> <メタ文字セット="UTF-8"> <title>CSS インライン スタイル</title> </head> <本文> <div style="width:100px;height:100px;background:red;"></div>> </本文> </html> インラインスタイル:
<!!doctype html>
<html>
<ヘッド>
<メタ文字セット="UTF-8">
<title>CSS 埋め込みスタイル</title>
</head>
<本文>
<スタイル タイプ="text/css">
#div{幅:100px;高さ:100px;背景:赤;}
</スタイル>
<div id="div"></div>>
</本文>
</html>
外部タイプ: <!doctypehtml> <html> <ヘッド> <メタ文字セット="UTF-8"> <title>CSS 埋め込みスタイル</title> <link rel="スタイルシート" type="text/css" href="ccss.css"> </head> <本文> <div id="div"></div>> </本文> </html> cssファイル
#div{幅:100px;高さ:100px;背景:赤;}
要するに： インライン スタイル: コードは特定の Web ページ上の要素に記述されます。例: <div style="color:#f00"></div> インライン: </head> の前に記述します。例: <style type="text/css">.div{color:#F00}</style> 外部スタイル: 外部 CSS ファイルを参照します。例: <link href="css.css" type="text/css" rel="stylesheet" /> 以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 |
<<: VirtualBox に CentOS、JDK、Hadoop をインストールする詳細なチュートリアル
>>: 初心者でもウェブサイトアイコンを作成する手順をすぐに学べます
推薦する
Vueを使い始める際に習得する必要がある知識について簡単に説明します
最も人気のあるフロントエンド フレームワークの 1 つとして、Vue は多くのフロントエンド開発エン...
Centos7 への mysql8.0rpm のインストール チュートリアル
まず、図をダウンロードしてください 1. まず、centos7に付属しているmariadbをアンイン...
Windows Apache 環境で SSL 証明書を展開して、Web サイトを https 対応にする方法
SSL 証明書の使用についてはここでは説明しません。SSL 証明書を導入する必要がある友人は、すでに...
MySql 8.0 と対応するドライバー パッケージの一致に関する注意事項
MySql 8.0 対応ドライバパッケージのマッチングMySql データベースをバージョン 8.0 ...
MySQL の NULL 値に関する体験談と分析チュートリアルシリーズ
目次1. テストデータ2. ヌル値による不便3. スペース、空の値、null をどのように判断すれば...
本をめくる効果を実現するネイティブJS
この記事では、ネイティブ JS で実装された本をめくる効果の図を紹介します。効果は次のとおりです。 ...
JavaScript を使用してハイパーリンクのリダイレクトを防ぐ方法 (複数の書き方)
JavaScript を使用すると、ハイパーリンクがジャンプするのを防ぐことができます。方法は次の...
jQueryはテーブルのシームレスなスクロールを実現します
この記事の例では、テーブルのシームレスなスクロールを実現するためのjQueryの具体的なコードを参考...
背景とリンクとして画像を書き込む方法（背景画像＋リンク）
写真を背景にしてリンクを記載します。たとえば、ウェブサイトのロゴ画像などです。例: ポテトのロゴ画像...
Vue プロジェクトで mock.js を使用するための完全な手順
Vue プロジェクトで mock.js を使用する開発ツールの選択: Vscode 1. コマンドラ...
vue+element テーブルで動的な列フィルタリングを実装するためのサンプルコード
要件: データをリスト形式で表示する場合、表示すべき情報項目が多く、表が横に長くなってしまいます。表...
{{ }} で関数を直接使用する WeChat アプレットの例
序文WeChat アプレット開発 (ネイティブ wxml、wxcss) で、{{ }} 内で直接メソ...
Docker Compose を使用して nginx のロード バランシングを実装する方法
Dockerネットワーク管理とコンテナIP設定に基づいてNginxロードバランシングを実装するすべて...
MySQL トランザクション分離レベルの原則例分析
導入あなたも面接でこれに遭遇したことがあるはずです。トランザクションの分離レベルについてお話ししまし...
Centos7環境でMySQL 5.6のインスタンスを複数作成する方法の詳細な説明
この記事では、CentOS 7 環境で MySQL 5.6 の複数のインスタンスを作成する方法につい...