<!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">

    .quan{

        width:315px;

        height:450px;

        border:#D87F15 1px solid;

        background:#CDD4DC;

        }

    .head{

        background:#2A4F7B;

        color:#FFF;

        font:20px bold;

        text-indent:20px;

        }

    ul{

        margin:0px;

        padding:0px;

        }

    li{

        padding:11px;

        float:left;

        list-style:none;

    }

    h4{

        margin:8px;

        }

    .span1{

        background-image:url(%E5%9B%BE%E7%89%87%E7%B4%A0%E6%9D%90/icon-01.jpg);

        background-repeat:no-repeat;

        background-position:0px 2px;

        text-indent:1em;

        margin:8px;

        }

    .span2{

        background-image:url(%E5%9B%BE%E7%89%87%E7%B4%A0%E6%9D%90/icon-01.jpg);

        background-repeat:no-repeat;

        background-position:0px 2px;

        text-indent:1em;

        margin:8px;

    }

    img{

        border:#FFF 2px solid;

    }

    a:hover img{

        border:#D87F15 2px solid;

    }

  /*

  ul,li{

      margin:0px;

      padding:0px;

  }

  ul{

      border:1px red solid;

      width:420px;

  }

  ul li{

      width:140px;

      float:left;

      border:1px blue solid;

      list-style:none;

  }

  ul li a:link img{

       border:1px red solid;

  }

  ul li a:hover img{

       border:1px blue solid;

  }

  */

</style>

</head>

<body>

<div class="quan">

<div class="head">精彩视频</div>

<ul>

     <li>

        <a href="#"><img src="图片素材/video-01.jpg" /></a>

        <h4>享受丰硕的成果</h4>

        <p class="span1">时长：80秒</p>

        <p class="span2">点击：45356</p>

    </li>

    <li>

        <a href="#"><img src="图片素材/video-01.jpg" /></a>

        <h4>享受丰硕的成果</h4>

        <p class="span1">时长：80秒</p>

        <p class="span2">点击：45356</p>

    </li>

    <li>

        <a href="#"><img src="图片素材/video-01.jpg" /></a>

        <h4>享受丰硕的成果</h4>

        <p class="span1">时长：80秒</p>

        <p class="span2">点击：45356</p>

    </li>

    <li>

        <a href="#"><img src="图片素材/video-01.jpg" /></a>

        <h4>享受丰硕的成果</h4>

        <p class="span1">时长：80秒</p>

        <p class="span2">点击：45356</p>

    </li>

</ul>

</div>

</body>

</html>

将img的border和a:hover的border设置成不一样就会发生有趣的情况。

踢掉某个li的更多相关文章

  1. Linux 系统强制踢掉登录用户并禁止用户再次登录系统

    标注:创建一个test测试用户,test用户使用Xshel工具ssh远程登录linux操作系统. 强制踢掉登录用户方法一: [root@cloucentos6 ~]# w               ...

  2. Linux用root强制踢掉已登录用户

    首先使用w命令查看所有在线用户: [root@VM_152_184_centos /]# w 20:50:14 up 9 days, 5:58, 3 users, load average: 0.21 ...

  3. linux强制踢掉登录用户【转】

    [root@Wang ~]# w :: up :, users, load average: 0.71, 0.58, 0.57 USER TTY FROM LOGIN@ IDLE JCPU PCPU ...

  4. Linux用root强制踢掉已登录用户；用fail2ban阻止ssh暴力破解root密码

    Linux用root强制踢掉已登录用户   首先使用w命令查看所有在线用户: [root@VM_152_184_centos /]# w 20:50:14 up 9 days, 5:58, 3 use ...

  5. Linux系统下强制踢掉登录用户

    1,利用who命令,找出用户登录的终端代号 who root     pts/0        2017-03-14 22:30 (223.1.1.1) root     pts/1        2 ...

  6. Linux：使用root踢掉其他用户

     首先使用w命令查看所有在线用户:  执行命令: pkill -kill -t tty3 再用w命令查看是否已经强制踢掉: TTY 是终端的意思    TTY :0 表示root用户登陆图形化界面的终 ...

  7. centos如何强行踢掉某登录用户

    linux是一个多用户操作系统,用户可以在不同的地方链接上LINUX服务器. 在系统中我们可以用w或者who来查看用户: [root@7273 ~]# who root pts/0 2019-04-1 ...

  8. php同一个用户同时只能登陆一个, 后登陆者踢掉前登陆者（排他登陆）

    通常用户登陆,如果没有特别的限定, 同一个用户可以同时登陆, 今天搞了一个东西限定一个用户不能同时登陆到一个系统上, 后登陆者会把前面登陆的踢出来.(有点像QQ,同个帐号不能在多个地方同时在线, 后面 ...

  9. 这个注册的 IP 网络都不通了，Eureka 注册中心竟然无法踢掉它！

    本文导读: 微服务技术架构选型介绍 k8s 容器化部署架构方案 Eureka 注册中心问题场景 问题解决手段及原理剖析 阅读本文建议先了解: 注册中心基本原理 K8s(Kuberneters)基本概念 ...

随机推荐

  1. codeforces 1097 Hello 2019

    又回来了.. A - Gennady and a Card Game 好像没什么可说的了. #include<bits/stdc++.h> using namespace std; cha ...

  2. [原][osg][gdal]两种方式修改tiff高程

    因为对于globalmap不熟悉,不怎么怎么修改高程,好像也没有这功能. 干脆自己手动修改了高程图tiff了 由于自身一直使用osg的 自己使用了osgDB直接读取tiff,修改后保存的. 同事小周一 ...

  3. Android移动应用界面的模板化设计

    Android没有像苹果开发那样功能强大的界面开发工具,本身 ADT插件提供的界面编辑能力有限,没办法刻画所有的界面情况:Android的界面xml代码可以进行人工修改,而Iphone的全部在图形界面 ...

  4. ubuntu配置zsh和oh-my-zsh

    1安装zsh sudo apt-get install -y zsh chsh -s /bin/zsh 2安装oh-my-zsh $ sh -c "$(curl -fsSL https:// ...

  5. 模块commonjs AMD UMD

    commonjs是用在服务器端的,同步的,如nodejs amd, cmd是用在浏览器端的,异步的,如requirejs和seajs 其中,amd先提出,cmd是根据commonjs和amd基础上提出 ...

  6. Redis之字符串类型命令

    String(字符串) string 是 redis 最基本的类型,你可以理解成与 Memcached 一模一样的类型,一个 key 对应一个 value. string 类型是二进制安全的.意思是 ...

  7. 【转】ArcGIS API for Silverlight/WPF 2.1学习笔记（二）

      五.Graphics layer 1.新增Graphics layer Graphics layer用于显示用户自定义绘制的点.线.面图形.使用时确保xaml文件中Graphics layer定义 ...

  8. JavaScript--Array; Array.prototype

    Array: Javascritp中Array的方法: findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引.否则返回-1. find() 方法返回数组中满足提供的测试函数的第一个 ...

  9. Dynamic Web Module 3.1 requires Java 1.7 or newer. 错误解决方案

    在写代码的时候工程出现了这样奇怪的bug很是蛋疼啊,经过查询解决方法,终于解决了这些个问题. 下面是解决问题的方法,和大家分享一下 (1)确定你的java工程配置使用了java 7 右键单击你的工程p ...

  10. python-day4笔记

    1.文件后缀名对python运行没关系 2.Python解释器执行python程序的过程:python3 C:\test.py 1)启动python解释器(内存中) 2)将C:\test.py内容从硬 ...