<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>搜索外观</title>
  <style>
    body, form > div {
      display: flex;
    }

    body {
      margin: 20px auto;
      max-width: 800px;
      justify-content: space-around;
    }

    form > div {
      align-items: center;
    }

    input[type="search"] {
      height: 32px;
      padding: 0 10px;
      font-size: 14px;
      letter-spacing: 1px;
    }

    .appearence input[type="search"] {
      -webkit-appearance: none;
      appearance: none;
    }
  </style>
</head>

<body>
  <div>
    <form>
      <div>
        <label for="search1">搜索：</label>
        <input id="search1" name="search1" type="search">
      </div>
    </form>
  </div>
  <div class="appearence">
    <form>
      <div>
        <label for="search2">搜索：</label>
        <input id="search2" name="search2" type="search">
      </div>
    </form>
  </div>
</body>

</html>
