易截截图软件、单文件、免安装、纯绿色、仅160KB

简单详细的CSS做菜单教程 支持IE6 IE7 IE8 Firefox


一直在想用css怎么做下拉菜单,之前看到的下拉菜单都是用js做的,可是又不懂js,今天终于用css研究出来了,大家指教指教。 
下面的代码直接考了就行。
<!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=gb2312" />
<meta name="robots" content="all" />
<title>纯CSS的下拉菜单 支持IE6 IE7 IE8 Firefox</title>
<style type="text/css">
*{margin:0;padding:0;} 
.menu{font-size:12px;position:relative;z-index:100;} 
.menu ul{list-style:none;} 
.menu li {float:left;position:relative;} 
.menu ul ul {visibility:hidden;position:absolute;left:3px;top:23px;} 
.menu ul li:hover ul, 
.menu ul a:hover ul{visibility:visible;} 
.menu a{display:block;border:1px solid #aaa;background:#cacaca;padding:2px 10px;margin:3px;color:#fff;text-decoration:none;}
.menu a:hover{background:#fafafa;color:#000;border:1px solid #000;} 
.menu ul ul li {clear:both;text-align:left;font-size:12px;} 
.menu ul ul li a{display:block;width:100px;height:15px;margin:0;border:0;border-bottom:1px solid #858585;} 
</style>
</head>
 
<body>
 
<div class="menu">
          <ul>
              <li><a href="#">XHTML/CSS 
                  <!--[if IE 7]><!--></a><!--<![endif]-->
                  <!--[if lte IE 6]><table><tr><td><![endif]-->
                  <ul&g


相关文档:

css自动使用样式

文字自动使用样式
.inputText{
border:1px solid #7898b8;
height:20px;
padding-left:2px;
line-height:20px;
background-image:url(images\\inputtext_bg.gif);
background-repeat:repeat-x;
color:#339900;
}
.inputText是 字体自动设置样式的名称
各种控件自动套用样式
比如table,td
table{border-colla ......

CSS 菜单系列:用 UL 制作横向导航菜单-入门版

用 UL 制作菜单现在非常流行,那我们也凑凑热闹,第一讲就说说用 UL 制作导航菜单的方法,这一讲是入门版,只是实现基本功能,欢迎各位发布自己的实现方式。
我们先定一下 HTML 代码:
<ul id="menu">
<li><a href="http://www.codebit.cn">CodeBit.cn</a></li>
<li><a href="h ......

CSS代码中的“clear:both;”失效了

我最近在模仿博客园,制作一个个人博客,突然发现Footer部分浮动到了Content部分,我在Footer部分已经加了一句“clear:both;”,为什么还会出现这个问题。Footer部分的CSS代码如下: /*页面底部*/
#Footer {width:100%;height:70px;margin:0 auto;clear:both;} /*如果加了clear:both; 此部分就不会浮动了*/ ......

js 修改CSS文件中的样式

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT=""& ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号