问题描述
看起来这不工作了。也许Facebook停止尊重css属性?
Looks like this doesn’t work anymore. Maybe Facebook stopped respecting the "css" attribute? Does this still work for anyone?
推荐答案
Facebook已弃用(在2009年推出),赞成新的。虽然每个功能类似,但它们使用不同的JavaScript API。
Facebook has deprecated the Fan Box (introduced in 2009) in favor of the new Like Box. While the features of each are similar, they use different JavaScript APIs.
您仍然可以,但不清楚Facebook将继续支持这种能力多长时间。
You can still customize the appearance of the Fan Box with your own external CSS, but it's unclear how long Facebook will continue to support this ability.
下面是一些示例FBML代码,显示了风扇框如何接受外部CSS:
Here's some sample FBML code that shows how the Fan Box accepts external CSS:
<div id="fb-root"></div>
<fb:fan
profile_id="104818966496"
backgroundshow_faces="true"
stream="false"
header="false"
connections="8"
css="http://example.com/css/stylesheet.css?1310162522">
</fb:fan>
<script>
// Initialize Facebook JavaScript SDK
// http://developers.facebook.com/docs/reference/javascript/FB.init
window.fbAsyncInit = function() {
FB.init({
appId: '136570223089806',
xfbml: true
});
};
// Asynchronously Load Facebook Fan Box Social Plugin
(function () {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
有些事情要记住:
- 您的自定义CSS将通过Facebook的内容呈现服务器过滤,并需要面向公众。 (也就是说,您必须将CSS文件上传/编辑到Web服务器,以便在进行更改时测试它的外观)。
- 建议在开发过程中将一个查询字符串附加(和更新)到您的CSS,因为Facebook会大量缓存您的CSS。更改后,请更新您的查询字符串变量,指示Facebook抓取样式表的新副本。
HTML / CSS / JS元素,使用您的应用程序ID创建命名空间。通过这样做,Facebook确保您的CSS不能操作标准的Facebook元素和布局。
Facebook will prefix all your HTML/CSS/JS elements with a "namespace" created using your application id. By doing this, Facebook ensures that your CSS can't manipulate standard Facebook elements and layouts.
请注意,不是所有的CSS属性和选择器是允许的, Facebook将从您的CSS中删除许多CSS3规则。
最令人沮丧的是,Facebook似乎删除允许一些供应商前缀,而不允许其他人。例如,Facebook删除Webkit供应商前缀( -webkit-border-radius
),但允许Mozilla前缀( -moz-border-radius
)。恼人!
Most frustrating of all though, is that Facebook seems to remove allow some vendor prefixes while disallowing others. For example, Facebook removes Webkit vendor prefixes (-webkit-border-radius
) but allows Mozilla prefixes (-moz-border-radius
). Annoying!
这意味着圆角,阴影和其他供应商特定的CSS可能不会出现在您的自定义Facebook粉丝框的所有浏览器。
This means that rounded corners, drop-shadows and other vendor specific CSS may not appear in all browsers for your custom Facebook Fan Box. So, try as you might, you just may not be able to get your Facebook Fan Box to look the same in all browsers.
这篇关于Facebook粉丝框停止尊重“css”属性?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!