ウェブ家の備忘録

ウェブデザイナーの備忘録

練習 HTMLのお問い合わせフォーム

お問い合わせ

メールアドレス(必須)

お問い合わせ内容(必須)

※必須項目は必ずご記入ください


<style>
  .contact-form{
    padding-top: 100px;
  }
  input,textarea{
    width:400px;
    margin-top:10px;
    margin-bottom:30px;
    /* http://www.htmq.com/style/margin.shtml
    *  margin:↑px →px ↓px ←px;
    */
    padding:20px;
    font-size:18px;//中の文字
    border:solid 1px #dee7ec;
  }
  .contact-submit{
    background-color:#dee7ec;//ボタンの色
    color:#889eab;
  }
</style>
  
<article class="contact-form">
  <section>
    <h3 class="section-title">お問い合わせ</h3>
  </section>
  <section>
    <p>メールアドレス(必須)</p>
    <input>
    
    <p>お問い合わせ内容(必須)</p>
    <textarea></textarea>
    
    <p>※必須項目は必ずご記入ください</p>
    <input class="contact-submit" type="submit" value="送信">
  </section>
</article>