Results tagged “CSS菜单”

斜角菜单的CSS制作

前些日子设计站点时,看到了一些斜角菜单的导航形式,如Indiana University Library .等少数国外站,但是大概查看一下代码,多为js实现,害怕兼容问题,没有使用。不过如今,利用纯CSS也可以实现斜角菜单了。关键在于倾斜的平行四边会造成首尾两个按钮的重合区,因此设置背景就是重点。设定时需固定li a 的宽度为单个倾斜四边形的宽度。然后使用相对加绝度定位调节他们相互的距离。让他们首尾有重叠区域。也就是切图时候拉开,定义时候拉近,很简单的思路。这样背景需要用到通明gif 或者png,才会放置重叠区域相互遮挡效果还是很绚的。

效果图. :