javascript - css 样式化 facebook 登录按钮,最佳实践

标签 javascript css facebook iframe

我正在使用 Facebook Login Button在我的网络应用程序中进行单点登录(下面的代码)。但是我不知道如何用css 控制按钮的样式。我看到 Facebook 插件在我的页面中插入了一个 iframe...

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/fr_CA/all.js#xfbml=1&appId=myid";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-login-button" data-max-rows="1" data-size="large" data-show-faces="false" data-auto-logout-link="true"></div>

但这并没有呈现:

.fb-login-button {
    width: 300px !important;
    font-size: 16px !important;
    line-height: 30px !important;
    padding: 3px 8px !important;
}

JSfiddle:http://jsfiddle.net/4SqGn/

请问你知道如何控制按钮样式吗?

最佳答案

正如您在 fb 文档中看到的,div.fb-login-button 被您从外部加载的脚本替换为 iframe。要自己设置此按钮的样式,您只需创建一个根据您的意愿设置样式的按钮并自行触发登录机制。

有关更多信息,请阅读 here .

关于javascript - css 样式化 facebook 登录按钮,最佳实践,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22252144/

相关文章:

javascript - 在谷歌地图中画一条垂直于两点的线

javascript - 哪种语法对于 React 来说更典型(如果有的话)(版本 16)?

javascript - 从链接点击中捕获 ID 并将其传递到弹出表单中

Javascript 对象上下文

html - 文本不溢出时溢出滚动隐藏滚动

ios - 几天后PFUser currentUser返回null

ios - Facebook 请求通知未显示在 iOS 移动版 safari 中,而是显示在 native facebook 应用程序中

jquery - 使用 javascript 和 css3 转换以动态高度移动 div

javascript - 我怎样才能用 Jekyll 做一个预加载页面?

Facebook API : Get all profile pictures