HTMLの基本 No.001 インライン要素の設定

インライン要素の設定

インライン要素は幅と高さを設定できない

```html

<span>インライン要素の設定</span>

<span>インライン要素の設定</span>

<span>インライン要素の設定</span>

<span>インライン要素の設定</span>

```

インライン要素に高さと幅を設定したい場合はブロック要素にするか、ブロック要素で囲みそちらで高さと幅を設定する。

##インライン要素をスタイルでブロック要素にする

```html

<span>インライン要素の設定</span>

<span>インライン要素の設定</span>

<span>インライン要素の設定</span>

<span>インライン要素の設定</span>

<style>

span {

display: block;

}

</style>

```

##ブロック要素で囲む

```html

<div class="inline_setting">

<span>インライン要素の設定</span>

</div>

<div class="inline_setting">

<span>インライン要素の設定</span>

</div>

<div class="inline_setting">

<span>インライン要素の設定</span>

</div>

<div class="inline_setting">

<span>インライン要素の設定</span>

</div>

```

inline-blockは幅をそのままにBrowserなどの幅が可変した際は回り込ませることができるので便利