-
如果要解决hover在IE6中的兼容问题的话，只需要将csshover.htc文件下载到本机网页文件夹中，在css代码中加上 body { behavior: url(csshover.htc); } 之后，就可以了。查看全部
-
三级菜单是二级菜单的子元素，所以如果父元素（二级菜单）都已经隐藏了，那么子元素肯定是隐藏了，所以我们就基本上不用再写三级菜单的隐藏了，但是在二级菜单显示的时候，我们要定义一下三级菜单的显示还是隐藏，要单独的定义。查看全部
-
关于margin值取负数的问题 margin四个方向都可以有负值；举个例子：比如上下两个div，如果它们之间是紧挨着的话，你在下面那个div 设置个margin-top:-10px;的属性，那么它就会向上移动10px和上面那个div叠在一起，而且下面div上面的那10px会被上面的div覆盖，就相当于它上面被剪切了10px一样。 负边距的作用主要用于使相邻的两个元素靠的更紧密等等，还有很多其他的应用，自己试一下就知道效果了查看全部
-
使用了overflow:auto/hidden;的元素将会扩展到它需要的大小以包围它里面浮动的子元素。查看全部
-
注意使用在线服务器上的jQuery库时，不能这样写 <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"> jQuery(document).ready(function(){ jQuery(".navmenu").mouseover(function(){ jQuery(this).children("ul").show(); }) jQuery(".navmenu").mouseout(function(){ jQuery(this).children("ul").hide(); }) }) </script> 而要写成 <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script> <script type="text/javascript"> jQuery(document).ready(function(){ jQuery(".navmenu").mouseover(function(){ jQuery(this).children("ul").show(); }) jQuery(".navmenu").mouseout(function(){ jQuery(this).children("ul").hide(); }) }) </script>查看全部
-
注意使用本地jQuery库时，不能这样写 <script type="text/javascript" src="jquery-2.1.1.min/jquery-2.1.1.min.js"> jQuery(document).ready(function(){ jQuery(".navmenu").mouseover(function(){ jQuery(this).children("ul").show(); }) jQuery(".navmenu").mouseout(function(){ jQuery(this).children("ul").hide(); }) }) </script> 而要写成 <script src="jquery-2.1.1.min/jquery-2.1.1.min.js"></script> <script type="text/javascript"> jQuery(document).ready(function(){ jQuery(".navmenu").mouseover(function(){ jQuery(this).children("ul").show(); }) jQuery(".navmenu").mouseout(function(){ jQuery(this).children("ul").hide(); }) }) </script>查看全部
-
在jQuery中，$完整的写法是jQuery(document).ready，即是指整个文档加载完之后再去执行 $(function(){ 函数代码; })这里面的jQuery代码。 $=jQuery 在这里面，class的名称前面要加上.，id的名字前面要加上#。查看全部
-
<style type="text/css"> *{margin: 0px;padding: 0px;} #nav{background-color: #eee;width: 600px;height: 40px;margin: 0 auto;} ul{list-style: none;} ul li{float:left; line-height:40px;height: 40px;text-align: center;} a{text-decoration: none;color: #000;display: block;padding: 0 20px;} a:hover{background-color: #888;} ul li ul li{float: none;background-color: #eee;margin-top: 2px;} ul li ul{ display: none;} ul li ul li a{} ul li ul li a:hover{background-color: blue;color: #fff;} ul li:hover ul{display: block;} </style> </head> <body> <div id="nav"> <ul> <li><a href="#">首页</a></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> <li><a href="#">首页</a></li> </ul> </div> </body>查看全部
-
jQuery这个库或者这个框架，其实就是在JavaScript语言基础上进行包装的，因此jQuery代码本质上也就是JavaScript代码，所以也要使用这个标签<script type="text/javascript">。查看全部
-
——接上面的—— <body> <div id="nav"> <ul> <li><a href="#">首页</a></li> <li onmouseover="show(this)" onmouseout="hide(this)"><a href="#">课程大厅</a> <ul> <li><a href="#">javascript</a></li> <li><a href="#">jquery</a></li> </ul> <ul> <li><a href="#">视频学习</a></li> <li><a href="#">案例学习</a></li> <li><a href="#">交流平台</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> 这段代码就能说明下标的作用。查看全部
-
<!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>无标题文档</title> <style type="text/css"> *{ margin:0px; padding:0;} #nav{ background-color:#eee; width:600px; height:40px; margin: 0 auto;} ul{ list-style:none;} ul li{float:left; line-height:40px; text-align:center; } a{ text-decoration:none; color:#000; width:90px; display:block;} a:hover{ color:#FFF; background-color:#666;} ul li ul li{ float:none; background-color:#eee; margin-top:2px; border-left:none;} </style> <script type="text/javascript"> function show(a){ var b = a.getElementsByTagName("ul")[1]; b.style.display = "block"; } function hide(a){ var b = a.getElementsByTagName("ul")[1]; b.style.display = "none"; } </script> </head>查看全部
-
注意：getElementsByTagName获得的是一组数据，同数组中的一样，采用下标来表示这一组数据中的某个数据。查看全部
-
行内元素的高度一般由元素内部的字体大小决定，宽度由内容的长度控制。 所以要想让a标签中的整个块儿的颜色发生改变，就需要设置display:block;查看全部
-
因为盒子模型有自己默认的margin和padding值，如果想要去掉的话，就要在CSS中使用*{ margin:0px; padding:0;}语句查看全部
-
菜单的宽度（width）用padding 0 10px代替，这样无论多少字，单个菜单都可以自动显示。a标签：a标签是行内元素，要变成块级元素。 CSS 实现下拉菜单显示和隐藏 li:hover ul{display:block} a:display:block; 设置成块级元素。 宽度自适应：ul;li:padding:0 10px; 1】一级菜单宽度自适应：a{ display:block; padding:0 10px;} 2】IE7下a需设置宽高 3】不受父元素样式的影响，选择器：ul li ul li a{} 4】由于二级菜单li受一级菜单li样式的控制已经浮动，故需清除浮动：ul li ul li{ float:none;} 二级菜单要精准定位。配合top和left。查看全部
举报
0/150
提交
取消