スタイルシートについて
cssの読み込む順番は、外部スタイルシートを使用した場合を紹介しています。
スタイルシート(CSS)は以下の順番で読み込まれます。複数の場所で同じ要素に設定すると、後から読み込まれた場所を優先、上書きされます。
また、スタイルの指定には「#」「.」の2種類の指定方法がありますが、「#」で指定したスタイルは、順番に関係なく「.」ピリオドより優先されます。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_Jis">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>タイトル</title>
<link rel="stylesheet" href="css/style.css" type="text/css"> 1
<style type="text/css"> 2
<!--
div.background p { background-color: #fff8dc }
-->
</style>
</head>
<body>
<div class="background">
<p style="background-color:#e6e6fa">Home</p> 3
<p>Back</p>
</div>
<p>Next</p>
~~~~~~~~ 略 ~~~~~~~
外部スタイルシートを2枚使用
外部CSSを2枚使用する場合も、上から順番に読み込まれます。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_Jis">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>タイトル</title>
<link rel="stylesheet" href="css/style.css" type="text/css"> 1
<link rel="stylesheet" href="css/style2.css" type="text/css"> 2
~~~~~~~~ 略 ~~~~~~~