border styleをgrooveにする [初心者向けCSS]

こんにちは! CSSで学んだことをまとめています!

前回、border styleをdoubleにする

を書いたので、今回は、

border styleをgroove

にするやり方をまとめておきます!

border styleをgrooveにする

borderのstyleをgrooveにすると、

枠線が凹んだように見えるようになります!

言葉だとわかりにくいので、

実際にコードを書いて確認していきましょう!

■index.html(ボタンが1つ)

■main.css

こんな感じです。grooveは立体感があります。

まとめ

以上です!

他にもborder-styleについて書いているので参考にしてみてください〜〜!