这里明显是因为有一个优先级更高的 .iconfont,它的 font-size 才是最后起决定作用的。
如果最简单粗暴的话,可以加 !important。
针对你的需求来看,用css3来操作我觉得不是很恰当。目前能够良好的支持CSS3的浏览器全都对SVG支持良好,使用SVG构建矢量图图标是比较合适的,即使你需要兼容IE6,使用raphael.js也可以办到,目前这个js已经整合到最新的ext4.0.7.js中。
通常的html元素都不是矢量图,缩放可能带来问题,这个HTML元素都无法控制,CSS更是鞭长莫及了