htmlタグとcss－すぐに使えるサンプルと小技集

htmlタグとcssのリファレンス一覧と小技集のサンプルに加え、自作テンプレートで効率的にseo対策済みホームページを楽々作成まで♪
htmlタグとcss(ｽﾀｲﾙｼｰﾄ) http://www.faruru.info/ htmlタグとcss(スタイルシート) 無断リンク歓迎♪	私のネット関連管理サイト一覧レンタルサーバー HP作成フリー素材マナー副業収入 SEO対策ドメイン麻雀の役とルール

html&css 手軽に使えるhtmlタグ♪

コピー＆ペーストですぐに使えるhtmlタグやソースのサンプル集。

htmlテンプレート、文字装飾、tableの型、電子メールの型など200種類以上のサンプルを完備。

他にもhtmlタグ、スタイルシート(css)、色見本、特殊文字のリファレンスに加え、1日で習得html言語など初めての人のためのページもあります。

スポンサードリンク

◆HTML&CSS◆ ボタンを作る

ホームページ上にボタンを表示する方法です。

htmlでボタンを作る

このボタンのソースは
<button type="button">button</button>

CSSを使ってボタンを作る

html

htmlのソース
<div id="button">
<a href="http://www.faruru.info/" target="_top">html</a>
</div>

CSSのソース
#button a{display:block;margin:0;width:90px;height:15px;color:#FFF;font-size:13px; border-right:10px solid #CDA;border-bottom:2px solid #CDA;background-color:#000;text-align:center;}
#button a:hover{color:#F00;}

css

htmlのソース
<div id="button1">
<a href="http://www.faruru.info/" target="_top">css</a>
</div>

CSSのソース
#button1 a{display:block;margin:0;width:90px;height:15px;color:#FFF;font-size:13px; border-right:10px solid #FA0;border-bottom:2px solid #FA0;background-color:#000;text-align:center;}
#button1 a:hover{color:#F00;}

domain

htmlのソース
<div id="button2">
<a href="http://www.faruru.info/" target="_top">domain</a>
</div>

CSSのソース
#button2 a{display:block;margin:0;width:90px;height:15px;color:#FFF;font-size:13px; border-right:10px solid #0AF;border-bottom:2px solid #0AF;background-color:#000;text-align:center;}
#button2 a:hover{color:#F00;}

html css domain

htmlのソース
<div id="button3">
<a href="http://www.faruru.info/" target="_top">html</a>
<a href="http://www.faruru.info/" target="_top">css</a>
<a href="http://www.faruru.info/" target="_top">domain</a>
</div>

CSSのソース
#button3 a{display:block;margin:0;width:90px;height:15px;color:#FFF;font-size:13px; border-left:7px solid #999;border-right:7px solid #999;border-top:1px solid #999;border-bottom:2px solid #999;background-color:#CCC;text-align:center;}
#button3 a:hover{color:#F00;background-color:#FFF;}

html css domain

htmlのソース
<div id="button4">
<a href="http://www.faruru.info/" target="_top">html</a>
<a href="http://www.faruru.info/" target="_top">css</a>
<a href="http://www.faruru.info/" target="_top">domain</a>
</div>

CSSのソース
#button4 a{display:block;margin:0;width:90px;height:15px;color:#FFF;font-size:13px;font-weight:bold; border-left:7px solid #999;border-right:1px solid #999;border-top:1px solid #999;border-bottom:2px solid #999;background-color:#000;text-align:center;}
#button4 a:hover{color:#F00;background-color:#FFF;}
#button4 a{margin:0; padding:0;display:inline;float:left;}

html help、html option、html filter、html index。

○○○