9 exquisite and chic CSS3 menus and buttons and 9 css3 menus

9 exquisite and chic CSS3 menus and buttons and 9 css3 menus

1. A menu item with a small icon in the CSS3 3D menu with a three-dimensional effect

I remember sharing with you many CSS3 3D menus, such as CSS3 3D animation menu 3D cube menu items and HTML5/CSS3 custom drop-down box 3D card folding animation. The effects are very beautiful. Today, we will share another cooler CSS3 3D menu, which is positioned on the page side. Each menu item has a good small icon.

Online Demo

Source code download

2. The menu item of the pure CSS3 stereo animation is pressed with an inner shadow.

This small editor will share a three-dimensional animation menu implemented by pure CSS3. The menu implementation is very simple, and there is not much special effect rendering, but it looks very clean and beautiful, particularly with the gray-black background, the menu looks a little stereoscopic. In addition, when you click a menu item, the visual effect of the inner shadow is displayed.

Online Demo

Source code download

3. HTML5/CSS3 cool animation menu

Today, we will share a very creative HTML5/CSS3 animation menu with a circular menu. When you click the center button, the sub-menu will be expanded, and with the cool menu to expand the animation.

Online Demo

Source code download

4. A group of cool CSS3 3D buttons can define sizes and colors

Today we are going to share a cool CSS3 3D button, which is also very simple in design and supports three different colors and three different sizes.

Online Demo

Source code download

5. HTML5/CSS3 animation drop-down menu sub-menu is cool

Today, we will share a very good CSS3 drop-down menu. Similar to other CSS3 drop-down menus, it is also a drop-down menu that slides over the main menu, at the same time, the sub-menu has a good animation effect when it is expanded. This animation should be called a rectangular expansion animation.

Online Demo

Source code download

6. CSS3 black topic menu item fade-in and fade-out animation

Because the menu applies the CSS3 feature, the menu edge will have a shadow effect, giving people a three-dimensional visual effect. Another feature is that when the mouse slides over the menu item, there will be an animated effect that fades in and out. It is a very good CSS3 black topic menu.

Online Demo

Source code download

7. CSS3 small ball floating button ball scroll very realistic

Today, I want to share a very distinctive CSS3 Animation button. It is different from a common button, and it does not look like a normal button. It consists of seven points, each time you click a small button, the ball will scroll to the corresponding position. The ball has a projection, and the rolling effect is also very realistic.

Online Demo

Source code download

8. CSS3/SVG Texture Background small icon hollow button

Today, we will share a small background icon with CSS 3 and SVG. When the mouse slides over the icon, it will show a hollow effect, and there will be a trace of the texture background, the effect is very good.

Online Demo

Source code download

9. CSS3 3D luminous switching button simulation results are very realistic

We just released a CSS3 switch to switch the sliding button. It should be said that there is a little 3D effect, and others are very common. Now we want to share a more cool CSS3 switch button, which not only has 3D effect, but also can emit light. When the switch is on, the light next to it will light up, and then the light will be projected onto the switch. The effect is quite vivid.

Online Demo

Source code download

Fixed Link: http://www.i7758.com/archives/1311.html