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>
时间： 2024-11-05 12:12:07

hover 变内容的相关文章

【javascript/css】关于鼠标事件onmousexxx和css伪类hover

在运用鼠标移入移出事件时,一般有两种做法,一种是DOM事件的"onmouseover"和"onmouseout",还有一种是css的伪类":hover". 在实际运用中如何选择,取决于清楚明白的了解他们之间的区别. HTML DOM 允许 JavaScript 对 HTML 事件作出反应. 在我们为元素绑定了一个事件,当事件发生的时候,可以执行一段javascript代码. 关于鼠标事件,总共有: onmouseover和onmouseout 鼠

3D案例，导航，导航升级版

/*****************************百度钱包旋转变内容******************************/ <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>百度钱包旋转变内容</title> <style> .wallet{ width: 300px; height:300px ; margin:

html的小例子

常用的前端实例: 1略 2.在网页商城中的图片当我们把鼠标放上去之后,图片会显示一个有颜色的外边框,图片某一部分的字体的颜色并发生改变 鼠标放上去之前 鼠标放上去之后: 实现的代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" content="text/html" http-equiv="Content-Type&

HTML--比较实用的小例子

常用的前端实例: 1略 2.在网页商城中的图片当我们把鼠标放上去之后,图片会显示一个有颜色的外边框,图片某一部分的字体的颜色并发生改变 鼠标放上去之前 鼠标放上去之后: 实现的代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" content="text/html" http-equiv="Content-Type&

Css伪类权重

css样式的权重计算在css中有很重要的作用,会影响很多样式的显示, css的权重按标签,class,id,inlinecss的权重分别是1,10,100,1000,还有一种就是!important, important是权重最高的,它的权重比内联样式还高. 上面这些都是大家很容易知道,今天我们要讨论的是伪类的权重 css中的伪类有:hover,visited,focus,active等,这些伪类的权重该怎么考虑呢. 看下面的例子: <html> <head> <style

HTML与CSS基础学习

HTML基础的文档树 <!DOCTYPE html> # 告诉浏览器使用什么样的html或xhtml规范解析html文档 <html lang="en"> # html部分 <head> # 头部信息,head头部信息内容不会被浏览器解析显示到网页 <meta charset="UTF-8"> <title>Title</title> </head> <body> # 主

Node——构建Web应用

基础功能 之前我们通过http模块创建了一个简单的服务器,但是对于一个网络应用来说肯定是远远不够的,在聚义的业务中我们至少有如下要求: 请求方法的判断 URL的路径解析 URL中查询字符串的解析 Cookie的解析 Basic认证 表单数据的解析 任意格式的上传处理 Session管理 一切的开始都是这个函数: var server = http.createServer(function (req, res) { res.writeHead(200, {'Content-Type': 'tex

TMDS协议

1 概述 1.1    连接结构 图1 TMDS连接结构 数据流中包含了像素和控制数据,发送器在任何给定的输入时钟周期,到底是编码像素数据还是控制数据取决于数据使能信号DE,DE有效时,指示像素数 据要被发送,注意,当发送像素数据的时候,忽略控制数据,反之,发送控制数据的时候,忽略像素数据.在接收端,恢复的像素(控制)数据仅在DE有效(无 效)时才传输. 我们把DE有效期间,成为像素数据有效期间,就是说这段时间发送的是有效像素数据.DE无效期间,成为发送空间隙期间,这段时间发送的数据不包括有效像

最稳定的国内免备案服务器,支持301跳转,可做A记录,解决域名被墙。

国内免备案服务器哪些地方呢?(福州机房|台州机房) Q:2885167906国内免备案服务器,支持301跳转,完美解决域名被墙的问题,域名不备案照样开80端口挂站.死扛大攻击流量,提供60G-300G普通高防服务器,100G-500G独立清洗高防服务器,不封不查,抗投诉,解决站长的烦恼,让您的网站浏览速度感受飞一般的感觉,不限内容高防服务器!国内免备案服务器优势在哪里 有些网站为什么需要用国内免备案的服务器呢?域名被墙:如果域名能ping通却打不开站点,(排除服务器宕机)用代理或者VPN可以打开