1. 介绍
CSS是前端开发中基础的技术之一，它用于控制HTML文档的样式。在CSS中，有两种类型的元素，即块元素和行内元素。本文将介绍CSS中的块元素。
2. 块元素是什么？
块元素是指在HTML页面中以块的形式呈现的元素。块元素通常在页面中占据一整行，并且可以设置宽度、高度、边距和内边距等属性。块元素的特点是:
总是在新行上开始
高度、行高以及外边距和内边距都可以控制
宽度缺省是它的容器的100%，除非设定一个宽度
它可以包含行内元素和其它块元素
2.1 常见的块元素
常见的块元素有：
<div>：常用于布局
<p>：用于段落
<h1> - <h6>：用于标题
<ul> 和 <li>：用于列表
<form>：用于表单
<table>：用于表格
<header>、<footer>、<nav>、<article>等：用于HTML5语义化标签
2.2 块元素的代码示例
/* 宽度、高度、边距和内边距等属性可以设置 */
div {
width: 200px;
height: 200px;
margin-bottom: 20px;
padding: 10px;
background-color: #e0e0e0;
border: 1px solid #ccc;
}
3. 行内元素与块元素的区别
与块元素不同，行内元素以行内形式呈现，不会独占一行。行内元素的特点是：
和相邻的行内元素在同一行上
高度、行高以及外边距和内边距不可改变
宽度只与它的内容有关，不可设定
它只能包含其它行内元素，不能包含块元素
3.1 常见的行内元素
常见的行内元素有：
<span>：常用于文本上的修饰，如高亮显示、更改颜色等
<a>：用于超链接
<img>：用于插入图像
<input>：用于表单输入
<button>：用于点击事件
3.2 行内元素的代码示例
/* 行内元素的宽度只与它的内容有关 */
span {
color: red;
font-weight: bold;
}
4. 总结
本文介绍了CSS中什么是块元素。块元素总是在新行上开始，可以设置宽度、高度、边距和内边距等属性，并且可以包含行内元素和其它块元素。与之相对，行内元素以行内形式呈现，不会独占一行，高度、行高以及外边距和内边距不可改变。
在实际开发中，开发人员需要灵活使用块元素和行内元素，根据实际需求选择合适的元素进行布局和样式设置，以达到更好的视觉效果。