在css基础当中，我们往往会遇到块元素和行内元素。在实际开发中，会经常把他们弄混淆，而且很难记住。那么行内元素和块级元素的区别有哪些？下面给大家介绍一下。

 

　　块级元素和行内元素的定义

 

　　什么是块级元素？

 

　　总是在新行上开始；

 

　　高度，行高以及外边距和内边距都可控制；

 

　　宽度缺省是它的容器的100%，除非设定一个宽度。
 

 

　　它可以容纳内联元素和其他块元素

 

　　例如：<address>、<center>、<h1>——<h6>、<hr>、<p>、<pre>、<ul>、<ol>、<dl>、<table>、<div>、<form>

 

　　什么是行内元素？

 

　　和其他元素都在一行上；

 

　　高，行高及外边距和内边距不可改变；

 

　　宽度就是它的文字或图片的宽度，不可改变

 

　　内联元素只能容纳文本或者其他内联元素

 

　　例如：<span>、<a>、<br>、<b>、<strong>、<img>、<input>、<textarea>、<select>、<sup>、<sub>、<em>、<del>
 

 

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

 

　　1）、行内元素

 

　　①：设置宽高无效

 

　　②：对margin设置左右方向有效，而上下无效；padding设置左右方向有效，而上下无效。

 

　　③：不会自动换行

 

　　2）、块级元素

 

　　①：可以设置宽高

 

　　②：设置margin和padding都有效

 

　　③：可以自动换行

 

　　④：多个块状，默认排列从上到下