Skip to content

Instantly share code, notes, and snippets.

@shimakyohsuke

shimakyohsuke/gist:182edcf79a2960680f41

Last active August 29, 2015 14:23
Show Gist options
  • Save shimakyohsuke/182edcf79a2960680f41 to your computer and use it in GitHub Desktop.
Save shimakyohsuke/182edcf79a2960680f41 to your computer and use it in GitHub Desktop.
Download ZIP
form.html
Raw
gistfile1.txt
<!DOCTYPE html>
<html lang="ja-JP">
<head>
<meta name="robots" content="noindex,nofollow,noarchive">
<meta name="googlebot" content="noindex,nofollow,noarchive">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=1024">
<meta name="robots" content="noodp,noydir">
<meta name="keywords" content="XXX">
<meta name="description" content="XXX">
<meta property="og:title" content="siteTitle XXX">
<meta property="og:site_name" content="siteTitle XXX">
<meta property="og:description" content="XXX">
<meta property="og:image" content="http://example.comimages/ogp.png">
<meta property="og:url" content="http://example.com">
<meta property="og:locale" content="ja_JP">
<meta property="og:type" content="website">
<title>siteTitle XXX</title>
<link rel="shortcut icon" type="image/vnd.microsoft.icon" href="http://example.comimages/common/favicon.ico">
<link rel="stylesheet" href="http://example.comstyle.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://example.comjs/application.js"></script>
<!--[if lt IE 8]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<script src="//css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/selectivizr/1.0.2/selectivizr-min.js"></script>
<![endif]-->
</head>
<body>
<div class="c-full c-full--centering">
<div class="c-centering p-base_content_width">
<div class="c-centering__in p-base_content_width">
<h1>お問い合わせ</h1>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eveniet expedita quia id nihil tempore labore harum, ipsam necessitatibus ipsa veniam dignissimos soluta iste vitae. Error laudantium beatae harum expedita iusto.</p>
<form action="XXX" method="post">
<fieldset>
<div class="row">
<label for="name">お名前（必須）</label>
</div>
<div class="row">
<input type="text" id="name" required="required" placeholder="例） 山田 太郎">
</div>
<div class="row">
<label for="email">メールアドレス（必須）</label>
</div>
<div class="row">
<input type="email" required="required" id="email" size="40" placeholder="例） info@example.com">
</div>
<div class="row">
<label for="address">ご住所（任意）</label>
</div>
<div class="row">
<input type="text" id="address" placeholder="例） 大阪府大阪市">
</div>
<div class="row">
<label for="tel">電話番号（任意）</label>
</div>
<div class="row">
<input type="tel" id="tel" placeholder="例） 00-0000-0000">
</div>
<div class="row">
<label for="otoiawase">お問い合わせの種類（必須）</label>
</div>
<div class="row">
<select name="お問い合わせの種類" required="required" id="otoiawase">
<option value="選択してください" selected="selected">選択してください</option>
<option value="Aについて">Aについて</option>
<option value="Bについて">Bについて</option>
<option value="Cについて">Cについて</option>
</select>
</div>
<div class="row">
<p>お問い合わせの内容（必須）</p>
</div>
<div class="row">
<textarea name="お問い合わせ内容" data-max="100" required="required" data-min="1"></textarea>
</div>
<div class="row">
<button type="submit">確認画面へ</button>
</div>
</fieldset>
</form>
</div>
</div>
</div>
<div class="c-full c-full--centering u-mt20">
<div class="c-centering p-base_content_width">
<div class="c-centering__in p-base_content_width">
<div class="c-footer c-full u-mt70 u-mb10"><small>Copyright(c)</small></div>
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment