与我怀疑的很多人一样，我有一个现有的网站，我试图修改，所以它适用于更小的移动屏幕。我很乐意为此做出很多让步。然而，我的主要问题是网站的徽标。很高兴将它换成小而静态的东西，但我在原始网站上的内容是徽标的Flash文件。是的，很大的错误，但后来事后才是一件了不起的事情。我需要处理的是一个徽标：
> * Specified in an external style sheet
> * Specified in an external XML file
> * Has additional hard coding in the HTML (size, placement etc)
> * Has an actual external Flash file too of course
因此，我使用Flash的历史决定至少会对四种不同类型的文件以及网站中的每个HTML和PHP页面产生影响。
我的问题是，我可以修改现有网站以指定比我现在更小更简单的最小破坏性方法是什么？我很高兴在移动网站上没有Flash文件功能，如果这有帮助的话。谢谢。
答案 0 :(得分：0)
我在以前不熟悉的网络技术中找到了称为“媒体查询”的答案，我敦促任何不熟悉这个概念的人使用谷歌并找到一个好的入门书。简而言之，媒体查询允许您在样式表中插入一个部分，用于查询正在查看站点的设备的最大（或最小）屏幕分辨率，并为该事件指定另一组样式说明。这就像在样式表中引入If / Else构造一样。
在我的情况下，我只是创建了一个替代徽标 - 较小的静态.jpg图像。然后我计算了屏幕尺寸阈值，我想要显示较小的徽标，然后编写我的媒体查询，如下所示：
@media screen
and (max-device-width: 1023px) {
#flashContent { display:none; }
#altlogo { background-image: url("/images/mobile_logo.jpg"); width: 318px; height: 43px; margin-left: 2%; margin-bottom: 1px;}
}
第一部分表示不显示Flash徽标，而第二部分表示另一种选择。当然你还需要在HTML中创建一个钩子来操作，因此在原始flashContent div之后添加以下div：
<div id="altlogo" role="img" aria-label="My Smaller logo"></div>
注意我不想偏离我原来的问题太远到广泛介绍媒体查询的领域，但我会补充说，我的附加div的参数作为一种解决无法访问问题的方法向替代徽标图像添加“alt”标记。屏幕阅读器将检测并读出这些参数，而不是alt标签。还有其他一些问题没有解决，例如当你只显示一个时加载两个标识，但这些是完全可解决的问题，这些问题超出了我原来要解决的问题的范围，我将留给有兴趣的研究人员。