1

我不知道，要么我不擅长“搜索”，要么这个话题太简单了，通常没有人问这个问题，但自从我开始我的网站以来，我一直在搜索这个。我的网页上只有四个块元素。

  • 第一个 Block 元素单独显示在顶部
  • 第二，第三和第四块元素，我想从下一行开始排列在一个水平线上
  • 目前我正在使用桌子来做这个，但是它的造型很糟糕，不是吗？！
  • 请告诉我一种可以将所有这 3 个块元素放在同一行中的方法

目前，如果我删除 table 属性，我的块元素将移动到下一行。如果我删除 table 属性，这就是它的样子：

^^^^^^^^^块元素：顶部^^^^^^^^^^^^

^^^^方块2^^^^^

^^^^块3^^^^^

^^^^方块4^^^^^

我想要像这样在同一行中的块元素2,3,4：^^^^Block2^^^^^^^^^Block3^^^^^^^^^Block4^^^^^

4

1 回答 1

2

您可以尝试 display:inline-block或float:left.

<html>
  <head>
    <style type="text/css">
      div {
      border: 1px black solid;
      }
    </style>
  </head>
  <body>
    <div>aaa</div>
    <div>bbbbbb</div>
    <div>cccc</div>
  </body>
</html>

在此处输入图像描述

<html>
  <head>
    <style type="text/css">
      div {
      border: 1px black solid;
      display: inline-block;
      }
    </style>
  </head>
  <body>
    <div>aaa</div>
    <div>bbbbbb</div>
    <div>cccc</div>
  </body>
</html>

在此处输入图像描述

<html>
  <head>
    <style type="text/css">
      div {
      border: 1px black solid;
      float: left;
      }
    </style>
  </head>
  <body>
    <div>aaa</div>
    <div>bbbbbb</div>
    <div>cccc</div>
  </body>
</html>

在此处输入图像描述

这些是对 Chrome 的影响。

于 2013-03-24T03:28:12.627 回答