html - 对齐左表上的图像？

Question

下面的代码，当我在 HTML 编辑器中查看并在 Web 浏览器中预览时，两个图像都在左侧和顶部。我想在右边放一张图片，在左边放一张图片，并附上文字帮助我们改善我们为中心社区服务的方式。我将如何实现这一目标？

即“IMAGE1”帮助我们改进我们为社区服务的方式“IMAGE2”

<div class="survey-title">
  <table>
    <tbody>
      <tr align="right">
        <td style="width: 40px !important;">
          <div id="uploadImage">
            <img style="display: inline;" id="imgPreview" src="data:image/jpeg;base64,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"
              alt="Logo1" title="Logo1">
          </div>
        </td>
      </tr>


      <tr align="right">
        <td style="width: 40px !important;">
          <div id="uploadImage">
            <span style="float:left;"></span>
            <img style="display: inline;" id="imgPreview" src="data:image/jpeg;base64,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"
              alt="Logo2" title="Logo2">
            <td>

              <div type="text" id="survey-name" class="survey-name survey-headers survey-name-image" placeholder="Untitled Survey" disabled="true" title="Help us improve how we serve the best community" aria-label="Help us improve how we serve the community">Help us improve how we serve the community</div>
            </td>
      </tr>
    </tbody>
  </table>
  </div>

标签： htmlcss

Answer 1

使用表格

表格按行组织tr，在其中我们有单元格td，为了获得所需的对齐，您只需将项目以正确的顺序放置在一行内；在这种情况下，这将是Image1- Text- Image2，它们中的每一个都将进入td同一元素内的一个tr元素中。

但是，除非您正在创建电子邮件模板，否则我不建议您使用表格来创建布局。

<div class="survey-title">
  <table>
    <tbody>
    <!-- Single tr element -->
      <tr>
      <!-- Image1 td element -->
        <td style="width: 40px !important;">
          <div id="uploadImage">
            <img id="imgPreview" src="data:image/jpeg;base64,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"
              alt="Logo1" title="Logo1">
          </div>
        </td>

        <!-- Text td element -->
        <td>
          <div type="text" id="survey-name" class="survey-name survey-headers survey-name-image" placeholder="Untitled Survey" disabled="true" title="Help us improve how we serve the best community" aria-label="Help us improve how we serve the community">Help us improve how we serve the community</div>
        </td>
        
        <!-- Image2 td element -->
        <td style="width: 40px !important;">
          <div id="uploadImage">
            <img id="imgPreview" src="data:image/jpeg;base64,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"
              alt="Logo2" title="Logo2">
          </div>
      </tr>
    </tbody>
  </table>
</div>

使用弹性盒

我建议使用 flexbox 将不需要表格的单行中的项目对齐。

.container{
  display: flex;
  justify-content: center;
  align-items: center;
}

<div class="container">
  <img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3N//AABEIAH0AawMBIgACEQEDEQH/xAAbAAACAwEBAQAAAAAAAAAAAAAAAwIEBQEGB//EADsQAAICAQEEBwQHBwUAAAAAAAECAAMEERIhMUEFE1FhcZGhIjJSgQYUFSNCYrEkU8HC0eHwMzRygpL/xAAUAQEAAAAAAAAAAAAAAAAAAAAA/8QAFBEBAAAAAAAAAAAAAAAAAAAAAP/aAAwDAQACEQMRAD8A+4whCAQhCAQhCAQMDM7IufKufHocpUm661Tv1+Be/tPLx4A6/PqrsNNavdcONdQ2iPHkPmROUZlrZApyMfqiylk+8Da6aa66cOI7ZCsJRUK6ECIPwiJw/vulbG5U1hNfzNvPps+cDVhCEAhCEAhCEAhCLuvqoQvdYlaD8TsAPWAyEpfauBxGVWw7V3jzEdRl42Tr9Xvqt047Dg6QI9IXtj4rvWAbDoqA8CxOg9SIlUTFoShGJCjex4seJJ7ydTK30lOSuHW+IyrYlgbaZSwGgOmoAJ46cp5+rG6X6Rf9pvssB36Ipqr8z7R8NB4wNnJ6SrRuqo++vY7Kop3a955TU6MxTi44DttWMSzt2seMoYOFhdEKHyr6UsI01dgoHcAZe+1MLj13s/FsNs+emkC5CJx8rHyVLY91doHEo4OnlHQCEIQCEJUzrX9jHobS646BtNdhebfL9SIEbci261qMPQFDpZc29a+4Dm3dy59k7Tg0VWC11N1/7232m+XZ4DQRlNaUVLVSuyi8P7xkCWsrZOJRkkG6sMy+643Mvgw3j5R+phApGrMr9mrKSxOy+vaI+YI9dYDGusH7RlMF+DHXqx56lvIiXOMQ+SinZrHWOOIHAeJgFGNj45Jx6ERjxfTVm8TxMLchEOjWan4V3n0lexrH/wBR9B8Kbh58YvQKNFAA7oEcoJkMG6jZsHu2ltl18CN/rG4ebbU6U5r7YYgJcBpv7GHb2Hge48VFoixjkO2JSnWOw0cnhWDzPf2D59moehhI1ghADx03yUAmfjnrMrJyDybqU8BvPqfSX23AmZuCf2Ko/GWc/wDZiYFwToMgpkhAnIW2pSm3Y2g5d8Tl5aYwVQNu59yVjif7RVNTluuyW27j5J3CBJjZf75NdfwDifEzmgRdlQABwAk2aIdoEXaKZoO0SzQOXWsqfdgGwkKgPNjw+XP5TY6Ow0xMdUGpY72Y8WJ4k98zMevbysPUfHZ5AD+YzegEIQgRf3D4TKwP9ljjsTTy3TWbgZk4XspZXzrtdfM7Q9GEC4kR0jnpg1LqNu6w6VVjixncvLpwcSzJyDoiDXvPYB3zI6IrtzLm6UzRpZYPuU/dpy/z+sDQwcV0LZGU23k2e8fh7hLTNIlotngddpXdp13iLHgRd5XeydseV3aBsYz+1gW9jPUe7Ua/yzanmMB+srfFL7BbRqnP4XB1U+Ym/hZIyKQxGw4OzZWeKMOIP+bxvgWIQhAJlOOp6Tdfw3ptj/ku4+hHlNWZX0jovt6Otswjs5dSlqW79CP46QPN52T9v9P/AFGs7WBgNraeVlnZ+o+R7Z6NSFUAcBMD6L9HfZfRdVTENa46x3G/aLb+PhoPlNragNLxbNIlotmgcdoixpJzEtAW7axRMYYthA4CQdQdJpY+cxcW7SpkAAEt7toHJu/sPLvmUzaRmInW3AMdEX2nbsA3kwPW4eT9ZrLFCjKdllJB0OmvHnxliUeh0ZcTrHBVrWNhX4deA+Q0EvQCcYagg852EDz9lRxchsfT2Tq9J7uJX5cR3a9k4G3cZr9IYgyqdASti+0jjipHCYo2nLgrs3J/q1jl+Ydqn0gTJkW3wGhhugQIi2WWAjt7tZM4a347B0gU3XdEvLr1NpuGsrNTYx0VGJ8IFNjv0E1sLDPsYpGr2gPf+VOS/M+g75ynEGEEuvXrL23U0c2PaewDmZudG4hx6y1jbd9h2rX+I/07O6BbUBVAHATsIQCEIQCUs7AXIK21u1WQnuWJxEuwgYbpmo2l2Bj5H563NeviN8Pq/SGQNlKKMReba7beu79ZuQgY69AYr78prMhu2xtfTlJN9Hujxvpq6luTVHZPmJrQgYZwM/FcGi5MhB+C4b//AEP46xgfpNzs14eNQfjZy+ny0E2IQKOH0eKbGvvsa7Ib3rG/Qdg7pehCAQhCB//Z"
  />
  <div>
    Help us improve how we serve the community
  </div>
  <img src="data:image/jpeg;base64,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"
  />
</div>