嵌入式 php 和 mini.css 框架？

Question

开发一个网络项目

我无法使 <header> 菜单或表单适用于所有设备。使用某些嵌入式 php 代码时它们没有响应。

有人可以证实这一点并给我另一个在这种情况下工作的 css 框架吗？

到目前为止，这是我的代码：

    <head>
    <title>Apaguard</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>       
    <script src="include/highcharts/highstock.js"></script>
    <script src="include/highcharts/highcharts-more.js"></script>
    <script src="include/highcharts/exporting.js"></script>
    <link rel="stylesheet" href="./css/mini-default.css">
    <link rel="stylesheet" href="./css/apaguard.css">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<header class="sticky">
<div class="col-sm col-md-10 col-md-offset-1">

    <a href="index.php" class="logo"><img src="./icons/bee-logo.png" height="40" width="40"></a>
    <label class="drawer-toggle button" for="navigation-toggle"></label>
    <a href="index.php" role="button">Home</a>

     <?php
    // if admin access to admin menu
    if ( isset($_SESSION['admin']) && $_SESSION['admin']=='1' )
    {
        echo"<a href='apaguard_adminusers.php' role='button'>Gestion utilisateurs</a>";
        echo"<a href='apaguard_adminapaguard.php' role='button'>Gestion Apaguards</a>";
        echo"<a href='apaguard_adminruchers.php' role='button'>Gestion ruchers</a>";
        echo"<a href='apaguard_adminruches.php' role='button'>Gestion ruches</a>";
    }

    // if logged, access to user menu   
    elseif ( isset($_SESSION['proprietaire_id']) )
            {
                echo"<a href='apaguard_edituser.php' role='button'>Mon compte</a>";
                echo"<a href='change_password.php' role='button'>Password</a>";
                echo"<a href='apaguard_editruche.php' role='button'>Ruches</a>";
                echo"<a href='apaguard_editrucher.php' role='button'>Ruchers</a>";
                echo"<a href='apaguard_editapaguard.php' role='button'>Apaguards</a>";
                echo"<a href='apaguard_datas.php' role='button'>Données</a>";
            }
        else
    {
    echo"
    <a href='apaguard_graph.php' role='button'>Demo</a>
    <a href='apaguard_tech_infos.php' role='button'>Techniques</a>

    ";
    }       
    // dynamic login menu
            if ( !isset($_SESSION['proprietaire_id']) )
                {
                    echo"<a href='login.php' role='button'>Login</a>";
                }
            else 
            {
                echo "<a href='logout.php' role='button'>Logout</a>";
            }
        // if not logged, display visitor menu
    ?>
</div>
</header>
<input type="checkbox" id="navigation-toggle">
<nav class="drawer hidden-md hidden-lg">
<label class="close" for="navigation-toggle"></label>
<a href="index.php"><h4 style="margin-left: 0;">Home</h4></a>
<a href="paguard_graph.php"><h4 style="margin-left: 0;">Demo</h4></a>
<a href="apaguard_tech_infos.php"><h4 style="margin-left: 0;">Techniques</h4></a>
<a href="login.php"><h4 style="margin-left: 0;">Login</h4></a>
</nav>

谢谢，

Answer 1

我是 mini.css 的开发者，这几乎是预期的行为。如果您希望 header 链接在移动设备上隐藏，请将 .hidden-sm class 和 re-add 添加到 <nav> 元素，方法是应用 .hidden-md.hidden-lg classes。这样，header 中的链接将只显示在桌面上，而在移动设备上，它们只会显示在菜单中。这是一个示例：

    <head>
    <title>Apaguard</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>       
    <script src="include/highcharts/highstock.js"></script>
    <script src="include/highcharts/highcharts-more.js"></script>
    <script src="include/highcharts/exporting.js"></script>
    <link rel="stylesheet" href="./css/mini-default.css">
    <link rel="stylesheet" href="./css/apaguard.css">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<header class="sticky">
<div class="col-sm col-md-10 col-md-offset-1">

    <a href="index.php" class="logo"><img src="./icons/bee-logo.png" height="40" width="40"></a>
    <label class="drawer-toggle button" for="navigation-toggle"></label>
    <a href="index.php" role="button">Home</a>

     <?php
    // if admin access to admin menu
    if ( isset($_SESSION['admin']) && $_SESSION['admin']=='1' )
    {
        echo"<a href='apaguard_adminusers.php' role='button' class="hidden-sm">Gestion utilisateurs</a>";
        echo"<a href='apaguard_adminapaguard.php' role='button' class="hidden-sm">Gestion Apaguards</a>";
        echo"<a href='apaguard_adminruchers.php' role='button' class="hidden-sm">Gestion ruchers</a>";
        echo"<a href='apaguard_adminruches.php' role='button' class="hidden-sm">Gestion ruches</a>";
    }

    // if logged, access to user menu   
    elseif ( isset($_SESSION['proprietaire_id']) )
            {
                echo"<a href='apaguard_edituser.php' role='button' class="hidden-sm">Mon compte</a>";
                echo"<a href='change_password.php' role='button' class="hidden-sm">Password</a>";
                echo"<a href='apaguard_editruche.php' role='button' class="hidden-sm">Ruches</a>";
                echo"<a href='apaguard_editrucher.php' role='button' class="hidden-sm">Ruchers</a>";
                echo"<a href='apaguard_editapaguard.php' role='button' class="hidden-sm">Apaguards</a>";
                echo"<a href='apaguard_datas.php' role='button' class="hidden-sm">Données</a>";
            }
        else
    {
    echo"
    <a href='apaguard_graph.php' role='button' class="hidden-sm">Demo</a>
    <a href='apaguard_tech_infos.php' role='button' class="hidden-sm">Techniques</a>

    ";
    }       
    // dynamic login menu
            if ( !isset($_SESSION['proprietaire_id']) )
                {
                    echo"<a href='login.php' role='button' class="hidden-sm">Login</a>";
                }
            else 
            {
                echo "<a href='logout.php' role='button' class="hidden-sm">Logout</a>";
            }
        // if not logged, display visitor menu
    ?>
</div>
</header>
<input type="checkbox" id="navigation-toggle">
<nav class="drawer hidden-md hidden-lg">
<label class="close" for="navigation-toggle"></label>
<a href="index.php"><h4 style="margin-left: 0;">Home</h4></a>
<a href="paguard_graph.php"><h4 style="margin-left: 0;">Demo</h4></a>
<a href="apaguard_tech_infos.php"><h4 style="margin-left: 0;">Techniques</h4></a>
<a href="login.php"><h4 style="margin-left: 0;">Login</h4></a>
<?php
    // if admin access to admin menu
    if ( isset($_SESSION['admin']) && $_SESSION['admin']=='1' )
    {
        echo"<a href='apaguard_adminusers.php' role='button' class="hidden-md hidden-lg">Gestion utilisateurs</a>";
        echo"<a href='apaguard_adminapaguard.php' role='button' class="hidden-md hidden-lg">Gestion Apaguards</a>";
        echo"<a href='apaguard_adminruchers.php' role='button' class="hidden-md hidden-lg">Gestion ruchers</a>";
        echo"<a href='apaguard_adminruches.php' role='button' class="hidden-md hidden-lg">Gestion ruches</a>";
    }

    // if logged, access to user menu   
    elseif ( isset($_SESSION['proprietaire_id']) )
            {
                echo"<a href='apaguard_edituser.php' role='button' class="hidden-md hidden-lg">Mon compte</a>";
                echo"<a href='change_password.php' role='button' class="hidden-md hidden-lg">Password</a>";
                echo"<a href='apaguard_editruche.php' role='button' class="hidden-md hidden-lg">Ruches</a>";
                echo"<a href='apaguard_editrucher.php' role='button' class="hidden-md hidden-lg">Ruchers</a>";
                echo"<a href='apaguard_editapaguard.php' role='button' class="hidden-md hidden-lg">Apaguards</a>";
                echo"<a href='apaguard_datas.php' role='button' class="hidden-md hidden-lg">Données</a>";
            }
        else
    {
    echo"
    <a href='apaguard_graph.php' role='button' class="hidden-md hidden-lg">Demo</a>
    <a href='apaguard_tech_infos.php' role='button' class="hidden-md hidden-lg">Techniques</a>

    ";
    }       
    // dynamic login menu
            if ( !isset($_SESSION['proprietaire_id']) )
                {
                    echo"<a href='login.php' role='button' class="hidden-md hidden-lg">Login</a>";
                }
            else 
            {
                echo "<a href='logout.php' role='button' class="hidden-md hidden-lg">Logout</a>";
            }
        // if not logged, display visitor menu
    ?>
</nav>

嵌入式 php 和 mini.css 框架？

Embedded php and mini.css framework?

css

php

mini.css