1、margin负值
默认情况下,边框之间叠加会边粗,如图:
如何让边框统一,叠加后不会变粗,效果如图:
代码:
第1个li执行完代码,第2个li接着执行代码,是先浮动,浮动后没有了缝隙,让后执行margin-left:-1px;的代码,就可以了。
鼠标经过当前盒子就会变样式问题
效果:鼠标经过后,边框变成蓝色
代码:
2、文字围绕浮动元素
典型效果:
一般我们的思路是,一个大盒子包括图片盒子和文字盒子,左右浮动来实现的,但是遇到文字围绕其他类型的浮动元素则有更简单的办法。
例子:
最后效果:
3、三角性布局
需要实现这样的效果:
原理:中间是用三角形来拼起来的。
这个直角三角形代码:
原理是跟之前写等腰三角形是一样的,但是需要调整四个边的值和颜色。
简化后的关于边的代码:
然后去定位就可以了。