#ブロック要素
・見出しh1～6や段落のこと
・ひとかたまりとなる要素
・要は箱
・横幅を指定してあげないと基本100%となる
・高さ「 height 」と余白「 padding 」を指定することができる
html
<div>
<a href="～～.com"><img src="画像の置き場所" alt="画像説明"></a>
</div>
##主なブロック要素##
| コード | 内容 |
|---|---|
| div | 入れすぎるとみっともないけどかなり便利なディブ子ちゃん。この子自体に意味はない |
| h1～h6 | 見出し |
| header | ヘッダー |
| main | メイン |
| footer | フッター |
| section | メニューやサイドメニュー等 |
| article | 記事にしたい文章 |
| p | 段落 |
| hr | 罫線 |
| table | テーブル |
| ul,ol,dl | リストたち |
###CSSで指定してあげることによってインライン要素もブロック要素として扱うことができる
・classまたはidまたはブロック要素に効かせてあげる
「 display:block; 」
html
<p class="display">test</p>
CSS
.display{
display: block;
height: 100px;
padding: 10px;
}
###基本的に横並びにはできない
・基本横幅100%だから
・どうしてもしたかったら「 float 」を使ってあげる
css
.display{
display: block;
float: left;
height: 100px;
padding: 10px;
}