用边框写三角形:
width:0;
height:0
然后再设置边框
注:边框默认是添加在盒子外面的
不想被撑大解决方法:
1.做减法
2.设置属性box-sizing:border-box;盒子类型是边框盒子(让盒子成为怪异盒子)
设置为怪异盒子之后,该容器在添加边框就不会把盒子撑大,看到的效果就是添加了一个边框(该属性是CSS3新增加的,所以IE10以下不兼容)
3.用calc函数,可以支持四则运算(CSS3新加的,兼容性不好)
calc运算规则就可以,符号前后必须加空格(单位不同也可以运算)