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. WPF入门教程系列十八——WPF中的数据绑定(四)

    六.排序 如果想以特定的方式对数据进行排序,可以绑定到 CollectionViewSource,而不是直接绑定到 ObjectDataProvider.CollectionViewSource 则会 ...

  2. div非弹出框半透明遮罩实现全屏幕遮盖css实现

    IE浏览器下设置元素css背景为透明: background-color: rgb(0, 0, 0); filter: alpha(opacity=20); 非IE浏览器下设置元素css背景为透明: ...

  3. The transaction log for database 'xxxx' is full due to 'ACTIVE_TRANSACTION'

    今天查看Job的History,发现Job 运行失败,错误信息是:“The transaction log for database 'xxxx' is full due to 'ACTIVE_TRA ...

  4. WaitType：SOS_SCHEDULER_YIELD

    今天遇到一个query,处于SOS_SCHEDULER_YIELD 状态,physical IO 不增加,CPU的使用一直在增长.当一个sql query长时间处于SOS_SCHEDULER_YIEL ...

  5. LINQ系列：Linq to Object限制操作符

    1. Where 限制操作符Where用于过滤序列,按照提供的逻辑对序列中的数据进行过滤.Where可以出现多次. 1.1 原型定义 public static IEnumerable<TSou ...

  6. ImageView设置边框的两种方式

    转载:http://www.2cto.com/kf/201308/239945.html package cc.testimageviewbounds; import android.os.Bundl ...

  7. Android重写菜单增加系统自带返回键

    条件:当前项目导入了ActionBarSherlock这个jar包,这个jar包的作用为了程序的兼容性,考虑低版本的问题. 学习ActionBarSherlock参考博客链接:http://blog. ...

  8. react+redux教程（一）connect、applyMiddleware、thunk、webpackHotMiddleware

    今天,我们通过解读官方示例代码(counter)的方式来学习react+redux. 例子 这个例子是官方的例子,计数器程序.前两个按钮是加减,第三个是如果当前数字是奇数则加一,第四个按钮是异步加一( ...

  9. Redis入门

    一.安装 目前,官方最新稳定版本为3.0.7 # wget http://download.redis.io/releases/redis-3.0.7.tar.gz # cd /usr/local/ ...

  10. position:fixed和scroll实现div浮动【示例】

    前言 在自己建站的过程中,要实现一个div随滚动条浮动的效果,网上找了些示例不太好用,还是自己动手,丰衣足食,写的不好请大家谅解,毕竟我不是搞前端的,因为自己建站毕竟每一步都必须自己来,这边只是做个记 ...