submitボタンをデザインする
<style type="text/css"> #button { display : inline-block; border-radius : 5%; /* 角丸 */ font-size : 14pt; /* 文字サイズ */ text-align : center; /* 文字位置 */ cursor : pointer; /* カーソル */ padding : 10px 10px; /* 余白 */ background : #000066; /* 背景色 */ color : #ffffff; /* 文字色 */ line-height : 1em; /* 1行の高さ */ transition : .3s; /* なめらか変化 */ box-shadow : 4px 4px 3px #666666; /* 影の設定 */ border : 2px solid #000066
clipboard.jsを使ってみる
以前テキストをクリップボードにコピーする実装を試してみましたが、今回はclipboard.jsを使ってクリップボードにコピーする方法を試してみます。 サンプルコード 読み込み方法はいくつかありますが、今回はCDNを使ってみます。 <script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.8/dist/clipboard.min.js"></script> コピーに使用するボタンを指定します。 new ClipboardJS('.btn'); コピーに関する設定はdata属性で設定できます。 ボタンにテキスト要素を紐づけるのはdata-clipboard-targetを使用します。 <input id="foo" value="サンプルテキストA"> <button class="btn" data-clipboard-target="#
Sergio Camalich | Designer & Front-End Developer
Hola! I am Sergio Camalich Designer, Front-End Developer, creator of The Arcae Project & a full-on millenial. Get to know me better
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ボタン・バッジいろいろ - DesignWalker
