CSS行内块元素与行内元素的区别?
它们的区别主要有以下几点：
1、CSS有个属性叫做display，其取值可以为inline-block。W3CSchool中说display 属性规定元素应该生成的框的类型。
2、display：inline-block；可以让元素具有块级元素和行内元素的特性：既可以设置长宽，可以让padding和margin生效，又可以和其他行内元素并排。是一个很实用的属性。
3、元素可以设置weith和height，行内元素设置width和height无效，而且块级元素即使设置宽度也还是独占一行。
4、块级元素可以设置margin和padding属性，行内元素水平方向的margin和padding如margin-left、padding-right可以产生边距效果，但是竖直方向的如padding-top和margin-bottom不会产生边距效果。
5、display其中块级元素对应display：block，行内元素对应display：inline。可以通过修改元素的display属性来切换行内元素和块级元素。
css 行内元素有哪些：* a - 锚点、* dfn - 定义字段、* em - 强调、* i - 斜体、* img - 图片、* strike - 中划线、* strong - 粗体强调、* sub - 下标、* sup - 上标、* textarea - 多行文本输入框、* tt - 电传文本、* form - 交互表单。
行内元素有哪些：a、b、span、img、input、strong、select、label、em、button。
以图例来表述行内元素和块级元素的区别会更加直观：
①行内元素会再一条直线上，是在同一水平线布局的。
/* css */
.green ,.yellow{display:inline;}
.green{background:green;}
.yellow{background:yellow;}
<!-- html -->
<span class="green"></span><span class="yellow"></span>
②块级元素各占一行，是垂直方向布局的。
/* css */
.green ,.yellow{display:block;}
.green{background:green;}
.yellow{background:yellow;}
<!-- html -->
<div class="green"></div><div class="yellow"></div>
综上所述：如果你要将行内元素变成块级元素，那么就只需要在该标签上加上样式 display:block; 这里已经牵涉到了CSS内容。块级元素可以用样式控制其高、宽的值。
行内元素不可以控制宽和高，除非你想将它转变成为块级元素或是行内块级元素inline-block否则它的宽和高，是随标签里的内容而变化。
