首页 > 代码库 > Font-Awesome 体验 鼠标进入图标变大
Font-Awesome 体验 鼠标进入图标变大
<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <link href=http://www.mamicode.com/"Font-Awesome-3.2.1/Font-Awesome-3.2.1/css/font-awesome.min.css" rel="stylesheet" /> <style> .the-icons li:hover { background-color: #fbf4f4; } .the-icons li:hover [class^="icon-"], .the-icons li:hover [class*=" icon-"] { *font-size: 28px; *vertical-align: middle; } .the-icons li:hover [class^="icon-"]:before, .the-icons li:hover [class*=" icon-"]:before { font-size: 28px; vertical-align: -5px; } .the-icons li { cursor: pointer; line-height: 32px; height: 32px; padding-left: 12px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } </style></head><body> <form id="form1" runat="server"> <ul class="the-icons"> <li><i class="icon-download-alt"></i>icon-download-alt</li> </ul> </form></body></html>
没有本页内连样式 默认就是 鼠标经过 图标无变化的。 这段 css 代码 还是从 官网 找到,copy过来的。
Font-Awesome 体验 鼠标进入图标变大
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。