6

私はこれが初めてで、メニューアイコンを非表示にする方法を教えてください。プロンプトが表示されずに自動的に追加されます。小さな画面にのみ表示したい. 下手な英語でごめんなさい。

ありがとうございました。

4

6 に答える 6

5

問題を解決するには、Media Query に頼らなければなりませんでした。

@media only screen and (min-width:851px){ .mdl-layout__drawer-button { display: none; } }

@dshun と @garbee の助けに感謝します。

于 2015-07-14T01:27:28.490 に答える
3

これを実現する別の方法は、次のようなさまざまな画面サイズ クラスを追加することです。

mdl-layout -- 小さい画面のみ
. 次に例を示します。

<div class="mdl-layout__drawer mdl-layout--small-screen-only">
    <span class="mdl-layout-title">Drawer Title</span>

    <nav class="mdl-navigation">
        <a class="mdl-navigation__link" href="">Link 1</a>
        <a class="mdl-navigation__link" href="">Link 2</a>
        <a class="mdl-navigation__link" href="">Link 3</a>
    </nav>
</div>

そのスニペットがうまく機能しない場合は、お詫び申し上げます。ここ StackOverflow で同様の質問に気付きました。解決策はより適切かもしれません: How can I hide drawer on large screen and show just on small screen.?

于 2015-07-26T07:14:30.947 に答える
1

デスクトップに固定ドロワーを取得するためにmdl-layout--fixed-drawer使用するのと同じ要素で を使用できます。これは、ボタンを削除して表示し、アクセスのために常に開いたままにする必要があります。mdl-js-layout

于 2015-07-13T00:07:02.973 に答える
0

大画面で div を非表示にするには、このクラスを追加してください 

hide-on-large-only
于 2016-09-13T15:30:06.837 に答える
0

私が見つけた効果的な解決策は次のとおりです。

<style>
       @media screen and (min-width: 992px) {
        .mdl-layout__drawer-button {
            /* Hide the Hamburger button but will leave an unused space */
            display: none;
        }
        .mdl-layout__header-row {
            /* so important to make sure the Hamburger button didn't leave an unused space */
            padding-left: 24px !important; 
        }
    }
</style>
于 2016-02-17T01:15:02.740 に答える