行内元素和块级元素的区别? 分别有哪些?

什么是块级元素:

块级元素是指在文档流中以块的形式展现的元素，它们会在前后生成新的一行并且自动换行。例如<div>、<p>、<h1>~<h6>等
块级元素的特点:

1. 块级元素会自动换行，并占据一整行的宽度；
2. 可以设置宽度、高度、内边距和外边距；
3. 可以嵌套其他块级元素和行内元素；
4. 可以设置 CSS 样式，比如背景颜色、字体样式等。

什么是行内元素:

行内元素是指在文档流中流动的元素，通常用来包含文本或其他行内元素。
例如:<span>、<a>、<hr>、<span>、<em>、<strong>等
行内元素的特点:

行内元素和块级元素的区别

• 行内元素与块级函数可以相互转换，通过修改display属性值来切换块级元素和行内元素，行内元素display：inline，块级元素display：block

• 块级元素写完后会自动换行(独占一行)，有宽高可以修改

• 行内元素不从新行开始，只占用必要宽度；块级元素总是从新行开始，并占用其父元素的可用的全部宽度。

行内元素演示如下:

<a href="">定义超链接</a>
<br>  换行 
<hr>  水平线
<span>组合文档中的行内元素</span>
<ins>下划线</ins>
<u>下划线</u>
<del>删除线</del>
<s>删除线</s>
<b>加粗</b>
<strong>加粗</strong>
<em>倾斜</em>
<i>倾斜</i>
<img src="" alt="定义html图像">
<select>
  <option>创建多选菜单或单选</option>
</select>
<textarea>文本域</textarea>

块级元素演示如下:

<!--标题元素 <h1> 到 <h6>：用于定义标题，
从 <h1>（最高级别）到 <h6>（最低级别）。-->
<h1>标题标签1</h1>
<h2>标题标签2</h2>
</h3>标题标签3</h3>
</h4>标题标签4</h4>
</h5>标题标签5</h5>
</h6>标题标签6</h6>
<div>定义文档中的节</div>
<p> 段落</p>
<table> 表格</table>
<ol> 有序列表</ol>
<ul> 无序列表</ul>
<dl> 自定义列表</dl>
<li>定义有序列表或无序列表的列表项目</li>
<video> 嵌入视频</video>
<audio> 嵌入音频</audio>
<form> 表单</from>