用css实现列表菜单的效果
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <title>Document</title> </head> <body> <style type="text/css"> a:hover{ background:blue; background-repeat:no-repeat;} <!--鼠标放在链接上变颜色--> div.header { text-decoration:none; color:white; background-color:gray; clear:left; ;<!--去掉链接下划线--> } h1.header {text-decoration:none;<!--去掉链接下划线--> padding:8px; ; ;<!--去掉链接下划线--> } a{text-decoration:none;} </style> </head> <body> <!--加载链接--> <div class="header"><h1 class="header"><a href="/index.html">首页</a> <a href="/index.html"> 学习论坛</a> <a href="/index.html">学员问答</a><a href="/index.html"> IT圈子</a><a href="/index.html"> 实时课堂</a><a href="/index.html"> 客户端下载</a><a href="/index.html"> 帮助</a></h1> </div> <div id="menu"> <ul> <li><a href="#">首 页</a></li> <li><a href="#">学习论坛</a></li> <li><a href="#">学员问答</a></li> <li><a href="#">IT圈子</a></li> <li><a href="#">实时课堂</a></li> <li><a href="#">客户端下载</a></li> <li><a href="#">帮助中心</a></li> </ul> </div> </body> </html>
用css实现列表菜单的效果的更多相关文章
- 纯css,编写菜单移入效果
<!doctype html><html lang="en"><head> <meta charset="UTF-8" ...
- css 导航,菜单对应页面切换效果实现方法
实现原理: 每个菜单有多个li标签,每个li标签含一个id,li标签的id用来标记:点击效果 每个页面有一个id,这个id的作用是对应每个li标签的点击链接对应的页面,它的作用是用来标记:li标签的h ...
- 个人练习:使用HTML+CSS制作二级菜单
最近一直在学习HTML+CSS,刚看完如果制作下拉菜单部分,就想着做一个练练手. 先上成品图: 就是上面这个效果,横向菜单选项能点击,鼠标放在上面也能展开二级菜单,二级菜单也能点击,点击后就会在底下的 ...
- [转载] ul li css 做横向菜单
原文地址: http://www.cnblogs.com/amylis_chen/archive/2011/09/24/2188398.html 第一步:建立一个无序列表 我们先建立一个无序列表,来建 ...
- web中用纯CSS实现筛选菜单
web中用纯CSS实现筛选菜单 本文我们来用纯css实现像淘宝宝贝筛选菜单那样的效果,例子虽然没有淘宝那样强大,不过原理差不多,如果花点心思也可以实现和淘宝一样的. 内容过滤是一个在Web上常见的一个 ...
- CSS:CSS 下拉菜单
ylbtech-CSS:CSS 下拉菜单 1.返回顶部 1. CSS 下拉菜单 使用 CSS 创建一个鼠标移动上去后显示下拉菜单的效果. 下拉菜单实例 实例演示 1 实例演示 2 基本下拉菜单 当鼠标 ...
- CSS 自适应导航菜单
文章目录 以前我写了一篇关于如何为自适应网页制作教程手机导航菜单,现在我又摸索出一种无需JS脚本的自适应导航菜单,它采用纯粹的语义化HTML5标签来完成.该菜单可以左对齐,居中或右对齐,也不像上一种方 ...
- 超简洁的CSS下拉菜单
效果体验:http://hovertree.com/texiao/css/3.htm HTML文件代码: <!DOCTYPE html> <html xmlns="http ...
- iOS开发——UI篇&下拉弹出列表选择项效果
下拉弹出列表选择项效果 右边菜单中的按键,点击弹出一个列表可选择,选择其中一个,响应相应的事件并把文字显示在右边的菜单上:弹出下拉效果使用LMDropdownView插件,可以用POD进行加载pod ...
随机推荐
- c#程序将excel文件转换成xml文件
要程序你自己去组装去,我只写两个部分,一个是读Excel的部分,然后是写入到xml的1) 从指定的excel读出信息string strConn="provider=Microsoft.Je ...
- [Asp.net]常见word,excel,ppt,pdf在线预览方案(转)
引言 之前项目需要,查找了office文档在线预览的解决方案,顺便记录一下,方便以后查询. 方案一 直接在浏览器中打开Office文档在页面上的链接.会弹出如下窗口: 优点:主流浏览器都支持. 缺点: ...
- bootstrap固定响应式导航
<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap. ...
- URAL 1009 K-based Numbers
题目:Click here #include <bits/stdc++.h> using namespace std; typedef long long ll; const int IN ...
- ThinkPHP第四天(U函数,URL类型参数配置,伪静态后缀名配置,数据传递与获取$_GET等)
1.U('地址','参数','伪静态','是否跳转','是否显示域名'); 在模板中使用U方法而不是固定写死URL地址的好处在于,一旦你的环境变化或者参数设置改变,你不需要更改模板中的任何代码. 在模 ...
- Introduction to Json
什么是Json 是Javascript·对象的一种表示,属于轻量级数据,它比XMl小,快,易解析 作用: 用于存储和交换(转换)信息的语言,还可以将各种数据类型放在json中并进行数据传输 整理的章节 ...
- sorl6.0+jetty+mysql
sorl6.0+jetty+mysql搭建solr服务 1.下载solr 官网:http://lucene.apache.org/solr/ v2.目录结构如下 v3.启动solr(默认使用jetty ...
- Qt setStyleSheet 添加背景色/背景图片(取消背景色,读取本地文件作为背景色)
容易搞定,mainWindow 是一个QWidget.// 设置背景色为蓝色mainWindow.setStyleSheet("background-color:blue;"); ...
- 安装andriod studio时出现Internal error. Please report to https://code.google.com/p/an
有两种方法的哈 一,在文件中添加 disable.android.first.run=true (我试了这种就好使了哈) 1)进入刚安装的Android Studio目录下的bin目录.找到idea ...
- Linux的五个查找命令find,locate,whereis,which,type
Linux的五个查找命令 1. find 最常见且最强大的命令,可以查找任何文件. 格式 $ find 指定目录 指定条件 指定动作 指定目录: 所要搜索的目录及其子目录,默认当前目录 ...