多个div在同一行显示

原因：div为块级元素，默认占一行高度

解决方法1：两个div都添加样式 ​​display：inline-block;​​​（如值为​​inline​​​，设置宽高失效，div靠内容撑起）
代码：

<style>
    .box1{
      height: 200px;
      width:200px;
      display: inline-block;
      background-color: #008000;
    }
    .box2{
      height: 200px;
      width:200px;
      display: inline-block;
      background-color: #8A2BE2;
    }

解决方法2：两个div都添加样式 ​​float：left;​​​（后面不在同行的div设置 ​​clear:both;​​​清除浮动）
代码：

<style>
    .box1{
      height: 200px;
      width:200px;
      float:left;
      background-color: #008000;
    }
    .box2{
      height: 200px;
      width:200px;
      float:left;
      background-color: #8A2BE2;
    }
    .box3{
      height: 200px;
      width:200px;
      clear: both;
      background-color: #FA8072;
    }