Question

我目前正在开发一个使用html5必需标记和jquery验证插件的应用程序，以确保在表单提交之前填写所有字段。我希望错误消息看起来一样，但我真的不知道从哪里开始寻找每个浏览器用来处理html5中所需标签的样式。有没有办法获取浏览器用于所需标签的CSS？（我可以自己硬编码一个.required类，但我想至少找到一个浏览器的样式，因为从我看到的它们都比我知道的更好！）

谢谢！

Answer 1

您可以尝试使用浏览器检查器获取这些样式（Chrome中的F12或右键单击 - ＆gt;检查元素，但我不知道您是否可以定位它）。如果您是新开发人员，那么您可能会发现SnappySnippet Chrome插件非常方便。它允许您将最后一个选中元素（带检查器）的样式发送到CodePen或JSFiddle。

无论如何，如果您无法使用检查器定位消息，您可以找到基于 webkit 的浏览器Here的默认样式，只需搜索::-webkit-validation-bubble

Answer 2

据我所知，Chrome使用“标注”字体形状。它不完全相同，但您可以在此网站上创建类似的内容：http://csstooltip.com/

在Firefox中，您需要做的是创建一个示例页面，右键单击元素（输入字段）并选择“Inspect Element”。执行此操作后，您应该可以单击屏幕右侧的“计算样式”选项卡，然后可以选中底部显示“浏览器样式”的复选框。这将显示浏览器的功能。

顺便说一句，如果您需要一些可以轻松运行的测试代码，以下内容应该可以正常运行：

<html>
    <head><title>test</title></head>

    <body>
        <form name="input" action="#" method="get">
            <input type="text" required placeholder="example"/>
            <input type="text" required placeholder="example" />
            <input type="submit" value="submit" />
        <form>
    </body>
</html>

祝你好运！

获取html5中所需的CSS浏览器使用

2 个答案: