客户聊天插件（测试版）使移动设备的按钮更小？

Question

    <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 = 'https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js';
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));
    </script>

    <script>
         window.fbAsyncInit = function() {
              FB.init({
                xfbml            : true,
                version          : 'v7.0'
              });
            };
    </script>
    <div class="fmessengerBtn">

        <div id="fb-root"></div>

        <div class="fb-customerchat" 

            attribution=setup_tool 
            page_id="1234" 
            theme_color="#A3732C" 
            greeting_dialog_display="fade" 
            greeting_dialog_delay="10" 
            logged_in_greeting="Hi! How can we help you?"
            logged_out_greeting="Hi! How can we help you?"
        </div>
    </div>

只是在移动设备上的大小有问题，有没有办法让移动设备上的 fb messenger 图标更小。 我尝试过使用样式，但只是在页面周围移动它并没有真正使它变小。

Answer 1

您是否尝试为移动屏幕尺寸添加断点。 喜欢：

@media only screen and (max-width: 480px) {
  .fmessengerBtn {
    width: ...px;
    height: ...px;

  }
}