vue中的横向排列_如何让div中的内容横向排列
展开全部一、问题可能涉及到了浮动和行内元素两个知识点，首先需要div布局，写一个大的div作为父级盒子，里e5a48de588b662616964757a686964616f31333363383965面有几个行内元素。如下：DIV内容横向排列.container {width: 500px;margin: 50px auto;overflow: hidden;border: 1px solid
展开全部
一、问题可能涉及到了浮动和行内元素两个知识点，首先需要div布局，写一个大的div作为父级盒子，里e5a48de588b662616964757a686964616f31333363383965面有几个行内元素。如下：
DIV内容横向排列.container {
width: 500px;
margin: 50px auto;
overflow: hidden;
border: 1px solid #ccc;
}
div span {
display: block;
width: 100px;
height: 100px;
background-color: hotpink;
float: left;
}
div>span+span {
margin-left: 100px;
}
我是第一个
我是第二个
我是第三个
二、主要是需要对div里面的行内元素进行样式的设置：
.container {
width: 500px;
margin: 50px auto;
overflow: hidden;
border: 1px solid #ccc;
}
div span {
display: block;
width: 100px;
height: 100px;
background-color: hotpink;
float: left;
}
div>span+span {
margin-left: 100px;
}
三、HTML和CSS样式在开发工具里面的截图如下：
四、浏览器具体渲染的效果如下：
前往低代码交流专区
更多推荐
1
0- 0
已为社区贡献1条内容
所有评论(0)