Question

我需要在我正在构建的Web应用程序中实现一项功能，这将增加文本大小/窗口缩放以帮助阅读文本。

我头脑中最好的方法是模拟浏览器缩放，以便我的媒体查询也被考虑在内，布局不会中断，但我不确定最好的方式/是否可行。

由于框架使用媒体查询，CSS缩放实际上不是一种选择。

非常感谢任何帮助/其他想法！

Answer 1

好吧，正如@slugolicious所说，你可能应该引导用户使用浏览器内置的浏览器缩放功能。

但是，这完全有可能是客户/业务要求，所以我会建议。

最好的办法是在内容保留元素上放置CSS类，以调整用户的字体大小。

这是一些css类：

#content.font-lg {
    font-size: 125%;
}

#content.font-xl {
    font-size: 150%;
}

要触发它们，一些JavaScript：

function onLargeFontButtonClick() {
    var element = document.getElementById('content');
    element.className = 'font-lg';
}

function onExtraLargeFontButtonClick() {
    var element = document.getElementById('content');
    element.className = 'font-xl';
}

function onNormalFontButtonClick() {
    var element = document.getElementById('content');
    element.className = '';
}

如果您的内容区域已经有类，则可能需要使用+ =代替类名，可能会删除其他字体类的实例。根据您的需求进行调整。

我希望这有帮助！

实现文本大小辅助功能的最佳方法是什么？

1 个答案: