HoverTree带说明的CSS菜单:纯HTML+CSS结构链接带说明的黄色导航

在线体验效果：http://hovertree.com/texiao/css/1.htm

代码如下,保存到HTML文件可以看到效果：

<!DOCTYPE html >

<html >

<head>

<title>HoverTree带说明的CSS菜单-hovertree.com</title><base target="_blank" />

<link rel="stylesheet" type="text/css" href="http://hovertree.com/texiao/css/1/hovertreemenu.css" />

</head>

<body>

<div style="width:970px;margin:0px auto;"><h2>HoverTree菜单 - 带说明的CSS菜单</h2>

纯HTML+CSS结构链接带说明的黄色导航 <a href="http://hovertree.com/hvtart/bjae/5w5svpu4.htm">原文</a> <a href="http://hovertree.com">何问起</a> <a href="http://hovertree.com/texiao/">特效库</a></div>

<div class="hovertree-menu">

<ul>

<li> <a href="http://hovertree.com/menu/jquery/">

jQuery

<div class="info">学习jQuery的好地方，从入门到精通，资料大全。</div>

</a> </li>

<li> <a href="http://hovertree.com/texiao/">

网页特效

<div class="info">各种网页特效，jQuery，JS，CSS，HTML5等等。。。</div>

</a> </li>

<li> <a href="http://hovertree.com/menu/aspnet/">

ASP.NET

<div class="info">ASP.NET 资料库，代码大全。</div>

</a> </li>

<li> <a href="http://hovertree.com/hvtart/bjae/1d2c278a117f94ca.htm">

jQuery下载

<div class="info">各个版本的jQuery下载。</div>

</a> </li>

<li> <a href="http://hovertree.com/hvtart/bjae/009i1gl6.htm">

相关菜单

<div class="info">纯CSS带说明菜单，另一种风格。</div>

</a> </li>

<li> <a href="http://hovertree.com/menu/javascript/">

JS代码

<div class="info">格式各样的JavaScript代码供你参考。</div>

</a> </li>

<li> <a href="http://keleyi.com/">柯乐义

<div class="info">Web前端资料，jQuery，HTML5等。</div>

</a> </li>

</ul>

</div>

</body>

</html>

参考：http://hovertree.com/hvtart/bjae/009i1gl6.htm

web前端汇总 http://www.cnblogs.com/jihua/p/webfront.html

纯HTML+CSS带说明的黄色导航菜单的更多相关文章

  1. 实用js+css多级树形展开效果导航菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 纯CSS实现二级下拉导航菜单

    这是一款纯CSS菜单,二级下拉导航效果,是最简洁的CSS导航菜单,兼容性也很棒,IE7/8.火狐等都支持,而且它还是学习CSS菜单编写的典型教程,让你学会很多CSS技巧. 运行效果截图如下: < ...

  3. 纯css实现的三级水平导航菜单

    vscode练习使用开发纯css的三级水平导航菜单.先上图: 1.html5布局 <html> <head> <meta charset="UTF-8" ...

  4. 纯CSS3带动画效果导航菜单

    随着互联网的发展,网页能表现的东西越来越多.由最开始单纯的文字和链接构成的网页,到后来的表格布局,再到div+css模式,现在发展到了html+css3.网页能表达的东西越来越多,css3兴起已经很多 ...

  5. 使用CSS创建有图标的网站导航菜单

    在我创建的每一个互联网应用中,我都试图避免创建完全由图片组成的菜单.在我看来,网页菜单系统中应该使用文字.这样做也会让菜单变得更干净利落.清晰和易读,不用考虑应用程序如何读取它,以及页面放大的时候也不 ...

  6. 用CSS做导航菜单的4个理由

    导航结构在网站设计中是起到决定性作用的,导航菜单/栏常常通过颜色.排版.形状和一些图片来帮助网站创造更好的视觉和感受,它是网页设计的关键元素.虽然网站导航菜单的外观是网页设计中关系到整个设计成败与否的 ...

  7. WEB入门.九 导航菜单

    学习内容 水平导航菜单 垂直导航菜单 下拉式导航菜单 能力目标 制作tab标签导航菜单 制作带箭头的导航菜单 制作带信息提示的导航菜单 制作垂直下拉导航菜单 制作水平下拉导航菜单 本章简介 上一章节中 ...

  8. DIV+CSS制作二级横向弹出菜单，略简单

    没有使用JavaScript控制二级菜单的显示,结果如上图所示. 代码如下: <!DOCTYPE html> <html> <head> <meta char ...

  9. 纯css实现京东导航菜单

    纯CSS代码实现导航菜单,推荐在chrome预览! 预览请点击这里:mygithub <!doctype html> <html lang="en"> &l ...

随机推荐

  1. 在计算机 . 上没有找到服务 WAS

    添加的程序不全导致或者服务没开启导致 重新打开IIS,刷新一下 发现已经可以了,不再标红报错了

  2. VS代码提示不出现或者提示变成英文或者各种奇葩问题的解决

    万能法==>重置 代码提示变成英文的了 打开开发员命令提示 输入:devenv.exe /setup /resetuserdata /resetsettings 重新打开,会和你第一次安装完毕一 ...

  3. LINQ系列：Linq to Object元素操作符

    元素操作符从一个序列返回单个指定的元素. 1. DefaultIfEmpty DefaultIfEmpty操作符将一个空集合替换为包含默认的单个值的集合.在返回序列为空且又需要返回一些对象时,可以通过 ...

  4. nodejs+edatagrid读取本地excel表格

     

  5. jquery $.each的用法

    通过它,你可以遍历对象.数组的属性值并进行处理. 使用说明 each函数根据参数的类型实现的效果不完全一致: 1.遍历对象(有附加参数) $.each(Object, function(p1, p2) ...

  6. 利用select实现年月日三级联动的日期选择效果

    × 目录 [1]演示 [2]规划 [3]结构生成[4]算法处理 前面的话 关于select控件,可能年月日三级联动的日期选择效果是最常见的应用了.本文是选择框脚本的实践,下面将对日期选择效果进行详细介 ...

  7. php的基础

    js是前段脚本语言 php是后端脚本语言 一.所建的文件都要存在wap下的www里面 二.所有的文件名都不能包含中文 三.通过输入 localhost/www下的文件名称,可以浏览 四.在DW内新建站 ...

  8. android给View设置上下左右边框

    给View控件设置边框,可以动态设置上下左右.通过布局文件就能搞定 1.在drawable文件夹下新建一个shape_main_list_bg.xml文件 <layer-list xmlns:a ...

  9. Android微信分享图片大于32k进行压缩

    微信分享视频的时候,需要传一个图片数组,大小不能大于32k. 解决方案:使用Bitmap自带的compress方法解决了这个问题. 源码如下: <span style="font-si ...

  10. 窥探Swift之类的继承与类的访问权限

    上一篇博客<窥探Swift之别具一格的Struct和Class>的博客可谓是给Swift中的类开了个头.关于类的内容还有很多,今天就来搞一下类中的继承以及类的访问权限.说到类的继承,接触过 ...