[超初心者向け] border styleをhiddenにする

CSS

こんにちは。CSSで勉強したことを日々まとめています。

今回の記事では、CSSのborder stylehiddenにすると、

どのような見た目になるのかについて試してみます。

※本記事の内容

  • border style hiddenの使い方
  • hidden以外のstyleの紹介

ではさっそくみていきましょう!

border styleをhiddenにする

border styleをhiddenにします。

まずボタン1つのHTMLファイルを作成します。

■HTMLファイル(index.html)

この時点では、以下のような見た目になっています。


次に、CSSファイルを作成します。

■CSSファイル(main.css)

borderがなくなります。

補足ですが、以下のCSSも足してみてください。背景色を無くしたり、フォント変えたりしています。

hidden以外のborder style

border styleはhidden以外も指定することができます。

以下の記事を参考にしてみてください。

おわりに

以上で、border style hiddenのまとめを終わります。

本ブログでは他にもiOSやCSSなどの入門記事を書いているので、

ぜひ参考にしてみてください!