How to realize Triangle by CSS
This article mainly shows you "CSS how to achieve triangles", the content is easy to understand, clear, hope to help you solve doubts, the following let the editor lead you to study and learn "how to achieve triangles in CSS" this article.
CSS writes out triangles
/ * create an arrow that points up * / div.arrow-up {width:0px; height:0px; border-left:5px solid transparent; / * left arrow slant * / border-right:5px solid transparent; / * right arrow slant * / border-bottom:5px solid # 2f2f2f; / * bottom, add background color here * / font-size:0px; line-height:0px;} / * create an arrow that points down * / div.arrow-down {width:0px; height:0px; border-left:5px solid transparent Border-right:5px solid transparent; border-top:5px solid # 2f2f2f; font-size:0px; line-height:0px;} / * create an arrow that points left * / div.arrow-left {width:0px; height:0px; border-bottom:5px solid transparent; / * left arrow slant * / border-top:5px solid transparent; / * right arrow slant * / border-right:5px solid # 2f2f2f; / * bottom, add background color here * / font-size:0px; line-height:0px } / * create an arrow that points right * / div.arrow-right {width:0px; height:0px; border-bottom:5px solid transparent; / * left arrow slant * / border-top:5px solid transparent; / * right arrow slant * / border-left:5px solid # 2f2f2f; / * bottom, add background color here * / font-size:0px; line-height:0px;} these are all the contents of the article "how to achieve triangles in CSS". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!
