The differences between HTML inline elements, block elements, and inline block elements
HTML can classify elements into inline elements, block elements and inline block elements. First of all, the three can be converted to each other. Using the display attribute, the three can be converted arbitrarily:
1 display:inline; Convert to inline elements
2 display:block; Convert to block elements
3 display: inline – block; Convert to inline block elements
`
<head> <meta charset=" utF-8 "/> <title> Test case </title> <style type="text/ CSS "> span {display: block; width: 120px; height: 30px; background: red; } div { display: inline; width: 120px; height: 200px; background: green; } i { display: inline-block; width: 120px; height: 30px; background: lightblue; } < / style > < / head > < body > < span > turn inline block < / span > < div > block turned within < / div > < I > inline turned inside block < / I > < / body >Copy the code