美文网首页
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