埋め込み
<style> タグを通じて CSS スタイルを導入します。
文法形式: <style type = “text/css”></style>
ヒント: <style> の CSS スタイルは、現在の Web ページでのみ使用できます。
同じ Web ページ内に <style> タグが複数回出現する可能性があります。
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>php.cn</title>
<style type="text/css">
h1{
color:red;
}
</style>
</head>
<body>
<h1>习近平心中的互联网</h1>
<p>互联网是20世纪最伟大的发明，它正在将人类“一网打尽”，人们在不知不觉中已经融入了互联网生态，互联网让世界变成了“鸡犬之声相闻”的地球村。</p>
</body>
<style type="text/css">
p{
color:blue;
}
</style>
</html>
概要
この場合、<link> タグを使用して、共通の CSS コードを複数の Web ページで共有できます。
<リンク> ファイルの種類。値: スタイルシート
タイプ: コンテンツタイプ。 - 注:
<link> タグは <head> 内に配置されます。
インライン (主に要素のスタイルを制御するために JS で使用されます)
すべての HTML タグには、クラス、ID、タイトル、スタイルなどの共通の属性があります。 HTML タグの style 属性の値は、CSS の style とまったく同じです。
注:
インライン スタイルでは、CSS コードをあまり多く記述することはできません。
インライン スタイルでは、複数の CSS 属性をラップすることはできません。つまり、1 行で記述することはできません。
インライン スタイルは最も高い優先度を持ち、ID セレクターよりもさらに高くなります。
- 先ほどの優先順位の例では、この導入方法を使用しました
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>php.cn</title>
<style type="text/css">
h1{
color:green;
}
.hclass{
color:bule;
}
#hid{
color:black;
}
</style>
</head>
<body>
<div>
<h1 class="hclass" id="hid" style="color:red">习近平心中的互联网</h1>
</div>
</body>
</html>
次のセクション
