「インライン要素」と「ブロックライン要素」の違いと要素の変更方法（動画解説）
WEB制作で必ず認識しておかないといけない
「インライン要素」と「ブロックライン要素」の違いと要素の変更方法について動画で解説させていただきます！
解説動画
サンプルデータdownloadはこちら
HTML,CSS初期設定の方法
サンプルデータ
HTML
<body>
<section>
<h2>ブロックライン要素 (一部)</h2>
<p>段落</p>
<hr>
<h3>見出し</h3>
<hr>
<ul>
<li>リスト</li>
<li>リスト</li>
<li>リスト</li>
</ul>
<hr>
<div>div</div>
<hr>
</section>
<section>
<h2>インライン要素 (一部)</h2>
テキスト
<hr>
<a href="#">リンクタグ</a>
<hr>
<img src="https://cdn.pixabay.com/photo/2019/05/08/21/21/cat-4189697_960_720.jpg">
<hr>
<span>span</span>
</section>
</body>CSS
@charset "utf-8";
body{
padding: 2em;
background: rgb(134, 189, 210);
}
section{
margin-bottom: 2em;
background: #fff;
padding: 1em;
}
h2{
margin-bottom: .5em;
font-size: 2em;
}
img{
width: 300px;
height: auto;
}