为 webkit/IE 指定 CSS,无需单独的 CSS
对于 IE,我可以使用这个:
.content {
*padding: 10px;
padding: 10px
}
通过这样做,*-部分将仅用于 IE。 webkit 浏览器也有类似的技巧吗? (不让他们为 webkit 浏览器调用特殊的 .css 吗?)
For IE I can use this:
.content {
*padding: 10px;
padding: 10px
}
By doing so, the *-part will only be used for IE. Is there a tric like this for webkit browsers too? (Whitout having them called to a special .css for webkit browsers?)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(5)
对于基于 webkit 的浏览器来说,没有这样的 hack。但是,您可以使用以下方法实现这样的效果(在多个浏览器中):
此解决方案背后的关键是浏览器会忽略未知的 CSS 声明。
-webkit-
前缀仅在基于 webkit 的浏览器中可用。同样,以下前缀可用于检测其他浏览器引擎:
-moz-border-radius:1px;
- Gecko,例如 Firefox-o-border-radius:0;
-o-border-radius:1px; - Gecko,例如 Firefox-o-border-radius:0; - Opera
-ms-border-radius:0;
- Trident,例如 Internet Explorer您的用户可能使用的是不支持
border-radius,但由于 Chrome 通常是保持最新(自动更新),
webkit
解决方案应该始终有效。There's not such a hack for webkit-based browsers. However, you can achieve such an effect (in multiple browsers) using:
The key behind this solution is that unknown CSS declarations are ignored by a browser. The
-webkit-
prefix will only be available in webkit-based browsers.Similarly, the following prefixes can be used to detect other browser engines:
-moz-border-radius:1px;
- Gecko, such as Firefox-o-border-radius:0;
- Opera-ms-border-radius:0;
- Trident, such as Internet ExplorerThere's a chance that your user has an ancient browser which don't support
border-radius
, but since Chrome is usually kept up-to-date (auto-update), thewebkit
solution should always work.找到了一个不错的黑客。乍一看似乎有效:)
Found a decent hack. Seems to work at first sight :)
如果您使用 PHP,则有一个函数调用:
get_browser()
检查:http://php.net/manual/fr/function.get-browser.php
该函数返回有关客户端浏览器的所有信息的数组。
将这些信息作为 CSS 类添加到您的 body 标记中。
您将能够定位特定的浏览器,而无需使用 CSS hack 和
拥有有效的 CSS 代码。
祝你好运!
If you work with PHP, there is a function call :
get_browser()
check at : http://php.net/manual/fr/function.get-browser.php
This function returns an array of all the information about the client browser.
Add these informations as CSS class in your body tag.
You will be able to target specific browser without using CSS hack and
have a valid CSS code.
Good luck!
使用以下内容来定位 Webkit:
如果您需要支持 IE7,请添加以下内容以过滤此规则,使其不适用:
Use the following to target Webkit:
If you need to support IE7, add the following to filter this rule from applying to it:
对于那些没有安装扩展的人,我找到了一种新方法,而不是使用 get_browser() 。这种新方法是使用 HTACCESS 来代替。您需要安装模块“mod_setenvif”。
这是您需要放入 .htaccess 文件中的代码。
它是 HTTP_USER_AGENT 服务器变量的正则表达式。如果匹配,我们将创建一个 USER_AGENT 变量来存储匹配的浏览器名称。
然后,您可以在 PHP 代码中使用新的服务器变量。
祝你有美好的一天。
I found a new way instead of using get_browser() for those who doesn't have the extension installed. This new way is by using HTACCESS instead. You need the module "mod_setenvif" installed.
Here is the code you need to put in the .htaccess file.
It's a regexp over the HTTP_USER_AGENT server variable. If it matches, we create a USER_AGENT variable to store the matching browser name.
Then, you can use the new server variable in your PHP code.
Have a good day.