Square(正方形)
#square{ width:100px; height:100px; backgroud:red; }
Rectangle(長方形)
#rectangle { width: 200px; height: 100px; background: red;
Circle(円)
#circle { width: 100px; height: 100px; background: red; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; }
/パーセンテージ値を使用する(50% を超える) ただし、Android の以前のバージョンでは /
Oval (楕円形)
#oval { width: 200px; height: 100px; background: red; -moz-border-radius: 100px / 50px; -webkit-border-radius: 100px / 50px; border-radius: 100px / 50px; }
/ はサポートされていません/ パーセンテージ値 (50% を超える) を使用できますが、Android の以前のバージョンではサポートされませんサポートしていません /
Triangle Up (上向き三角形)
#triangle-up { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red; }
Triangle Down(下向き)
#triangle-down { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-top: 100px solid red; }
Triangle Left(左へ)
#triangle-left { width: 0; height: 0; border-top: 50px solid transparent; border-right: 100px solid red; border-bottom: 50px solid transparent; }
Triangle Right(への右)
#triangle-right { width: 0; height: 0; border-top: 50px solid transparent; border-left: 100px solid red; border-bottom: 50px solid transparent; }
Square(正方形)
#square{ width:100px; height:100px; backgroud:red; }
Rectangle(長方形)
Circle（サークル） )
#rectangle { width: 200px; height: 100px; background: red;
#circle { width: 100px; height: 100px; background: red; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; }
#oval { width: 200px; height: 100px; background: red; -moz-border-radius: 100px / 50px; -webkit-border-radius: 100px / 50px; border-radius: 100px / 50px; }
Triangle Right(To the right)
#triangle-up { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red; }
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
