Web Front-end
HTML Tutorial
The website has a second-level menu. How to use CSS to display a third-level menu under the second-level menu. Ask for help from well-intentioned people. _html/css_WEB-ITnose
The website has a second-level menu. How to use CSS to display a third-level menu under the second-level menu. Ask for help from well-intentioned people. _html/css_WEB-ITnose
HTML码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Miyo Industrial Co.,Ltd - deepne web design</title><link href="css/dee_gray.css" rel="stylesheet" type="text/css" /></head><body><div id="header"><div class="w"> <div class="nav"> <ul class="nav-ul"> <li class="nav-item"> <a class="nav-item-a on " href="/yzjEnglish/index.jhtml">Home</a> </li> <li class="nav-item"> <a class="nav-item-a " href="/ProductDisplay/index.jhtml">Product display</a> <ul class="sub-nav"> <li class="sub-nav-item"> <a href="/ElectronicProducts/index.jhtml">Mens Watch</a> </li> <li class="sub-nav-item"> <a href="/A412/index.jhtml">Ladies Watch</a> </li> </ul> </li> <li class="nav-item"> <a class="nav-item-a " href="/AboutUs/index.jhtml">About Us</a> <ul class="sub-nav"> </ul> </li> <li class="nav-item"> <a class="nav-item-a " href="/EnterpriseCulture/index.jhtml">EnterpriseCulture</a> <ul class="sub-nav"> </ul> </li> <li class="nav-item"> <a class="nav-item-a " href="/Honor/index.jhtml">Honor</a> <ul class="sub-nav"> </ul> </li> <li class="nav-item"> <a class="nav-item-a " href="/">Group Home</a> <ul class="sub-nav"> </ul> </li> </ul> </div> </div> </div></body></html><script src="js/jquery-1.8.2.min.js"></script><script src="js/query.easing.js"></script><script src="js/main.js"></script><!--[if lte IE 6]><script src="js/DD_belatedPNG_0.0.8a-min.js"></script><script src="js/ie6pngs.js"></script><![endif]--><!--S news slider js 2013.07.25--><script src="js/jquery.kinMaxShow-1.0.min.js" type="text/javascript"></script><script src="js/js/yzj-main.js"></script><!--E news slider js 2013.07.25-->
dee_gray.CSS代码如下：
/*---CSS base---*//*reset*/body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0;padding:0;}table {border-collapse:collapse;border-spacing:0;}fieldset,img {border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul {list-style:none}caption,th {text-align:left}h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal}q:before,q:after {content:''}abbr,acronym { border:0}/*fonts*/.fb{font-weight:bold}.fn{font-weight:normal}.t2{text-indent:2em}.lh150{line-height:150%}.lh180{line-height:180%}.lh200{line-height:200%}/*position*/.pr{position:relative}.pa{position:absolute}.bc{margin-left:auto;margin-right:auto;}.fl{float:left;display:inline}.fr{float:right;display:inline}.cb{clear:both}.cl{clear:left}.cr{clear:right}.vm{vertical-align:middle}.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}.clearfix{display:inline-block}* html .clearfix{height:1%}.clearfix{display:block}.tl{text-align:left}.tc{text-align:center}.tr{text-align:right}.abs-right{position:absolute;right:0}.zoom{zoom:1}.hidden{visibility:hidden}.none{display:none}.text-v{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}/*width*//*height*//*margin*/.m10{margin:10px}.m15{margin:15px}.m30{margin:30px}.mt5{margin-top:5px}.mt10{margin-top:10px}.mt15{margin-top:15px}.mt20{margin-top:20px}.mt30{margin-top:30px}.mt50{margin-top:50px}.mt100{margin-top:100px}.mb10{margin-bottom:10px}.mb15{margin-bottom:15px}.mb20{margin-bottom:20px}.mb30{margin-bottom:30px}.mb50{margin-bottom:50px}.mb100{margin-bottom:100px}.ml5{margin-left:5px}.ml10{margin-left:10px}.ml15{margin-left:15px}.ml20{margin-left:20px}.ml30{margin-left:30px}/*color*/.gray{color:gray;}.green{color:green;}.red{color:red;}.textover{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}/*---CSS main---*//*global*/body{font:12px 'Microsoft yahei', Tahoma, Arial, Helvetica, Sans-serif;color:#555;}a{text-decoration:none; outline:none;color:#09f;}/*a:hover{color: #ae2e8d;}*/input[type=submit],botton{cursor: pointer;}.w{width:990px;margin-left:auto;margin-right:auto;}#mainner .w{overflow:hidden;}#banner .w{position: relative;}#header,#banner,#mainner,#footer,.c{width:100%; min-width:990px;}/*sprite*/.ico,#header,.siteTips .vip-login a,.siteTips .pro-tab a,.siteTips .hot-line a,.locationBar .conte-nav a,.locationBar .conte-nav span,.locationBar .local-nav a,.more a,.footer,#btn-scrollTop a{background: url(../images/yzj-sprite-en.png) no-repeat;}.locationBar{background: url(../images/yzj_location-bg.png) repeat-x;}/*header*/#header{height: 100px; background-repeat: repeat-x; position: relative; z-index: 2;}#header .w{position: relative; height: 100%;}/*head-top*/.logo{position: absolute; left: 0; bottom: 10px; width: 200px; height: 65px;}.siteTips{position: absolute; right: 0; top: 2px; height: 15px; color: white; zoom:1;}.siteTips a{color: #eee;}.siteTips span{float: left; margin-left: 8px;}.siteTips .vip-login a{background-position: -533px -193px; padding-left: 15px;}.siteTips .pro-tab a{background-position: -533px -217px; padding-left: 15px;}.siteTips .hot-line a{background-position: -529px -237px; padding-left: 18px;}.siteTips .smallTip a,.siteTips .bigTip a{display: inline-block; padding-left: 15px; background-position: -338px -158px;}.siteTips .bigTip a{background-position: -235px -159px;}.siteTips .bigTip{width: 79px; background-position: -249px -138px;}.siteTips .noIcoTip a{padding: 0;background: none;}/*nav*/.nav{position: absolute; right: 0; bottom: 0; height: 42px; z-index: 9; clear: both;}.nav-ul{zoom:1; height: 100%;}.nav-ul .nav-item{float: left; position: relative;}.nav-item .nav-item-a{ display: block; border-top: 1px solid #eee; border-left: 1px solid #ddd; height: 41px; line-height: 41px; padding: 0 20px; background-color: #f1f1f1; text-align: center; font-size: 14px; color: #666; _width: 50px; white-space: nowrap;}.nav-item .nav-item-a:hover, .nav .hover .nav-item-a,.nav .on .nav-item-a{background-color: #09f; color: white; border-color: #09f;}.sub-nav{ display: none; position: absolute; top: 42px; left: 0; width: 130px; height: auto; box-shadow: 5px 6px 12px 0 rgba(66,66,66,0.1); /*filter:progid:DXImageTransform.Microsoft.Shadow(color=#888888,direction=155,strength=3);*/ z-index: 10;}.sub-nav-item{clear: both; border-bottom: 1px solid #fff;}.sub-nav-item a{ clear: both; display: block; padding-left: 15px; height: 28px; line-height: 28px; text-align: left; font-size: 12px; color: #888; border-bottom: 1px solid #e2e2e2; background-color: #f1f1f1;}.sub-nav-item a:hover{background-color: #09f; color: #fff;}.sub-nav-child{ clear: both; border-bottom: 1px solid #fff; /*filter:progid:DXImageTransform.Microsoft.Shadow(color=#888888,direction=155,strength=3);*/ z-index: 10;}/*banner*/#banner .w{border-bottom: 1px solid #eee;}.bannerMini{height: 240px; background-repeat: no-repeat; background-position: 50% 50%; overflow: hidden;}/*mainner*/#mainner .w{margin-top: 0;}.locationBar{height: 28px; line-height: 26px; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #d9d9d9; margin-bottom: 10px; padding-bottom: 0; margin-top: -1px; background-repeat: repeat-x; box-shadow: 0 3px 10px 0 rgba(99,99,99,0.2); filter:progid:DXImageTransform.Microsoft.Shadow(color=#eeeeee,direction=180,strength=12)\9;}.locationBar .conte-nav,.locationBar .local-nav{max-width:30%;height:28px;line-height:28px;white-space: nowrap;overflow: hidden;}.locationBar .conte-nav{max-width:60%;}.locationBar .conte-nav a,.locationBar .conte-nav span,.locationBar .local-nav a{ display: inline-block; height:28px; padding-right: 18px; margin-right: 5px; background-position: right -425px; color: #999; max-width: 100px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}.locationBar .conte-nav span,.locationBar .conte-nav a:hover,.locationBar .local-nav a:hover{color: #09f;}.locationBar .local-nav a{margin-right: 8px; background-position: right -466px;}.locationBar .local-nav span{display: inline-block; height:100%; color: #999; overflow: hidden;}现需要鼠标移动到mens watch上面时显示A watch和B watch。移动到ladies watch上时，显示c watch和d watch.。真心求帮助。谢谢各位程序员。
回复讨论(解决方案)
三级？要求高了点吧
jquery多级下拉菜单插件
n级都行，按照别人的结构来
<link rel="Stylesheet" type="text/css" href="http://www.coding123.net/menu/menu.css" /><style>body{background:#999}</style><div id="menu"><ul class="menu"><li><a href="#" class="parent"><span>level 1_1</span></a><ul><li><a href="#" class="parent"><span>level 2_1</span></a><ul><li><a href="#"><span>level 3_1</span></a></li><li><a href="#"><span>level 3_2</span></a><ul><li><a href="#"><span>level 3_2_1</span></a></li><li><a href="#"><span>level 3_2_2</span></a><ul><li><a href="#"><span>level 3_2_2_1</span></a></li><li><a href="#"><span>level 3_2_2_2</span></a></li></ul></li></ul></li></ul></li></ul></li><li><a href="#"><span>level 1_2</span></a></li><li class="last"><a href="#"><span>level 1_3</span></a></li></ul></div><script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js"></script><script type="text/javascript" src="http://www.coding123.net/menu/menu.js"></script>
Hot AI Tools
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
Undress AI Tool
Undress images for free
Clothoff.io
AI clothes remover
AI Hentai Generator
Generate AI Hentai for free.
Hot Article
Hot Tools
Notepad++7.3.1
Easy-to-use and free code editor
SublimeText3 Chinese version
Chinese version, very easy to use
Zend Studio 13.0.1
Powerful PHP integrated development environment
Dreamweaver CS6
Visual web development tools
SublimeText3 Mac version
God-level code editing software (SublimeText3)
Hot Topics
How to remove news and trending content from Windows 11 Search
Oct 16, 2023 pm 08:13 PM
When you click the search field in Windows 11, the search interface automatically expands. It displays a list of recent programs on the left and web content on the right. Microsoft displays news and trending content there. Today's check promotes Bing's new DALL-E3 image generation feature, the "Chat Dragons with Bing" offer, more information about dragons, top news from the Web section, game recommendations, and the Trending Search section. The entire list of items is independent of your activity on your computer. While some users may appreciate the ability to view news, all of this is abundantly available elsewhere. Others may directly or indirectly classify it as promotion or even advertising. Microsoft uses interfaces to promote its own content,
Windows 11: The easy way to import and export start layouts
Aug 22, 2023 am 10:13 AM
In Windows 11, the Start menu has been redesigned and features a simplified set of apps arranged in a grid of pages, unlike its predecessor, which had folders, apps, and apps on the Start menu. Group. You can customize the Start menu layout and import and export it to other Windows devices to personalize it to your liking. In this guide, we’ll discuss step-by-step instructions for importing Start Layout to customize the default layout on Windows 11. What is Import-StartLayout in Windows 11? Import Start Layout is a cmdlet used in Windows 10 and earlier versions to import customizations for the Start menu into
iOS 17's standby mode turns a charging iPhone into a home hub
Jun 06, 2023 am 08:20 AM
In iOS 17 Apple is introducing Standby Mode, a new display experience designed for charging iPhones in a horizontal orientation. In this position, the iPhone is able to display a series of full-screen widgets, turning it into a useful home hub. Standby mode automatically activates on an iPhone running iOS 17 placed horizontally on the charger. You can view time, weather, calendar, music controls, photos, and more. You can swipe left or right through the available standby options and then long press or swipe up/down to customize. For example, you can choose from analog view, digital view, bubble font, and daylight view, where the background color changes based on time as time passes. There are some options
Windows 11 User Guide: How to disable ad pop-ups
Sep 22, 2023 pm 07:21 PM
Microsoft's Windows 11 operating system may periodically display suggestions as pop-ups on your computer using the notification system. The suggestions system, originally intended to provide users with tips and suggestions for improving their Windows 11 workflows, has almost completely transformed into an advertising system to promote Microsoft services and products. Suggestion pop-ups might advertise a Microsoft 365 subscription to users, suggest linking an Android phone to the device, or set up a backup solution. If these pop-ups annoy you, you can tweak your system to disable them entirely. The following guide provides recommendations on disabling pop-ups on devices running Microsoft’s Windows 11 operating system.
How to Default 'Show More Options' in Windows 11's Right-Click Menu
Jul 10, 2023 pm 12:33 PM
One of the most annoying changes that we users never want is the inclusion of "Show more options" in the right-click context menu. However, you can remove it and get back the classic context menu in Windows 11. No more multiple clicks and looking for these ZIP shortcuts in context menus. Follow this guide to return to a full-blown right-click context menu on Windows 11. Fix 1 – Manually adjust the CLSID This is the only manual method on our list. You will adjust specific keys or values in Registry Editor to resolve this issue. NOTE – Registry edits like this are very safe and will work without any issues. Therefore, you should create a registry backup before trying this on your system. Step 1 – Try it
Reasons and solutions for desktop layout being locked
Feb 19, 2024 pm 06:08 PM
What happens when the desktop layout is locked? When using the computer, sometimes we may encounter the situation where the desktop layout is locked. This problem means that we cannot freely adjust the position of desktop icons or change the desktop background. So, what exactly is going on when it says that the desktop layout is locked? 1. Understand the desktop layout and locking functions. First, we need to understand the two concepts of desktop layout and desktop locking. Desktop layout refers to the arrangement of various elements on the desktop, including shortcuts, folders, widgets, etc. we can be free
How to edit messages on iPhone
Dec 18, 2023 pm 02:13 PM
The native Messages app on iPhone lets you easily edit sent texts. This way, you can correct your mistakes, punctuation, and even autocorrect wrong phrases/words that may have been applied to your text. In this article, we will learn how to edit messages on iPhone. How to Edit Messages on iPhone Required: iPhone running iOS16 or later. You can only edit iMessage text on the Messages app, and then only within 15 minutes of sending the original text. Non-iMessage text is not supported, so they cannot be retrieved or edited. Launch the Messages app on your iPhone. In Messages, select the conversation from which you want to edit the message
Bluetooth speaker or headset keeps beeping on Windows 11/10
Feb 19, 2024 am 11:10 AM
If your Bluetooth speakers or headphones on your Windows 11/10 computer are emitting a constant beeping sound, this may be ruining your music enjoyment. In this article, you will find ways to solve this problem so that you can eliminate this annoying situation. Bluetooth speakers or headphones keep beeping on Windows 11/10 If your Bluetooth headphones or speakers keep beeping on Windows 11/10, use the following suggestions to resolve the issue. Preliminary Steps Run the Audio Troubleshooter Update the firmware of your Bluetooth device Reinstall the required drivers Reset your Bluetooth device Your device may be faulty We have explained all these fixes in detail below. 1] Preliminary steps First, perform some preparatory steps. If these
