一、CSS盒子模型
盒子包括:margin、border、padding、content
边框交界处呈现平滑的斜线,利用此特点,通过设置各边框宽度和颜色可以得到小三角等。
div元素是块级元素,显示为块框,可以利用它来具体实现。
<div class="triangle "></div>
<div class="arrow"></div>
**例1、**一般设置高度、宽度及边框后,盒子呈现如下图:
.triangle {
width: 25px;
height: 25px;
overflow: hidden;
font-size: 0;
line-height: 0;
border-width: 50px;
border-style: solid;
border-color: rgb(235, 54, 241) rgb(86, 245, 139) rgb(76, 0, 255) rgb(46, 205, 245);
}
专门建立的学习Q-q-u-n: 731771211,分享学习方法和需要注意的小细节,不停更新最新的教程和学习技巧
(从零基础开始到前端项目实战教程,学习工具,全栈开发学习路线以及规划)
注:设置overflow、font-size、line-height,是因为在IE6下会具有默认的字体大小和行高, 导致