div と css を使用して三角形の効果を作成する:
この章では、div と css を使用して三角形の効果を実現する方法を紹介しますが、原理は非常に簡単です。
コードは次のとおりです:
<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.softwhy.com/" /><title>蚂蚁部落</title><style type="text/css">#box{ width:0px; height:0px; border:40px solid white; border-top-color:#930; border-bottom-color:#0C3; border-left-color:#FC0; border-right-color:#009; line-height:0px;}</style></head><body><div id="box"></div></body></html>
実際、この三角形は div の境界線を使用して「押し出されて」います。境界線は異なる色を使用しているため、 を維持するだけであれば簡単に区別できます。一方向の三角形の場合は、自分で境界線の色を設定するか、境界線を削除することができます。
元のアドレスは次のとおりです: http://www.softwhy.com/forum.php?mod=viewthread&tid=12680
詳細については、以下を参照してください: http://www.softwhy.com/divcss/
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
