标签归档:CSS3菜单

纯CSS3实现仿Mac系统的Dock菜单

很早以前我们给大家分享过几款基于jQuery和CSS3的Mac Dock菜单,比如这款jQuery Dock菜单 可悬浮页面两侧和这款jQuery/CSS3实现仿苹果的CoverFlow图片切换都非常炫酷和实用。今天给大家带来的是另外一款基于纯CSS3的仿Mac系统的Dock菜单,配合漂亮的风景背景,这款Dock菜单更加逼真,当然这都是纯CSS3实现。

pure-css3-mac-dock

在线演示源码下载

纯CSS3下拉菜单导航 子菜单多种展开动画

这是一款非常漂亮的纯CSS3下拉菜单导航,这款菜单有两大亮点,一个是唯美的全屏背景图,非常适合个性化的个人博客使用。另外一个特点是子菜单拥有多种展开动画方式,有简单的淡入淡出,也有炫酷的折叠式展开。并且这款菜单时纯CSS实现,使用起来相当方便。

pure-css3-dropdown-menu-animation

在线演示源码下载

纯CSS3下拉菜单导航 多种下拉弹出动画

之前我们分享过非常多的jQuery/CSS3下拉菜单插件,有些非常实用,比如这款HTML5/CSS3水平二级下拉菜单,也有的非常炫酷,比如这款jQuery/CSS3波浪形弹性下拉菜单。今天我们要介绍的是另外一款下拉菜单导航,它是纯CSS3实现,其特点是简单易用,并且支持多种下拉弹出动画,非常不错,大家可以下载源码试试。

pure-css3-dropdown-menu

在线演示源码下载

CSS3自定义菜单内容的二级下拉菜单

之前我们分享过很多基于jQuery和CSS3的二级下拉菜单,大部分都非常实用,当然也不乏炫酷的动画,比如这款HTML5/CSS3水平二级下拉菜单就比较朴实,这款jQuery/CSS3波浪形弹性下拉菜单就比较富有个性。今天我们要分享的这款CSS3下拉菜单特点在于二级下拉菜单内容可以自定义,可以是简单的多列,也可以是复杂的图文排版。

css3-custom-dropdown-menu

在线演示源码下载

HTML5/CSS3水平二级下拉菜单

今天我们要给大家介绍一款简单而实用的HTML5/CSS3水平二级下拉菜单,这款CSS3菜单由简单的ul列表组成,因此兼容所有的浏览器。它的背景一共由3部分组成:主菜单的淡蓝色、下拉菜单黑色和下拉菜单选中时的红色。同时菜单也会随着页面大小的改变而自适应,淡然这部分功能不是所有开发者都会喜欢。

html5-css3-hor-drop-menu

在线演示源码下载

超炫酷纯CSS3 3D折叠二级下拉菜单

这是一款外观非常炫酷的CSS3 3D下拉菜单,它的特点是主菜单的背景和页面背景非常融合,看上去就像菜单嵌入在页面中一样;最大的特点在于当鼠标滑过菜单项时,就会展开3D样式的二级子菜单,同时子菜单会产生摇晃折叠的动画效果,看起来十分炫酷,而这一切都是纯CSS3实现。

css3-3d-swing-menu

在线演示源码下载

炫酷的CSS3 3D横向菜单 菜单项凸出显示

有一段时间没有向大家分享网页菜单了,现在的网页菜单越来越炫酷,特别是CSS3和HTML5的发展,让菜单更显风韵。就比如今天要介绍的一款CSS3 3D横向菜单,整个菜单栏会随着鼠标移动而倾斜,产生一种3D立体的视觉效果,同时鼠标滑过菜单项时,菜单项也会凸出显示,是一款非常华丽而具有个性化的CSS3菜单导航插件。

css3-3d-menu-float

在线演示源码下载

CSS3带头像的垂直彩色菜单

今天我们要给大家分享一款比较特别的CSS3菜单,这款菜单是垂直样式的,而且当鼠标滑过菜单项时,当前菜单项即可显示一个精美的头像,并且在头像旁边显示一些格式化的文字。另外,每一个菜单项的背景色可以动态渲染。

css3-ver-menu-avatar

在线演示源码下载

CSS3 3D立方体菜单导航

很早以前,我们分享过一款非常炫酷的CSS3 3D动画菜单,鼠标滑过菜单项时可以3D立体翻转。这次我们要再介绍另外一款基于CSS3的3D立方体菜单导航,这款菜单的菜单项以小图标的方式显示在立方体的各个面上,点击主菜单时就会旋转立方体,显示相应的子菜单。

css3-3d-cube-navigation

在线演示源码下载

纯CSS3简易下拉菜单 可为菜单项定义不同颜色

我们以前分享过很多各种各样的jQuery和CSS3下拉菜单,有支持右键菜单的下拉菜单,比如jQuery自定义下拉框选择菜单 支持右键弹出菜单,也有支持多级的下拉菜单,比如jQuery左侧带小图标的多级下拉菜单。今天我们要分享的是一款基于纯CSS的建议下拉菜单,它的特点是外观非常简洁,但是由于每一个菜单项都有一条不同颜色的边框,所以看起来也非常漂亮。同时这款菜单可以默认展开菜单项,也可以点击按钮后展开,使用起来比较灵活。

css3-colorful-dropdown-menu

在线演示源码下载