HTML のスニペット集
このページは、HTML のスニペットなどをまとめる予定のページです。
目次
注意
- コードのライセンスは CC0 (クレジット表示不要、改変可、商用可) です。
スニペット
viewport
<meta name="viewport" content="width=device-width,initial-scale=1.0,viewport-fit=cover">
input
<input type="email" name="email" autocomplete="email">
<input type="text" name="postal" autocomplete="postal-code">
<input type="text" name="pref" autocomplete="address-level1">
<input type="text" name="city" autocomplete="address-level2">
<input type="text" name="street" autocomplete="street-address">
<input type="tel" name="tel" autocomplete="tel">
プルダウン
月
<select name="month">
<option value=""></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
日
<select name="day">
<option value=""></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
都道府県
OGP
<meta property="og:title" content="">
<meta property="og:type" content="">
<meta property="og:image" content="">
<meta property="og:url" content="">
<meta property="og:locale" content="ja_JP">
<meta property="og:description" content="">
Twitter ツイートリンク
<a href="https://twitter.com/intent/tweet?text=【ツイート内容】">ツイート</a>
<a href="https://twitter.com/intent/tweet?text=【ツイート内容】&url=【ツイートURL】">ツイート</a>
- 【ツイート内容】 や 【ツイートURL】 は URL エンコード (パーセントエンコーディング。PHP の場合
rawurlencode()) されている必要があります。 - Guides — Twitter Developers
Twitter ツイートボタン
<a href="https://twitter.com/share?ref_src=twsrc%5Etfw" class="twitter-share-button" data-show-count="false">ツイート</a><script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
Twitter フォローボタン
<a href="https://twitter.com/test?ref_src=twsrc%5Etfw" class="twitter-follow-button" data-show-count="false">Follow @test</a><script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
testの箇所 (2箇所) をフォローさせたいユーザー名に変更します。- Twitter Publish