-
判断是否是ie isIE = ！！window.ActiveXObject 判断是否是IE6 isIE6 = isIE && ！window.XMLHttpRequest;(貌似IE6不支持ajax）查看全部
-
jquery引用的两种方法查看全部
-
<script type="text/javascript"> function ShowSub(li) { var subMenu =li.getElementsByTagName("ul")[0]; subMenu.style.display = " block "; } function HideSub(li) { var subMenu = li.getElementsByTagName("ul")[0]; subMenu.style.display = " none "; } </script> </head> <body> <div id="nav"> <ul> <li><a href="#">首页</a></li> <li onmouseover="ShowSub(this)" onmouseout="HideSub(this)" ><a href="#">课程大厅</a> <ul> <li><a href="#">JavaScript</a></li> <li><a href="#">Html/CSS</a></li> </ul> </li> <li onmouseover="ShowSub(this)" onmouseout="HideSub(this)"><a href="#">学习中心</a> <ul> <li><a href="#">视频学习</a></li> <li><a href="#">实例练习</a></li> <li><a href="#">问与答</a></li> </ul> </li> <li><a href="#">经典案例</a></li> <li><a href="#">关于我们</a></li> </ul> </div> </body> </html>查看全部
-
<style type="text/css"> *{ margin:0px; padding:0px;} #menu{ background-color:#eee; width:600px; height:40px; margin:0 auto;} ul{ list-style:none;float:left;} ul li{ line-height:40px; text-align:center; position:relative;float:left;} a{ text-decoration:none; color:#000; display:block; width:90px;} a:hover{ color:#FFF; background-color:#666;} ul li ul li{ float:none;margin-top:2px; background-color:#eee; } ul li ul{width:90px; position:absolute; display:none;} ul li:hover ul{display:block;} </style> </head> <body> <div id="menu"> <ul> <li><a href="#">首页</a></li> <li><a href="#">课程大厅</a> <ul> <li><a href="#">javascript</a></li> <li><a href="#">jquery</a></li> </ul> </li> <li><a href="#">学习中心</a> <ul> <li><a href="#">视频学习</a></li> <li><a href="#">案例学习</a></li> <li><a href="#">交流平台</a></li> </ul> </li> <li><a href="#">经典案例</a></li> <li><a href="#">关于我们</a></li> </ul> </div> </body> </html>查看全部
-
<script> $(function(){ /* $('.rMenu').click(function(){ $('ul li').not('#logo').toggle(); }) */ $('#rList').on('click',function(){ if($('ul li').hasClass('active')){ $('ul li').css('visibility','hidden').removeClass('active');//active存在，在隐藏li，并移除active }else{ $('ul li').css('visibility','visible').addClass('active');/*li显示并添加类选择器active*/ } }); })查看全部
-
@media only screen and (min-width:585px) and (max-width:823px) { #logo{ display:none; } #toplogo{ display:block; width:100%;/* 完全占据ul的宽度 */ } .menu { width:585px; } } @media only screen and (max-width:585px) { #logo{ display:none; } .menu { width:100%; } .menu li { width:100%; display:none; } .rMenu { display:block; text-align:right; } #toplogo{ display:block; } }查看全部
-
.menu li{ float:left;/*左浮动*/ margin:3px; width:140px; text-align:center; color:white; font-size:9pt; background:grey; list-style:none; } /*id选择器比class选择器的优先级高*/ #logo{ background:white; width:230px; } #logo a{ color:grey;/*“慕课网”字体颜色*/ font-size:35pt;/*字体35磅*/ background:white; } #toplogo{ display:none; margin:0 auto; text-align:center; } #toplogo a{ color:black; font-size:35pt; } .rMenu{ display:none; }查看全部
-
/*设置全局css-body/ul/a */ body{ margin:0 auto; } ul{ margin:0; padding:0; } a{ text-decoration:none; color:white; font-size:14px; padding: 0 3px; display:block;/*转为块元素*/ }查看全部
-
</style> <script src="jquery-3.1.1.min.js"></script> <script> $(function(){ $('.rMenu').click(function(){ $('ul li').not('#logo').toggle(); }) }) </script>查看全部
-
<body> <ul class="menu"> <div id="toplogo"> <a href="#" >慕课网</a> <a href="#" class="rMenu"><img src="icon.png"/></a> </div> <li><a href="#">课程中心</a><br />IT课程都在这里</li> <li><a href="#">学习中心</a><br />IT课程都在这里</li> <li id="logo"><a href="#">慕课网</a></li> <li><a href="#">个人中心</a><br/>IT课程都在这里</li> <li><a href="#">关于我们</a><br/>IT课程都在这里</li> </ul> </body>查看全部
-
导航栏<li>标签横向自适应解决办法。<li>标签不设置固定宽度，padding:0 10px;(0是针对上下，10px针对于左右间隔）查看全部
-
下拉菜单思路。查看全部
-
overflow：这个属性定义溢出元素内容区的内容会如何处理。 visible 默认值。内容不会被修剪，会呈现在元素框之外。 hidden 内容会被修剪，并且其余内容是不可见的。 scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。 inherit 规定应该从父元素继承 overflow 属性的值。 auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。并不会在该元素上清除浮动，它将清除自己。意思就是说应用了overflow：auto；的元素，将会扩展到它需要的大小，以便包含它里面浮动的元素查看全部
-
IE6不支持li:hover，可以引用IE6兼容性hack文件 csshover.htc ，实现兼容。引用方式，body{behavior: url(csshover.htc);}，引用时注意路径是否准确。查看全部
-
.top_nav查看全部
举报
0/150
提交
取消