前の言葉
Web の初期の頃、HTML は非常に限定された言語であり、見た目は気にされませんでした。それは単なる簡潔なマークアップ メカニズムでした。 Mosaic Web ブラウザの出現により、Web サイトがあらゆる場所に出現し始めました。ページの外観を変更する必要性が高まったため、 や などのマークアップ要素が追加されました。数年後、ほとんどの Web サイトのマークアップは、ほぼ完全に表とフォント要素で構成され、それらが表現することを目的としたコンテンツに本当の意味を伝えることができず、ドキュメントが使いにくくなり、保守が困難になりました。そこで 1995 年に、W3C は構造とスタイルが混在する問題を解決するために CSS をリリースしました。
外部スタイルシート
【linkタグを使用する】
linkタグ内では、rel属性とhref属性は必須で、type属性とmedia属性は省略可能です
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><link rel="stylesheet" href="sheet1.css"><title>Document</title></head><body></body> </html>
body{ background-color: red;} [注] スタイルシートには HTML マークアップ言語を含めることはできません。CSS ルールと CSS コメントのみを含めることができます
/*若CSS文件中存在除了CSS样式和CSS注释的其他标记，则会导致在该标记后面的CSS样式将无法被识别*/<style></style>body{ background-color: red;}
【複数のスタイルシート】
ドキュメントは複数のスタイルシートに関連付けられている場合があり、その場合、ドキュメントは最初に表示されるときにスタイルシートとして rel を含むリンクタグのみを使用します
rel 属性を設定します。 代替スタイルシートの候補スタイルシートを定義できます。これは、ユーザーがこのスタイルシートを選択したときにドキュメントの表示にのみ使用されます。ブラウザが候補スタイル シートを使用できる場合、リンク要素の title 属性値を使用して候補スタイルのリストが生成され、メニュー バーの [表示] -> [スタイル] で選択できます。 (IE、Firefox対応)
【注意】候補スタイルシートにタイトルが設定されていない場合、候補スタイルシートリストに表示されず、参照することができません
れーれー
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><link rel="stylesheet" href="sheet1.css"><link rel="stylesheet" href="sheet2.css"><title>Document</title></head><body></body> </html>
/*sheet1*/body{ background-color: red;}
内部スタイル シート
【style 要素を使用する】
内部スタイル シートには、文書内に別途表示されるスタイル シートを含めるために
/*sheet2*/body{ height: 100px; border: 10px solid black;}
【複数のスタイルタグ】
文書内に複数のスタイルタグを出現させることができ、スタイルルールはカスケードスタイルルールと一致します
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><link rel="stylesheet" type="text/css" href="sheet1.css" /><link rel="alternate stylesheet" type="text/css" href="sheet2.css" title="sheet2"/><title>Document</title></head><body></body> </html>
【@importディレクティブを使用する】
link と同様に、 @import ディレクティブは、Web ブラウザーに外部スタイル シートをロードし、HTML ドキュメントをレンダリングするときにそのスタイルを使用するように指示するために使用されます。唯一の違いは、コマンドの特定の構文と配置です。 @import ディレクティブは、スタイル シートで別のスタイル シートのスタイルを使用する必要がある場合によく使用されます。
/*sheet1*/body{ background-color: red;} [注意] @import は style 要素内で他の CSS ルールの前に配置する必要があります。そうしないとまったく機能しません。
/*sheet2*/body{ height: 100px; border: 10px solid black;}
【複数の @import ディレクティブ】
@import ディレクティブを使用して複数の CSS スタイル シートをインポートしたり、メディアを使用してアプリケーション シナリオを制限したりできます。
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><style>body{ background-color: red;} </style><title>Document</title></head><body></body> </html>
インライン スタイル (インライン スタイル)
ネストされたスタイル シートや外部スタイル シートを使用せずに、単一の要素にいくつかのスタイルを指定したいだけの場合は、HTML style 属性を使用してインライン スタイルを設定できます。 ...
HTMLを超えて：Web開発のための重要なテクノロジーApr 26, 2025 am 12:04 AM強力な機能と優れたユーザーエクスペリエンスを備えたWebサイトを構築するには、HTMLだけでは十分ではありません。次のテクノロジーも必要です。JavaScriptは、Webページに動的とインタラクティブ性を与え、リアルタイムの変更がDOMを操作することで達成されます。 CSSは、美学とユーザーエクスペリエンスを向上させるために、Webページのスタイルとレイアウトを担当しています。 React、Vue.JS、Angularなどの最新のフレームワークとライブラリは、開発効率とコード組織構造を改善します。
HTMLのブール属性とは何ですか？いくつかの例を挙げてください。Apr 25, 2025 am 12:01 AMブール属性は、値なしでアクティブ化されるHTMLの特別な属性です。 1.ブール属性は、無効化された入力ボックスを無効にするなど、存在するかどうかによって、要素の動作を制御します。 2.彼らの実用的な原則は、ブラウザが異なっているときに属性の存在に応じて要素の動作を変更することです。 3.基本的な使用法は、属性を直接追加することであり、高度な使用法はJavaScriptを介して動的に制御できます。 4.一般的な間違いは、値を設定する必要があると誤って考えており、正しい執筆方法は簡潔にする必要があります。 5.ベストプラクティスは、コードを簡潔に保ち、ブールのプロパティを合理的に使用して、Webページのパフォーマンスとユーザーエクスペリエンスを最適化することです。
HTMLコードをどのように検証できますか？Apr 24, 2025 am 12:04 AMHTMLコードは、オンラインバリデーター、統合ツール、自動化されたプロセスを使用するとクリーンになります。 1）w3cmarkupvalidationserviceを使用して、HTMLコードをオンラインで確認します。 2）リアルタイム検証のためにVisualStudiocodeにhtmlhint拡張機能をインストールして構成します。 3）HTMLTIDYを使用して、建設プロセスでHTMLファイルを自動的に検証およびクリーニングします。
HTML対CSSおよびJavaScript：Webテクノロジーの比較Apr 23, 2025 am 12:05 AMHTML、CSS、およびJavaScriptは、最新のWebページを構築するためのコアテクノロジーです。1。HTMLはWebページ構造を定義します。2。CSSはWebページの外観に責任があります。
マークアップ言語としてのHTML：その機能と目的Apr 22, 2025 am 12:02 AMHTMLの機能は、Webページの構造とコンテンツを定義することであり、その目的は、情報を表示するための標準化された方法を提供することです。 1）HTMLは、タイトルやパラグラフなどのタグや属性を使用して、Webページのさまざまな部分を整理しています。 2）コンテンツとパフォーマンスの分離をサポートし、メンテナンス効率を向上させます。 3）HTMLは拡張可能であり、カスタムタグがSEOを強化できるようにします。
HTML、CSS、およびJavaScriptの未来：Web開発動向Apr 19, 2025 am 12:02 AMHTMLの将来の傾向はセマンティクスとWebコンポーネントであり、CSSの将来の傾向はCSS-in-JSとCSShoudiniであり、JavaScriptの将来の傾向はWebAssemblyとServerLessです。 1。HTMLセマンティクスはアクセシビリティとSEO効果を改善し、Webコンポーネントは開発効率を向上させますが、ブラウザの互換性に注意を払う必要があります。 2。CSS-in-JSは、スタイル管理の柔軟性を高めますが、ファイルサイズを増やす可能性があります。 CSShoudiniは、CSSレンダリングの直接操作を可能にします。 3. Webassemblyブラウザーアプリケーションのパフォーマンスを最適化しますが、急な学習曲線があり、サーバーレスは開発を簡素化しますが、コールドスタートの問題の最適化が必要です。
HTML：構造、CSS：スタイル、JavaScript：動作Apr 18, 2025 am 12:09 AMWeb開発におけるHTML、CSS、およびJavaScriptの役割は次のとおりです。1。HTMLは、Webページ構造を定義し、2。CSSはWebページスタイルを制御し、3。JavaScriptは動的な動作を追加します。一緒に、彼らは最新のウェブサイトのフレームワーク、美学、および相互作用を構築します。
HTMLの未来：ウェブデザインの進化とトレンドApr 17, 2025 am 12:12 AMHTMLの将来は、無限の可能性に満ちています。 1）新機能と標準には、より多くのセマンティックタグとWebComponentsの人気が含まれます。 2）Webデザインのトレンドは、レスポンシブでアクセス可能なデザインに向けて発展し続けます。 3）パフォーマンスの最適化により、応答性の高い画像読み込みと怠zyなロードテクノロジーを通じてユーザーエクスペリエンスが向上します。
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。
人気の記事
ホットツール
mPDF
mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。
SecLists
SecLists は、セキュリティ テスターの究極の相棒です。これは、セキュリティ評価中に頻繁に使用されるさまざまな種類のリストを 1 か所にまとめたものです。 SecLists は、セキュリティ テスターが必要とする可能性のあるすべてのリストを便利に提供することで、セキュリティ テストをより効率的かつ生産的にするのに役立ちます。リストの種類には、ユーザー名、パスワード、URL、ファジング ペイロード、機密データ パターン、Web シェルなどが含まれます。テスターはこのリポジトリを新しいテスト マシンにプルするだけで、必要なあらゆる種類のリストにアクセスできるようになります。
VSCode Windows 64 ビットのダウンロード
Microsoft によって発売された無料で強力な IDE エディター
SublimeText3 中国語版
中国語版、とても使いやすい
WebStorm Mac版
便利なJavaScript開発ツール
ホットトピック
7716
15164114139652128925123329