Question

我刚开始使用Google Material图标。

<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
      rel="stylesheet">

<a title="E-mail " href="mailto:es@example.com?subject=RE:&nbsp;Estimate Request"><i class="material-icons md-36 bg_white">email</i></a>
    <a title="Call" href="tel:+15555555"><i class="material-icons md-36 bg_white">call</i></a>
    <a title="Send SMS" href="sms:+5555555"><i class="material-icons md-36 bg_white">message</i></a>

有没有办法突出显示焦点上的图标，以便有一个更明显的视觉队列（除了淡蓝色边框），图标在选项卡时突出显示？喜欢换色，叠加，或显示标题等......

这是我的css：我尝试添加：focus但没有任何变化。

.material-icons.md-18font-size:18px}
.material-icons.md-24{font-size: 24px} /* Default */
.material-icons.md-36{font-size: 36px}
.material-icons.md-48{font-size: 48px}
.material-icons{color:green /*#663300*/}
.material-icons:active, .material-icons:focus, .material-icons:hover{color:#8bc34a}

感谢。

Answer 1

这是一个拼写错误还是你在源代码中也有同样的方式？因为，如果是后一种情况，那么第一行的CSS中似乎缺少{，而.material-icons.md-18font-size:18px}应该是.material-icons.md-18{font-size:18px}。:hover。修复它确实会对图标进行颜色更改，至少在from("direct:start") .toD("${header.foo}");上。

谷歌图标改变：焦点

1 个答案: