HTML~폼④~

그럼, 지금까지 사용한 기술로 폼으로 만들어 갑시다! !

index.html

<link rel="stylesheet" href="css/style.css">
  <div class="form">
    <h1>お問い合わせフォーム</h1>
  <label>名前：<input type="text"></label><br>
  <label>電話番号：<input type="number"></label><br>
  <label>メールアドレス：<input type="email"></label><br>
  <fieldset>
    <legend>どこで当社を知りましたか？？(複数選択可)</legend>
    <label><input type="checkbox">知り合い</label>
    <label><input type="checkbox">新聞・テレビ</label>
    <label><input type="checkbox">インターネット</label>
  </fieldset>
  <label for="comment">お問い合わせ内容</label>
  <textarea id="comment" name="comment"></textarea>
  <button>送信</button>

</div>

간이적인 문의 폼이므로 잡입니다만 🥲
지금까지 만들 수 없었던 사람을 만들 수 있었으므로 용서 해주세요.
label 뒤의 br는 행을 바꾸고 싶었기 때문에 만들었습니다.
textarea는 ID와 for를 연결했습니다 👍

style.css

.form {
  background-color: aqua;
  width: 40%;
  margin: 30px 40px ;
  padding: 30px;
  display: flex;
  flex-direction:column;
}

h1 {
  border: 2px solid black;
  width: 50%;
}

fieldset {
  width: 52%;
  margin-bottom:10px ;
}

textarea {
  display: block;
  height: 200px;
  margin: 20px;
  width: 80%%;
}


button {
  width: 10%;
  margin: 0px 0px 20px 20px;
}

css는 완전히 느낌이지만,,,,,
소문의 플렉스 박스입니다 (^_^;) 플렉스 박스는 이쪽을
htps : // 이 m / 아카리 _0618 / ms / 85 6f6d7 에어 f6681 11df

일단, 브라우저에서는 이렇게 됩니다! !