时间戳

首页 > 解决方案 > 如何在html php中与表单并排制作图像

php - 如何在html php中与表单并排制作图像

问题描述

我想制作一个带有图像的表格，如下图，这是我的表格谢谢

          <div class="col-5">
            <label for="nomor_servis">Nama Bengkel</label>
            <input type="text" name="nama_bengkel" class="form-control">
          </div>
          <div class="col-5">
            <label for="nomor_servis">Nama Bengkel</label>
            <textarea name="alamat" class="form-control" cols="10" rows="4" placeholder="Alamat"></textarea>
            </textarea>
          </div>
          <div class="col-5">
            <label for="nomor_servis">Tanggal Berdiri</label>
            <input type="text" name="nama_bengkel" class="form-control">
          </div>

在此处输入图像描述

标签： phphtmlcssformsimage

解决方案

您可以使用 Bootstrap Grid System 来执行此操作。

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
</head>
<body>

<div class="container-fluid" style="margin-top: 10px;">    
  <div class="row content">
    <div class="col-sm-6">
      <form action="/action_page.php">
        <div class="form-group">
          <label for="email">Email address:</label>
          <input type="email" class="form-control" id="email">
        </div>
        <div class="form-group">
          <label for="pwd">Password:</label>
          <input type="password" class="form-control" id="pwd">
        </div>
        <div class="checkbox">
          <label><input type="checkbox"> Remember me</label>
        </div>
        <button type="submit" class="btn btn-default">Submit</button>
      </form>
    </div>
    <div class="col-sm-6"> 
      <img style="width: 100%; height: 200px;" src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/e9/Imgur_logo.svg/1200px-Imgur_logo.svg.png" />
    </div>
  </div>
</div>

</body>
</html>

推荐阅读