Question

如何防止用户在我的网站上调整字体大小？

Answer 1

实际上，出于可访问性原因，您应该允许字体大小调整。

Answer 2

你做不到。字体大小调整发生在客户端，您无法控制。用户可以随意增加或减少字体大小。

如果您担心自己的网页标记会因较大的字体大小而中断，那么请忽略它。没有办法创建一个或多或少复杂的设计，以适应任何可能的字体大小变化。如果用户选择使用它，那么如果标记中断则最终是他们的错。但他们可能已经习惯于看到破页了。

无论如何，现代版本的浏览器（IE，FireFox，Opera）只是缩放渲染页面，保持元素的相对比例不变。问题解决了。

Answer 3

两个选项：

将所有文字制作成图像。
检测浏览器字体大小更改和基本字体（当它们到达您的网站时），然后动态调整字体大小以补偿其更改。

以下是字体大小检测器的javascript：http://www.alistapart.com/d/fontresizing/textresizedetector.js

现在你所要做的就是将一个resize函数附加到监听器并用id，“bodyContent”包围div中的所有标记（这样字体事件监听器就不会捕获你的补偿函数：

addFontResizeListener = function () {
        var iBase, reloadBoolean;

        iBase = addEventListener(lzaIndex.onFontResize, null);

        //Don't run the updateBaseFontSize if font size is not larger than usual
        if (iBase > 20) {
            reloadBoolean = false;
            updateBaseFontSize(iBase, reloadBoolean);
        }
    };

    //id of element to check for and insert control
    TextResizeDetector.TARGET_ELEMENT_ID = 'bodyContent';
    //function to call once TextResizeDetector has init'd
    TextResizeDetector.USER_INIT_FUNC = addFontResizeListener;

    onFontResize = function (e, args) {
        var iSize, reloadBoolean;

        iSize = args[0].iSize; //get new user defined size

        reloadBoolean = true;
        updateBaseFontSize(iSize, reloadBoolean);
    };

然后添加readjustment本身：

updateBaseFontSize : function (fontSize, reloadBool) {
    /*Format 1 is fed from the plugin; format2 is the body size equiv
     *examples:
     *Frmt 1 (all/IE) | Frmt 2 (all/IE)
     *20/18           | 16px/16px
     *21/21           | 17.6px/19px
     *22/23           | 19.2px/22px
     *
     *Purpose of updateBaseFontSize is:
     * 1. convert format 1 figures to format 2
     * 2. modify the all containing div 'fontbodyreadjust'
     *    to compensate for the new user defined body font size
     */


    var format1Base, format1Size, reloadPage, baseConverter, changeConverter,
    format2Base, format2SizeChange, format2NewSize, modifiedSize;

    format1Size = fontSize; //equals new size in pixels
    reloadPage = reloadBool; //prevents reload on 1st visit

    if ($('body').hasClass('browserIE')) {
        format1Base = 19; //expected base size value for IE
        baseConverter = 16 / 19; //converts from format 1 to 2 for IE
        changeConverter = 1.5; //ditto for the difference from base size for IE
    } else {
        format1Base = 20;//expected base size value for all other browsers
        baseConverter = 16 / 20; //converts from format 1 to 2 for all others
        changeConverter = 1.6; //ditto for the difference from base size for all others
    }

    //Find modifiedSize, how much to compensate for the new body size
    format2Base = format1Base * baseConverter;

    format2SizeChange = (format1Size - format1Base) * changeConverter;
    format2NewSize = format2SizeChange + format2Base;

    modifiedSize = format2Base / format2NewSize;

    //Allow text resizing for shrinking text and very very large text
    //Only works for safari. meant to prevent odd behavior at math extremes
    jFontBodyReadjust = $('#fontbodyreadjust');

    if ((format2NewSize >= format2Base) && (modifiedSize > 0.6)) {
        jFontBodyReadjust.css('font-size', modifiedSize + 'em');
    }

    //reloadPage boolean in place so that reload doesn't occur on first visit
    if (reloadPage) {
        window.location.reload();
    }
}

请记住：为那些看不到您定义的字体大小的人提供替代方案。这是正确的做法。您可以在if (iBase > 20)

PS。还要记住，您可以在ems中指定所有元素宽度（图像等），以便字体调整大小调整所有内容，但它有点乱，有不同的浏览器解释必须补偿，并且您不能使用精灵（因为ems只会显示你想要的更多精灵子部分。

PSS。在px中指定对现代浏览器没有任何好处...不知道为什么这似乎是一个受欢迎的答案。

Answer 4

如何将文字转换为图片。

Answer 5

以PDF格式发布。正如其他人所说，HTML并非设计为印刷媒体

Answer 6

技术上你不能，但你能做的是：

将所有内容重新创建到Flash网站
将Flash嵌入您的网站时禁用放大或右键菜单。（只是谷歌如何禁用右键菜单，非常简单，像“allow-menu = false”

多数民众赞成。大多数用户现在无法调整字体大小，除非他们知道如何破解=）

如果您这样做： 1.有很多时间 2.想要尝试新事物不要在意浪费你的时间和精力（笑）

Answer 7

虽然通常是一个坏主意，但情况并不像前面提到的那样明确。

截至目前（2012年9月），目前可以阻止谷歌浏览器和 Safari 的用户调整渲染字体的大小。提供以下方法是为了完整起见，并提高认识。请避免使用这些人的诱惑，因为它严重破坏了可用性和可访问性指南。

p {
     -webkit-text-size-adjust:none;
  }

根据此Mozzila discussion，该扩展程序适用于移动设备，但不幸的是它已经进入WebKit支持的桌面浏览器。

它是非标准的，因此必须使用前缀。适用于Firefox和IE的相应扩展程序-moz-text-size-adjust和-ms-text-size-adjust。

此外，该问题还有WebKit bug个记录。

示例：的

在许多网站上滥用这种内容已经发生了可怕的事情。 Facebook's Social plugin就是这样一个案例。

FB comments on Techcrunch

在Safari或Chrome中查看上述链接，目前不允许通过 Ctrl + _{[Lin / Win]}或⌘ + _{[OS X]}

Answer 8

你做不到。浏览器的“缩放”控件不受开发人员的调整。此外，“字体”将根据不同的屏幕分辨率而不同（例如，如果您的字体大小以像素为单位）。

Answer 9

英国的法律规定，您不应提供限制残疾人士访问的网站/服务。

从1999年10月1日起，服务提供商必须采取合理措施改变一种使残疾人难以使用其服务难以理解的做法

Disabilty Act

虽然该法律未得到执行，但它被视为“专门提及网站的行为准则”。

它只是一个'行为准则'，而不是每个人都遵循它。

Answer 10

我猜你想要的是保持图像文本比例，因为你的客户坚持要求用户获得一致的固定布局（即使你试图告诉他这不是网络的运作方式。）

在这种情况下，一个简单的解决方法是在CSS中以px为单位指定字体大小。这样，用户仍然可以使用浏览器的缩放功能，但15px字体与150px图像的关系将始终保持不变，与用户的字体大小或dpi设置无关。

Answer 11

指定字体大小（以像素为单位）。我不推荐它。

如何防止用户在我的网站上调整字体大小？

11 个答案: