Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/437.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 贝宝登录按钮字体大小_Javascript_Html_Css_Paypal_Opencart2.x - Fatal编程技术网

Javascript 贝宝登录按钮字体大小

Javascript 贝宝登录按钮字体大小,javascript,html,css,paypal,opencart2.x,Javascript,Html,Css,Paypal,Opencart2.x,我想更改PayPal登录按钮的字体大小,因为我注意到这足以使整个按钮变小,但它似乎会在头部底部生成CSS,这将覆盖我的。这个按钮是由一个脚本生成的(我想也是添加CSS的脚本) paypal.use(['login'],函数(login){ login.render({ “appid”:“, “authend”:“, “范围”:“, “containerid”:“pp\u login\u container”, “区域设置”:“, “主题”:“, “returnurl”:” }); });

我想更改PayPal登录按钮的字体大小,因为我注意到这足以使整个按钮变小,但它似乎会在头部底部生成CSS,这将覆盖我的。这个按钮是由一个脚本生成的(我想也是添加CSS的脚本)

  • paypal.use(['login'],函数(login){ login.render({ “appid”:“, “authend”:“, “范围”:“, “containerid”:“pp\u login\u container”, “区域设置”:“, “主题”:“, “returnurl”:” }); });
  • 以下是输出:

        <span id="pp_login_container">
        <button id="LIwPP85447951" class="LIwPP PPBlue">
          <svg class="PPTM" xmlns="http://www.w3.org/2000/svg" version="1.1" width="16px" height="17px" viewBox="0 0 16 17">
             <path class="PPTM-btm" fill="#0079c1" d="m15.603 3.917c-0.264-0.505-0.651-0.917-1.155-1.231-0.025-0.016-0.055-0.029-0.081-0.044 0.004 0.007 0.009 0.014 0.013 0.021 0.265 0.506 0.396 1.135 0.396 1.891 0 1.715-0.712 3.097-2.138 4.148-1.425 1.052-3.418 1.574-5.979 1.574h-0.597c-0.45 0-0.9 0.359-1.001 0.798l-0.719 3.106c-0.101 0.438-0.552 0.797-1.002 0.797h-1.404l-0.105 0.457c-0.101 0.438 0.184 0.798 0.633 0.798h2.1c0.45 0 0.9-0.359 1.001-0.798l0.718-3.106c0.101-0.438 0.551-0.797 1.002-0.797h0.597c2.562 0 4.554-0.522 5.979-1.574 1.426-1.052 2.139-2.434 2.139-4.149 0-0.755-0.132-1.385-0.397-1.891z"></path>
             <path class="PPTM-top" fill="#00457c" d="m9.27 6.283c-0.63 0.46-1.511 0.691-2.641 0.691h-0.521c-0.45 0-0.736-0.359-0.635-0.797l0.628-2.72c0.101-0.438 0.552-0.797 1.002-0.797h0.686c0.802 0 1.408 0.136 1.814 0.409 0.409 0.268 0.611 0.683 0.611 1.244 0 0.852-0.315 1.507-0.944 1.97zm3.369-5.42c-0.913-0.566-2.16-0.863-4.288-0.863h-4.372c-0.449 0-0.9 0.359-1.001 0.797l-2.957 12.813c-0.101 0.439 0.185 0.798 0.634 0.798h2.099c0.45 0 0.901-0.358 1.003-0.797l0.717-3.105c0.101-0.438 0.552-0.797 1.001-0.797h0.598c2.562 0 4.554-0.524 5.979-1.575 1.427-1.051 2.139-2.433 2.139-4.148-0.001-1.365-0.439-2.425-1.552-3.123z"></path>
          </svg>
          <b>Log In with PayPal</b>
        </button>
        </span>
    
    
    使用贝宝登录
    
    更改的CSS类似于(在HTML中位于头部的末尾):

    /*!通过github.com/premasagar/cleanslate重置*/
    ....
    LIwPP先生{
    ...
    字体大小:16px!重要;
    ...
    


    我试图在OpenCart2中将其插入页眉。tpl我不太明白您的要求,但您可以尝试在更改字体大小的同时更改按钮的实际宽度和高度:

       .button-small-text {
           height: 30px;
           width: 75px;
           font-size: 10px;
       }
    

    我希望这会有所帮助!

    可能不是最好的解决方案,但我实际上通过将此脚本添加到header中来修复它。tpl:

          <script>
          $(window).bind("load", function() {
            // code here
            var css = '.LIwPP { font-size: 14px !important;}'
                head = document.head || document.getElementsByTagName('head')[0],
                style = document.createElement('style');
    
            style.type = 'text/css';
            if (style.styleSheet){
              style.styleSheet.cssText = css;
            } else {
              style.appendChild(document.createTextNode(css));
            }
    
            head.appendChild(style);
          });
        </script>
    
    
    $(窗口).bind(“加载”,函数(){
    //代码在这里
    var css='.LIwPP{font size:14px!important;}'
    head=document.head | | document.getElementsByTagName('head')[0],
    style=document.createElement('style');
    style.type='text/css';
    if(style.styleSheet){
    style.styleSheet.cssText=css;
    }否则{
    appendChild(document.createTextNode(css));
    }
    头。附属物(样式);
    });
    
    好的,我通过添加以下内容找到了一个简单而优雅的解决方案:

    <style scoped> .LIwPP { font-size: 13px !important;} </style>
    
    .LIwPP{字体大小:13px!重要;}
    
    最终解决办法:

            <li><span id="pp_login_container"></span>
              <style scoped> .LIwPP { font-size: 13px !important;} </style>
              <script src="https://www.paypalobjects.com/js/external/api.js"></script>
              <script>paypal.use(['login'], function(login) {
                        login.render ({
                          'appid': '<?php echo $client_id; ?>',
                          'authend': '<?php echo $sandbox; ?>',
                          'scopes': '<?php echo $scopes; ?>',
                          'containerid': 'pp_login_container',
                          'locale': '<?php echo $locale; ?>',
                          'theme': '<?php echo $button_colour; ?>',
                          'returnurl': '<?php echo $return_url; ?>'
                        });
                      });
              </script>
            </span>
        </li>
    
  • .LIwPP{字体大小:13px!重要;} paypal.use(['login'],函数(login){ login.render({ “appid”:“, “authend”:“, “范围”:“, “containerid”:“pp\u login\u container”, “区域设置”:“, “主题”:“, “returnurl”:” }); });
  • <style scoped> .LIwPP { font-size: 13px !important;} </style>
    
            <li><span id="pp_login_container"></span>
              <style scoped> .LIwPP { font-size: 13px !important;} </style>
              <script src="https://www.paypalobjects.com/js/external/api.js"></script>
              <script>paypal.use(['login'], function(login) {
                        login.render ({
                          'appid': '<?php echo $client_id; ?>',
                          'authend': '<?php echo $sandbox; ?>',
                          'scopes': '<?php echo $scopes; ?>',
                          'containerid': 'pp_login_container',
                          'locale': '<?php echo $locale; ?>',
                          'theme': '<?php echo $button_colour; ?>',
                          'returnurl': '<?php echo $return_url; ?>'
                        });
                      });
              </script>
            </span>
        </li>