Javascript em根据窗口/视口尺寸调整大小不影响文档样式文本/css？

我正在使用以下工具根据浏览器大小调整文本（和其他元素）的大小

(function(w){
   var run = w.onresize = function(){
    document.body.style.fontSize=window.innerWidth*.009536+"px"
   }
   run();
})(window);

但是，它不会影响以下范围内的任何内容：

<style type="text/css">
.search-sprite
{
background-image: url(../../images/searchsprite.png);
height: 2.46em;
cursor: pointer;
background-repeat:no-repeat;
}

.search-sprite:hover {
background-position: 0px -2.46em;   
}
</style>

.搜索精灵
{
背景图像：url（../../images/searchsprite.png）；
高度：2.46em；
光标：指针；
背景重复：无重复；
}
.搜索精灵：悬停{
背景位置：0px-2.46em；
}

为什么?？我怎样才能修好它

@media screen and (max-device-width : 320px)
{
  body or yourdiv element
  {
    font:size(px/em/cm);
  }
}
@media screen and (max-device-width : 1024px)
{
  body or yourdiv element
  {
    font:size(px/em/cm);
  }
}

---

您可以根据屏幕大小手动设置。只需查看不同的屏幕大小并手动添加字体大小。

嘿，可以使用css完成。所以您想试试还是只使用javascript？我可以使用css。。。它使用媒体查询吗？如果是这样的话，我经常发现由于所需调整的广度和数量太大而无法真正有效。媒体查询或使用%字体可以吗？不完全确定您的意思。你是说一个解决方案是把em改成%？看看下面我的代码并应用到你的css。。。