hover 变内容
<!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">
div{
width:50px;
height:20px;
line-height:20px;
overflow:hidden;
border:1px solid red;
text-align:center;
}
a{
wdith:50px;
float:left;
overflow:hidden;
text-decoration:none;
}
span{
margin-top:-20px;
display:block; }
a:hover{
padding-top:20px;
}
</style>
</head> <body>
<div>
<a href="#">
<span> hover</span>
默认
</a> </div>
</body>
</html>
hover 变内容的更多相关文章
- CSS快速入门-鼠标悬浮(hover伪类)
一.概述 hover伪类:在鼠标移到元素上时向此元素添加特殊的样式.比较普通的就是一个url,当你鼠标放上去后,会变颜色. 在现实的应用场景也非常之多.最常见的是网站的悬浮导航,当鼠标放到导航条上时, ...
- 【javascript/css】关于鼠标事件onmousexxx和css伪类hover
在运用鼠标移入移出事件时,一般有两种做法,一种是DOM事件的"onmouseover"和"onmouseout",还有一种是css的伪类":hover ...
- 二、CSS 基本介绍
[ 显示目录 ] [ 隐藏 ] 目录 基本概念 CSS组成部分 CSS的规则 引入CSS样式的方法 颜色的表示 CSS Reset 选择器分类 浮动 盒子模型 box-sizing属性 实例:实现“田 ...
- 3D案例,导航,导航升级版
/*****************************百度钱包旋转变内容******************************/ <!DOCTYPE html> <htm ...
- html的小例子
常用的前端实例: 1略 2.在网页商城中的图片当我们把鼠标放上去之后,图片会显示一个有颜色的外边框,图片某一部分的字体的颜色并发生改变 鼠标放上去之前 鼠标放上去之后: 实现的代码: <!DOC ...
- HTML--比较实用的小例子
常用的前端实例: 1略 2.在网页商城中的图片当我们把鼠标放上去之后,图片会显示一个有颜色的外边框,图片某一部分的字体的颜色并发生改变 鼠标放上去之前 鼠标放上去之后: 实现的代码: <!DOC ...
- Justinmind使用教程(1)——概述部分
Justinmind(http://www.justinmind.com/),类似于Axure的一个原型设计工具.就眼下而言,最适合移动端进行原型设计的工具,预计抛开Axure几条街了,可是眼下国内站 ...
- CSS3图片翻转切换案例及其中重要属性解析
图片翻转切换,在不使用CSS3的情况下,一般都是使用JS实现动画,同时操作元素的width和left,或者height和top以模拟翻转的效果,并在适当时候改变src或者z-index实现图片切换. ...
- javascript基础笔记
1.获取元素: var box=document.getElementById("box");2.改变元素内容: b ...
随机推荐
- [Java编程思想-学习笔记]第4章 控制执行流程
4.1 return 关键字return有两方面的用途:一方面指定一个方法结束时返回一个值:一方面强行在return位置结束整个方法,如下所示: char test(int score) { if ...
- javascript设计模式-策略模式
策略模式笔记 将定义的一组算法封装起来,使其相互之间可以替换. 封装的算法具有一定独立性,不会随客户端变化而变化. 与状态模式异同? 1. 结构上看,它与状态模式很像,也是在内部封 ...
- MongoDB学习笔记~MongoVUE对数据进行查询,排序和按需显示
回到目录 对于MongoDB这个非关系型数据库(NoSql)来说,找一个IDE工具不是很容易,还好被我找到了,它就是大名鼎鼎的MongoVUE,它可以对mongodb数据表进行增删改查,下面我主要说一 ...
- 【hive】——Hive四种数据导入方式
Hive的几种常见的数据导入方式这里介绍四种:(1).从本地文件系统中导入数据到Hive表:(2).从HDFS上导入数据到Hive表:(3).从别的表中查询出相应的数据并导入到Hive表中:(4).在 ...
- Unshelve Instance 操作详解 - 每天5分钟玩转 OpenStack(39)
上一节我们 shelve instance 到 Glance,本节讨论如何通过 unshelve 操作恢复该 instance. 因为 Glance 中保存了 instance 的 image,uns ...
- 实战搭建SVN代码版本服务器
前言:公司要求搭建一台SVN代码版本管理服务器,用于管理所有代码资产: 项目架构图 1.环境安装 [root@host_centos ~]#yum –y install subversion mod_ ...
- Mysql错误:Ignoring query to other database解决方法
Mysql错误:Ignoring query to other database解决方法 今天登陆mysql show databases出现Ignoring query to other datab ...
- java自带工具-jps、jinfo、jstack、jstat、jmap
掌握java自带的这些监控工具,有助与我们很好的分析问题和jvm性能调优秀.收集了些网上整理很好的文章. Java监控工具.调优.调试辅助函数 Java自带的GUI性能监控工具Jconsole以及Ji ...
- Log4J基础详解及示例大全
去年这个时候,为做软件工程的大作业就详细学过Log4J的用法了,时隔一年想要在新的项目中好好使用一下的时候,发现几乎全忘了,悲催啊-- 再上网查资料,总是不能找到一篇符合我的口味,拿来就能轻松上手,方 ...
- TFS 升级错误一则 TF400654
升级后报 [错误] TF400654: 无法配置规划工具.以下元素包含错误: BugWorkItems/BugWorkItems.TF400506: 此元素将定义表示 Bug 或缺陷的工作项的状态.每 ...