zoukankan      html  css  js  c++  java
  • 10.14_魅族手机音乐播放无故暂停,MetroUICss-tile中的字如何居中

    (1)魅族手机,播放音乐,无故暂停。不管是自带的音乐播放程序,还是下载的其他音乐播放器都是如此。
    而且,手机上有个Google服务耗电量非常高,会经常弹出登陆Google账号的弹出项。

    (2)Metro UI CSS tile中的字如何居中,看官方是示例是给了一个图片!而且holder.js要在支持html5的浏览器下才能有效。
    我是否可以使用SVG呢?!

    (3)tile小例子:

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
    
        <link href="css/metro-bootstrap.css" rel="stylesheet">
        <link href="css/metro-bootstrap-responsive.css" rel="stylesheet">
        <link href="css/iconFont.css" rel="stylesheet">
        <link href="css/docs.css" rel="stylesheet">
        <link href="js/prettify/prettify.css" rel="stylesheet">
    
        <!-- Load JavaScript Libraries -->
        <script src="js/jquery/jquery.min.js"></script>
        <script src="js/jquery/jquery.widget.min.js"></script>
        <script src="js/jquery/jquery.mousewheel.js"></script>
        <script src="js/prettify/prettify.js"></script>
    
        <!-- Metro UI CSS JavaScript plugins -->
        <script src="js/load-metro.js"></script>
        
        <title>Metro UI Demo: my_demo_001</title>
    </head>
    <body class="metro">
        <div class="example">
            <div class="tile"></div>
            <div class="tile double"></div>
            <div class="tile selected"></div>
        </div>
            
        <div class="example">
            <div class="tile half block"></div>
            <div class="tile block"></div>
            <div class="tile double block"></div>
            <div class="tile triple block"></div>
            <div class="tile quadro block"></div>
        </div>
        
        <div class="example">
            
        </div>
        
        <div class="example">
            <div class="tile double-vertical"></div>
            <div class="tile triple-vertical"></div>
            <div class="tile quadro-vertical"></div>
        </div>
        
        <div class="example">
            <div class="tile half block double-vertical"></div>
            <div class="tile double-vertical block"></div>
            <div class="tile double double-vertical block"></div>
            <div class="tile triple double-vertical block"></div>
            <div class="tile quadro double-vertical block"></div>
        </div>
        
        <div class="example">
            <div class="tile bg-cyan">
                <div class="brand">
                    <div class="badge">99</div>
                </div>
            </div>
             
            <div class="tile bg-cyan">
                <div class="brand">
                    <div class="badge activity"></div>
                </div>
            </div>
        </div>
        
        <div class="example">
            <div class="tile bg-cyan">
                <div class="brand">
                    <div class="badge"><i class="icon-rocket"></i></div>
                </div>
            </div>
            <div class="tile bg-darkRed">
                <div class="brand">
                    <div class="badge bg-red"><i class="icon-broadcast"></i></div>
                </div>
            </div>
        </div>
        
        <div class="example">
            <div class="tile bg-darkPink">
                <div class="tile-content icon">
                    <i class="icon-cart-2"></i>
                </div>
                <div class="tile-status">
                    <span class="name">Store</span>
                </div>
            </div>
             
            <div class="tile double bg-amber">
                <div class="tile-content icon">
                    <i class="icon-play-alt"></i>
                </div>
                <div class="brand bg-black">
                    <span class="label fg-white">Player</span>
                    <div class="badge bg-darkRed paused"></div>
                </div>
            </div>
             
            <div class="tile">
                <div class="tile-content image">
                    <img src="images/author.jpg">
                </div>
                <div class="brand">
                    <span class="label fg-white">Images</span>
                    <span class="badge bg-orange">12</span>
                </div>
            </div>
             
            <div class="tile double">
                <div class="tile-content image">
                    <img src="images/4.jpg">
                </div>
                <div class="brand bg-dark opacity">
                    <span class="text">
                        This is a desert eagle. He is very hungry and angry bird.
                    </span>
                </div>
            </div>
        </div>
        
        <div class="example">
            <div class="tile bg-cyan">
                <div class="tile-content icon">
                    <i class="icon-rocket"></i>
                </div>
            </div>
             
            <div class="tile bg-green">
                <div class="tile-content icon">
                    <img src="images/excel2013icon.png">
                </div>
            </div>
             
            <div class="tile double" data-click="transform">
                <div class="tile-content image">
                    <img src="images/1.jpg">
                </div>
            </div>
             
            <div class="tile double">
                <div class="tile-content image-set">
                    <img src="images/1.jpg">
                    <img src="images/2.jpg">
                    <img src="images/3.jpg">
                    <img src="images/4.jpg">
                    <img src="images/5.jpg">
                </div>
            </div>
        </div>
        
        <div class="example">
            <div class="tile bg-cyan">
                <div class="tile-content icon">
                    <i class="icon-rocket"></i>
                </div>
            </div>
            <div class="tile bg-cyan">
                <div class="tile-content text-center">
                    <h3>Welcome</h3>
                </div>
            </div>
        </div>
        
        <div class="example">
            <p class="text-left">Left aligned text.<p>
            <p class="text-center">Left aligned text.<p>
            <p class="text-right">Left aligned text.<p>
            <p class="text-justify">Justify aligned text.<p>
        </div>
        
        <div class="example">
            <div class="tile triple block">
            <img src="data:image/png;base64,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" data-src="js/holder/holder.js/380x120" alt="380x120" style=" 380px; height: 120px;">
            </div>
        </div>
        
        <div class="example">
            <div class="tile triple block">
            <img src="" data-src="js/holder/holder.js/380x120" alt="380x120" style=" 380px; height: 120px;">
            </div>
        </div>
        
        <div class="example">
            
        </div>
        
        <div class="example">
            
        </div>
        
        <div class="example">
            
        </div>
    </body>
    </html>
    View Code

    (4)

  • 相关阅读:
    hbase中double类型数据做累加
    kafka的分区模式?
    hive 定时加载分区
    在shell 中字符串,文件,数字的比较
    idea中maven依赖不能下载的解决办法
    Required field 'client_protocol' is unset! Struct:TOpenSessionReq(client_protocol:null, configuration:{use:database=default}) (state=08S01,code=0)
    SparkSQL ThriftServer服务的使用和程序中JDBC的连接
    hbase计数器
    hbase常用命令
    object not serializable (class: org.apache.kafka.clients.consumer.ConsumerRecord)
  • 原文地址:https://www.cnblogs.com/juedui0769/p/4025476.html
Copyright © 2011-2022 走看看