ホームページ > 記事 > ウェブフロントエンド > 純粋な css3_html/css_WEB-ITnose で実装されたフリップ ボタン
純粋な css3_html/css_WEB-ITnose で実装されたフリップ ボタン
- WBOYオリジナル
- 2016-06-24 11:57:351121ブラウズ
以前、純粋な CSS3 で実装された美しいボタンをたくさん紹介しました。今日、編集者は純粋な CSS3 で実装された別のフリップ ボタンをネチズンと共有します。この実装では 2 つの反転効果が提供されます。1 つは中心線としてボタンの左端に基づいており、もう 1 つは中心線としてボタンの中央に基づいています。一緒にレンダリングを見てみましょう:
オンライン プレビュー ソース コードのダウンロード
実装されたコード
html コード:
<article> <a target="_blank" class="btn-fold-1" href="http://www.w2bc.com"><span>Donate</span><span>to RIF</span> </a> <a target="_blank" class="btn-fold-2" href="http://www.w2bc.com"><span>Don</span><span>ate</span> </a> </article>
css3 コード:
りー
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。