美文网首页
CSS sprite 及鼠标悬停变换(CSS常见样式2)

CSS sprite 及鼠标悬停变换(CSS常见样式2)

作者: 闻金听凤 | 来源:发表于2018-03-30 07:29 被阅读0次

    目的:实现连接中效果http://js.jirengu.com/yeza

    1. html中创建块级元素<div class="logo"></div>
      注意引入外部CSS样式!
    2. 创建CSS文件
      .logo{
      width:100px
      height:100px
      background:url(图片路径)
      background-size:100px
      }
    3. 创建悬停状态
      .logo:hover{
      background-position: 0 -99px
      }
    4. 在html中引入css样式
      ...<style type=text/css>
      @import url(CSS路径及文件名)
      </style>
      ...

    相关文章

      网友评论

          本文标题:CSS sprite 及鼠标悬停变换(CSS常见样式2)

          本文链接:https://www.haomeiwen.com/subject/bqdbcftx.html