css设定4个div并列的办法：1、应用float特性让4个div波动下去就可以。2、应用“display:inline;”或“display: inline-block;”款式将4个div转换成内联元素或内联小块原素就可以。
本实例教程作业环境：windows7系统软件、CSS3&&HTML5版、Dell G3计算机。
div是小块原素，会独享一行，其总宽全自动铺满父亲原素总宽；好几个div原素在一起，会自动换行表明。那样怎么让好几个div原素并列表明？下面就来给大家介绍一下方式。
方式1：应用float让div波动下去
如果你的并列div小盒子总总宽小于等于外层小盒子总宽就可以实现好几个div目标并列表明。
实例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
div{
width: 120px;
border: 1px solid red;
float: left;
}
</style>
</head>
<body>
<div>div检测文字！</div>
<div>div检测文字！</div>
<div>div检测文字！</div>
<div>div检测文字！</div>
</body>
</html>设计效果图：
float 属性定义原素在哪个地方波动。过去这一特性总用于图象，使文字围绕在图象周边，但是在 CSS 中，一切因素都能够波动。浮动元素会生成一个块级框，而无论其本身是哪种原素。
方式2：应用display特性将div转换成内联元素或内联小块原素
内联元素或内联小块原素不容易独享一行，邻近的行内元素会分布在同一行里，直至一行排下不来，才能自动换行。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
div{
width: 200px;
border: 1px solid red;
display:inline;
/* display: inline-block; */
}
</style>
</head>
<body>
<div>div检测文字！</div>
<div>div检测文字！</div>
<div>div检测文字！</div>
<div>div检测文字！</div>
</body>
</html>设计效果图：
display特性用以界定创建合理布局时原素产生的表明框种类。
display:inline;：原素能被显示的是内联元素，原素前后左右并没有回车符。
display:inline-block;：原素能被显示的是业内块元素，原素前后左右并没有回车符。
（学习培训视频共享：css视频教学）
以上就是关于css如何设置4个div并列标注的具体内容，大量欢迎关注AdminJS其他类似文章！