Style facebook 'like' button

问题

I'm struggling with this for a while now and without any success. Setting the style with jquery doesn't work, the same with after the facebook iframe. Is there a way to perform this task ?

<iframe src="http://www.facebook.com/plugins/like.php?&href=http%3A%2F%2Fwww.example.com&amp;layout=standard&amp;show_faces=false&amp;width=400&amp;action=like&amp;font=tahoma&amp;colorscheme=light&amp;height=23" 
scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:400px; height:23px;" allowTransparency="false"></iframe>          

<style>
    .connect_widget_not_connected_text, .connect_widget_connected_text {
        color:white;
    }
    .connect_widget_connected_text a {
        color:#3B5998;
    }
</style>

<script type="text/javascript">
    $(function() { 
        $('.connect_widget_not_connected_text').css('color', 'white');
    });
</script>

回答1:

I'm sure that you can figure out a CSS trick to style the button, but you are violating facebook Terms of Service by doing so. You are REQUIRED to display the like button in one of their official styles.

回答2:

Alternatively, use a share link like

https://www.facebook.com/sharer.php?u=url_to_share&t=title_of_content

See https://developers.facebook.com/docs/share/ for details.

回答3:

I don't think you can style an iframe content from a parent page in this fashion. You can try adding an id to the iframe and attempting to call it that way but even then I'm not sure it will work.

回答4:

http://www.daddydesign.com/wordpress/how-to-customize-your-facebook-fan-box/

Take a look a this page, maybe can guide you on this

回答5:

Looks like you are using an iframe implementation and there is probably no way you use use this implementation and style it as you want. However you might want to display other ways of implementating Facebook Like button like using XFBML

来源：https://stackoverflow.com/questions/3833936/style-facebook-like-button

标签

css

facebook

coding-style