相対パス
自分自身を基準に、そこから見てどの場所にあるファイルか
三軒左隣に届けて、という感じ
絶対パス
世界中のどこからみてもそこにある
京都府京都市左京区●●という感じ
ネットではhttp://から書く
基本的に、自分のサイト内でリンクさせるときは
相対パスで書くのが普通
上の階層を見に行くときの書き方
../css/style.css
ドットドットスラッシュと記述する
一度、そのフォルダを出る感じ
相対パスは画像やPHPでも使うので、
自分でいろいろ作ってみて理解しておく
いま、<h2>の項目が2つあって（ドライブと釣り）
その両方の背景にcssで色がついている
ドライブの文字だけ背景の色を変えたいとする
この時、かたっぽだけ<h3>にするのはよくない
なぜなら構造が変わってしまう
構造は変えずに色だけかたっぽかえたい
そういうときは、属性を使って名前をつける
付ける方法は２つある
id属性と、
class属性
これは目印をつけるだけで構造は変えない
hobby.htmlを修正
<h2 id="drive">ドライブ</h2>
style.cssを修正。これを付け足す。
#drive{
background:olive;
}
hobby.html
style.css
id属性
同じid名は1つのhtml上にダブって存在してはいけない。1つだけ
セレクタの書き方は
#id名
class属性
同じclass名が、１つのhtml上に複数存在してもいい
セレクタの書き方は
.class名
どういうときにclass属性が生きるかというと、
例えば<h2>の1つめと、<p>の２つめの文字を緑にしたいとき
<h2>と<p>は違うものだが、classを使えばいっぺんに同じようにグリーンにできる
hobby.html側
<h2 id="drive" class="green">ドライブ</h2>
<p>ドライブが好きな理由を書くところやで</p>
<h2>釣り</h2>
<p class="green">釣りが好きな理由を書くところですよ</p>
style.css側
.green {color:#007042;
}
これでいっぺんに文字色を緑にできる
chromeで右クリックして、一番下の「検証」を押すと
htmlの構造をみることもできる
好きなサイトの構造をそうやってみて、勉強するといい
このアイコンを押すと、また別の方法でどういう風になっているかが表示できる
