HTML
<!DOCTYPE html><htmllang="en"><head><linkrel="stylesheet"href="css.css"> <metacharset="UTF-8"> <title>Document</title></head><body><div><buttonid="DigitalCLOCK"class="clock-btn"onload="showTime()"></div><pclass="mb1"></p><textareaclass="ta"name="textarea1"id=""cols="30"rows="30"></textarea><textareaname="textarea2"id=""cols="30"rows="30"></textarea><textareaname="textarea3"id=""cols="30"rows="30"></textarea><!-- ライブラリの読み込み --><script src="https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js"></script><!-- JavaScriptを記述する --><script>// 時刻表示// 今日の日付情報を取得し変数dTodayに格納するfunctionshowTime(){vardate=newDate();vary=date.getFullYear();varmo=date.getMonth()+1;vard=date.getDate();varh=date.getHours();varm=date.getMinutes();vars=date.getSeconds();if(h==0){h=12;}h=(h<10)?"0"+h:h;m=(m<10)?"0"+m:m;s=(s<10)?"0"+s:s;vartime=y+"年"+mo+"月"+d+"日"+h+"時"+m+"分"+s+"秒";document.getElementById("DigitalCLOCK").innerText=time;document.getElementById("DigitalCLOCK").textContent=time;setTimeout(showTime,1000);}showTime();// ClipBoard.js関連varclipboard=newClipboardJS('.clock-btn',{target:function(){returndocument.querySelector('div');}});clipboard.on('success',function(e){console.log(e);});clipboard.on('error',function(e){console.log(e);});varclipboard=newClipboardJS('.btn',{target:function(){returndocument.querySelector('div');}});clipboard.on('success',function(e){console.log(e);});clipboard.on('error',function(e){console.log(e);});</script></body></html>CSS
.clock-btn{width:500px;text-align:center;display:block;padding:15px;text-decoration:none;color:#fff;background-color:grey;border:none;font-family:游ゴシック;font-size:30px;border-radius:5px;margin:0auto;transition:1s;}.clock-btn:hover{transition:0.5s;background-color:black;width:500px;}.mb1{padding:10px;}.ta{border:none;}.ta:hover{transition:10s;border:1pxsolidblack;}