如何将CSS应用于Facebook登录按钮

时间:2016-10-31 07:00:31

标签: php html css facebook twitter-bootstrap

想知道如何使用CSS将facebook登录按钮按下几个像素,以便与导航栏上的其他内容对齐。

enter image description here

以下是包含登录按钮的导航栏的代码。

    <div class="collapse navbar-collapse">
        <ul class="nav navbar-nav navbar-right">
            <li class="active"><a href="index.php">Home</a></li>
            <li><a href="404.html">About Us</a></li>
            <li><a href="blog.php">Blog</a></li>
            <li><a href="javascript:window.open('contact.php', 'Contact Us', 'width=500,height=500');">Contact</a></li>
            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">More <i class="icon-angle-down"></i></a>
                <ul class="dropdown-menu">
                    <li><a href="privacy.php">Privacy Policy</a></li>
                    <li><a href="terms.php">Terms of Use</a></li>
                    <li class="divider"></li>
                    <li><?php if (isset($_SESSION['name'])) { echo $_SESSION['name']; } ?></li>
                </ul>
            <li><?php if (isset($_SESSION['name'])) { } else {  ?><div class="fb-login-button" data-scope="public_profile,email" onlogin="checkLoginState();"></div></li><?php } ?>
            </li>
        </ul>
    </div>
</div>

3 个答案:

答案 0 :(得分:1)

保证金提供给Like按钮的 li

示例: - margin-top:9px;

答案 1 :(得分:0)

您好,您可以使用此CSS代码

   .nav .fb-login-button{ 
     margin-top:4px; /* or whater ever you want for  margin top */
    }

也可以使用此

   .nav .fb-login-button{ 
    vertical-align: middle;
    }

我希望这有帮助。

答案 2 :(得分:0)

你可以直接定位facebook图标和

的css规则
position:relative;
top:the position you want