Community Learn Tools Library Leisure
search
English
Home > Web Front-end > HTML Tutorial > body text

Animated navigation menu code implemented through css3_html/css_WEB-ITnose

WBOY
Release： 2016-06-24 11:44:04
Original
1118 people have browsed it

Sliding navigation menu implemented with css3 style, the html code is as follows

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>CSS3 Minimalistic Navigation Menu | Tutorialzine demo</title><link rel="stylesheet" type="text/css" href="styles.css" /></head><body><h1>CSS3 Minimalistic Navigation Menu</h1><h2><a href="http://www.100sucai.com">Read the tutorial on Tutorialzine &raquo;</a></h2><div id="main">  <ul id="navigationMenu">    <li> <a class="home" href="http://www.100sucai.com"> <span>Home</span> </a> </li>    <li> <a class="about" href="http://www.100sucai.com"> <span>About</span> </a> </li>    <li> <a class="services" href="http://www.100sucai.com"> <span>Services</span> </a> </li>    <li> <a class="portfolio" href="http://www.100sucai.com"> <span>Portfolio</span> </a> </li>    <li> <a class="contact" href="http://www.100sucai.com"> <span>Contact us</span> </a> </li>  </ul></div></body></html>
Copy after login

　

Rendering:

Demo and Download

Related labels：
通过css3实现的动画导航菜单代码
source：php.cn
Previous article：Encapsulate php class to batch parse css into json format_html/css_WEB-ITnose Next article：(3) Sass and Compass create sprite pictures_html/css_WEB-ITnose
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
Show hidden side panels: checked I would like to have a navigation menu in the side panel with the ability to switch to vie...
From 2024-04-06 15:49:33
0
1
319
Vanilla JS setTimeout(): Identifying wrong behavior I have an animation on my hamburger menu written in HTML, CSS and vanilla JavaScript. Expe...
From 2024-04-02 20:44:40
0
1
284
Create a navigation bar similar to toast ui home page My source of inspiration I wanted to make a navigation bar like this: Toastui Home Page Wh...
From 2024-04-01 18:34:38
0
1
240
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template