見出し画像

デイトラDAY13 Bootstrap学習記録

今回の課題はBootstrapを使って自力でサイトをデザインした。できなかったところをまとめる

1,Navbarの右揃え


 mr‐autoを使うと、右側にmarginができるので左揃えになる。ml-autoにすれば、逆になり右揃えになる。

2,背景画像が表示されなかった


 CSSで背景画像を指定しても、ブラウザに表示されなかった。原因は単純にHTMLにCSSファイルを読み込んでなかったからだった。デイトラの質問部屋に全く同じことをしていた人がいた。Bootstrapに注意が散漫してしまった。

3,セレクタの優先順位


 CSSのセレクタには優先順位がある。
 idセレクタ<classセレクタ<要素型(タイプ)セレクタ<全称セレクタ
idやclassで指定する方が優先順位が高く、h1やpで指定するよりも優先される。
 たとえば、top-titleクラスのh1タグを装飾するとき

h1 { 
   font-size: 10px;
}

よりも

.top-title {
   font-size: 48px;
}

の方が優先されやすい。結果的に、top-titleクラスのh1は48pxになる。

いいなと思ったら応援しよう!