css - 样式 Facebook 分享按钮链接

标签 css facebook button hyperlink share

我想知道是否可以设置共享按钮链接的样式。这是我想要访问的链接(嵌套在 Facebook 的 iframe 中)。

<a class="pluginShareButtonLink" href="/sharer.php?
app_id=XXXXXXXXXXXXXXX&amp;sdk=joey&amp;u=http%3A%2F%2FXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX&amp;
display=popup" target="_blank" id="u_0_1"><div class="blueButton blue"><div 
class="pluginButton"><div><div class="pluginButtonContainer"><div 
class="pluginButtonImage"><button type="submit"><i class="pluginButtonIcon img sp_25oo7a 
sx_e52148"></i></button></div><span class="pluginButtonLabel">Share</span></div></div>
</div></div></a>

我尝试按如下方式更改类 pluginShareButtonLink 的样式:

.pluginShareButtonLink:hover{
   text-decoration: none;
}

而且它不起作用。我也尝试过使用 jQuery 更改样式,但这也没有用。能以某种方式完成吗?

谢谢

最佳答案

   **You can style the button with this css and you can change the background color to any color you want.**

    solution 1 (without gradient background color)
    .pluginButtonContainer button{ 
    padding: 10px;
    width: 70px;
    height: 35px;
    background: rgb(255, 70, 70);
    border: 0px!important;
    border-radius: 2px;
    }

    solution 2 (with gradient background color)
    .pluginButtonContainer button{ 
    padding: 10px;
    width: 70px;
    height: 35px;
    background: #ff3a3a; /* Old browsers */
    background: -moz-linear-gradient(top,  #ff3a3a 0%, #ff3a3a 49%, #ff402b 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff3a3a), color-stop(49%,#ff3a3a), color-stop(100%,#ff402b)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #ff3a3a 0%,#ff3a3a 49%,#ff402b 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #ff3a3a 0%,#ff3a3a 49%,#ff402b 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #ff3a3a 0%,#ff3a3a 49%,#ff402b 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #ff3a3a 0%,#ff3a3a 49%,#ff402b 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3a3a', endColorstr='#ff402b',GradientType=0 ); /* IE6-9 */
    border: 0px!important;
    border-radius: 2px;
    }

关于css - 样式 Facebook 分享按钮链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20575590/

相关文章:

android - 如何在 Android 中设置按钮内可绘制矢量的大小?

ios - Swift:后退按钮显示在 Storyboard 中而不是模拟器中

html - CSS 内容属性 : is it possible to insert HTML instead of Text?

html - 基本 CSS 不响应/移动设备友好

javascript - 使用 js 或 css 或两者使 slider 自动滚动图像

facebook - 如何在 React Native Facebook SDK 中使用标准事件

iphone - ios bundle id 问题以启动第一个 facebook 应用程序

c# - 如何从 Windows 8 应用程序将图像和文本共享到 Facebook?

asp.net - IE6 上的 ASP 按钮问题

html - Firefox 4 - 意外分层?