html - 在屏幕上调整导航菜单PNG的大小

我有一个由png图标组成的导航栏。调整页面大小或在其他窗口上显示时，图标不会移动，因此会被截断。我找不到一种方法来调整不同屏幕上的图标大小并使图标悬停在白色处吗？我知道它们是.png，所以我可能还必须用白色创建所有图标吗？

无论如何，您都可以在http://www.ssangar.com/上看到它
这是我的导航代码：
http://cdpn.io/msjzi

提前致谢！

最佳答案

我不太确定我是否能100％理解您的问题，但是正如Racil所说的那样，您想创建一个CSS，并将其设置为一个百分比或像素...

如果要添加一些转换，请在我的网站上使用以下代码：

            nav li a:hover, nav li a.current {
             color: #0099CC;
            -o-transition: background 0.3s linear 0s, color 0.3s linear 0s;
            -webkit-transition: background 0.3s linear 0s, color 0.3s linear 0s;
            -ms-transition: background 0.3s linear 0s, color 0.3s linear 0s;
            -moz-transition: background 0.3s linear 0s, color 0.3s linear 0s;
            transition: background 0.3s linear 0s, color 0.3s linear 0s;}

所有不同转换背后的原因是所有不接受转换代码的旧浏览器。

*注意：您将需要在CSS代码中提供更多的导航信息，以上内容只是为了使其具有过渡效果。.*