Zensen.プログラミング、カメラを中心になんでも書く雑記ブログです。27CSS*はじめに!!お疲れ様です。今回はCSSで三角形を作る方法を解説します。吹き出しを作る時などに便利なこの方法ですが、なかなか覚えることができず毎回調べ直して作成することが多かったので、私はこうやって覚えたという方法を解説します。スポンサードリンク*CSSで三角形を作るにはborderを使う!!まずはborderの仕組みと書き方を理解しましょう。blue;上記の結果はすべて一緒になります。borderは中の要素の外側に線が引かれるので、中の要素を空にすることによって四角を作成することができます。borderを引く要素にwidth:0px;とheight:0pxを指定しましょう。あとは余分な線を消すだけ。線を消すには消したい線の色のところに「transparent」(透明)を指定します。transparent;上記のCSSを指定すると以下のような三角形ができます。*あとはafterやbeforeを利用して吹き出しっぽくできます!!吹き出しを作るには本体となる要素のafterあるいはbeforeに上記の方法で三角形を作り、position:absoluteなどで好きな位置に配置することで完成です。class="test">test</div>*まとめ!!忘れがちなのは、いらない線に「transparent」ということですかね。これさえ忘れずにいれば三角形を作る際に毎回調べ直さなくて済むとおもいます。あと、吹き出しを作る際には、afterかbeforeにborderを使って三角形を作って、それをpositionを使って場所を変えるということです。me!!どうも!ぴーすけと申します!!←詳しく自己紹介このブログは、ByUZensen.(バイウゼンセン)といいます。プログラミング、カメラ、音楽、生活、バイクなどの記事を中心に更新しています。管理者はぴーすけと申します。某ECサイトでシステムエンジニアをしています。仕事ではjavaでプログラミグをしていますが、JavaScriptが好きで、個人的にゲームを作ったりしています。他にはX-T2で写真を撮ったり、ギターで遊んだりしています。