Bokeh CSSの例が必要

私は、gapminderデモから変更したフラスコのcssファイルでbokehウィジェットのスタイルを設定しようとしていました。特に、私は現在、多くの進歩なしにドロップダウン、タブ、およびスライダーウィジェットのスタイルをとろうとしています。私はgapminder CSSの例を使ってツールチップのスタイルを設定することができましたが、他の例があるかどうか、さらにはボケスタイルオプションのリスト（つまり.bk -...スタイル）があるかどうかを最終的に知りたいと思います。助けを事前にBokeh CSSの例が必要

<html> 
    <head> 
    <link 
     href="https://cdn.pydata.org/bokeh/release/bokeh-0.12.1.min.css" 
     rel="stylesheet" type="text/css"> 
    <link 
     href="https://cdn.pydata.org/bokeh/release/bokeh-widgets-0.12.1.min.css" 
     rel="stylesheet" type="text/css"> 
    <link 
     rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles/gapminder.css') }}"> 
    <script src="https://cdn.pydata.org/bokeh/release/bokeh-0.12.1.min.js"></script> 
    <script src="https://cdn.pydata.org/bokeh/release/bokeh-widgets-0.12.1.min.js"></script> 
    {{ script | safe }} 
    </head> 
    <body> 
    <div class=page> 
     {{ div | safe }} 
    </div> 
    </body> 
</html>

ありがとう：私はまだフラスコ内の私の現在のindex.htmlファイルのように見えることで、ウェブDEVを学んでいるように私は、これが正常に動作するかどうかはわかりません。

出典

2016-08-05 PythonUzer

あなたがまだレスポンスを探しているのかどうかはわかりませんが、ここで私がこの問題を解決するために行っていることがわかります。

<style>  
     {% include 'styles.css' %} 
     .bk-root .bk-toolbar-right .bk-button-bar-list .bk-toolbar-button:hover .bk-tip { 
     color: #5DADE2; 
     } 
     .bk-root .bk-slider-parent input[type="text"]{ 
     color: #FDFEFE; 
     } 
    </style>

それは私が最初にボケプロットを生成したという点で、非常にマニュアルです、私は単にその後、変更したいウィジェットの要素はindex.htmlファイルにこれを追加検査。編集可能な属性を確認したい場合は、属性を調べれば表示されます。

この例では、ツール名の上にマウスを置くと、スライダの値の色も変更されています。

私も含まれていた別々の.cssファイルを持っていたので、そこにすべて移動することができました。

出典

2017-02-20 12:23:07 Anthonydouc

答えて

関連する問題