Navbar图标没有显示在一些browsres

Question

我正在制作自适应网页。我正在使用自定义导航栏，如下所示;

＆＃13;

＆＃13;

      function myFunction() {
        var x = document.getElementById("myTopnav");
        if (x.className === "topnav") {
          x.className += " responsive";
        } else {
          x.className = "topnav";
        }
      }

＆＃13;

/* Remove margins and padding from the list, and add a black background color */

ul.topnav {
  list-style-type: none;
  margin: 10;
  padding: 10;
  overflow: hidden;
}
/* Float the list items side by side */

ul.topnav li {
  float: left;
  margin: 10;
  padding: 10;
}
/* Style the links inside the list items */

ul.topnav li a {
  display: inline-block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  transition: 0.3s;
  font-size: 40px;
}
/* Change background color of links on hover */

/* ul.topnav li a:hover {background-color: #fff;}
    
    /* Hide the list item that contains the link that should open and close the topnav on small screens */

ul.topnav li.icon {
  display: none;
}
/* When the screen is less than 680 pixels wide, hide all list items, except for the first one ("Home"). Show the list item that contains the link to open and close the topnav (li.icon) */

@media screen and (max-width: 680px) {
  ul.topnav li:not(:first-child) {
    display: none;
  }
  ul.topnav li.icon {
    float: right;
    display: inline-block;
  }
}
/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens */

@media screen and (max-width: 680px) {
  ul.topnav.responsive {
    position: relative;
  }
  ul.topnav.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  ul.topnav.responsive li {
    float: none;
    display: inline;
  }
  ul.topnav.responsive li a {
    display: block;
    text-align: left;
  }

＆＃13;

<ul class="topnav" id="myTopnav">
  <li>
    <a href="#news">
      <img class="img-responsive" width="60px" src="imagenes/botones/logo_hera.png" />
    </a>
  </li>
  <li>
    <a href="#news">
      <img class="img-responsive" width="180px" src="imagenes/botones/doctores_boton.png" />
    </a>
  </li>
  <li>
    <a href="#news">
      <img class="img-responsive" width="180px" src="imagenes/botones/hospitales_boton.png" />
    </a>
  </li>
  <li>
    <a href="#news">
      <img class="img-responsive" width="180px" src="imagenes/botones/farmacias_boton.png" />
    </a>
  </li>
  <li>
    <a href="#news">
      <img class="img-responsive" width="180px" src="imagenes/botones/laboratorios_boton.png" />
    </a>
  </li>

  <li class="icon">
    <a href="javascript:void(0);" onclick="myFunction()">&#9776;</a>
  </li>
</ul>

＆＃13;

＆＃13;

＆＃13;

在我的电脑和iPhone上，我可以看到导航栏图标：

iPhone屏幕截图：

但在我的Android设备上，它看起来如下：

没有可见的导航栏图标。

我的代码出了什么问题？

编辑：

我知道切换图标在那里，但不可见。它在触摸时有效

Answer 1

请在样式表添加

中使用此代码

@media screen and (max-width: 680px) {
ul.topnav li.icon {
display: block;
}
}

Answer 2

由于您已将float:rigt提供给图标，因此它超出了android中的设备宽度。添加保证金权利为我解决了问题。

@media screen and (max-width: 680px)
ul.topnav li.icon {
    float: right;
    margin-right: 10%;
    display: inline-block !important;
}

我在ul.topnav中发现的另一个无效属性是边距，填充值只是计划数字。请使用以下代码段

ul.topnav {
    list-style-type: none;
    margin: 0;
    padding: 10px;
    width: 100%;
    display: inline-block;
}

Answer 3

试试这个 -

ERROR: line 1:70: unexpected token: FROM
Nov 30, 2016 1:35:35 PM org.hibernate.hql.internal.ast.ErrorCounter reportError
ERROR: line 1:70: unexpected token: FROM
line 1:70: unexpected token: FROM
    at org.hibernate.hql.internal.antlr.HqlBaseParser.primaryExpression(HqlBaseParser.java:996)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.atom(HqlBaseParser.java:3609)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.unaryExpression(HqlBaseParser.java:3387)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.multiplyExpression(HqlBaseParser.java:3259)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.additiveExpression(HqlBaseParser.java:2964)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.concatenation(HqlBaseParser.java:597)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.relationalExpression(HqlBaseParser.java:2730)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.equalityExpression(HqlBaseParser.java:2591)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.negatedExpression(HqlBaseParser.java:2555)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.logicalAndExpression(HqlBaseParser.java:2471)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.logicalOrExpression(HqlBaseParser.java:2436)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.expression(HqlBaseParser.java:2146)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.aliasedExpression(HqlBaseParser.java:2389)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.selectedPropertiesList(HqlBaseParser.java:1422)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.selectClause(HqlBaseParser.java:1325)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.selectFrom(HqlBaseParser.java:1062)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.queryRule(HqlBaseParser.java:731)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.selectStatement(HqlBaseParser.java:323)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.insertStatement(HqlBaseParser.java:355)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.statement(HqlBaseParser.java:192)
    at org.hibernate.hql.internal.ast.QueryTranslatorImpl.parse(QueryTranslatorImpl.java:295)
    at org.hibernate.hql.internal.ast.QueryTranslatorImpl.doCompile(QueryTranslatorImpl.java:203)
    at org.hibernate.hql.internal.ast.QueryTranslatorImpl.compile(QueryTranslatorImpl.java:158)
    at org.hibernate.engine.query.spi.HQLQueryPlan.<init>(HQLQueryPlan.java:126)
    at org.hibernate.engine.query.spi.HQLQueryPlan.<init>(HQLQueryPlan.java:88)
    at org.hibernate.engine.query.spi.QueryPlanCache.getHQLQueryPlan(QueryPlanCache.java:167)
    at org.hibernate.internal.AbstractSessionImpl.getHQLQueryPlan(AbstractSessionImpl.java:301)
    at org.hibernate.internal.AbstractSessionImpl.createQuery(AbstractSessionImpl.java:236)
    at org.hibernate.internal.SessionImpl.createQuery(SessionImpl.java:1800)
    at insert.hql.InsertTest.main(InsertTest.java:20)

Nov 30, 2016 1:35:35 PM org.hibernate.hql.internal.ast.ErrorCounter reportError
ERROR: line 1:97: unexpected token: o
Nov 30, 2016 1:35:35 PM org.hibernate.hql.internal.ast.ErrorCounter reportError
ERROR: line 1:97: unexpected token: o
line 1:97: unexpected token: o
    at org.hibernate.hql.internal.antlr.HqlBaseParser.aliasedExpression(HqlBaseParser.java:2416)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.selectedPropertiesList(HqlBaseParser.java:1422)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.selectClause(HqlBaseParser.java:1325)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.selectFrom(HqlBaseParser.java:1062)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.queryRule(HqlBaseParser.java:731)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.selectStatement(HqlBaseParser.java:323)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.insertStatement(HqlBaseParser.java:355)
    at org.hibernate.hql.internal.antlr.HqlBaseParser.statement(HqlBaseParser.java:192)
    at org.hibernate.hql.internal.ast.QueryTranslatorImpl.parse(QueryTranslatorImpl.java:295)
    at org.hibernate.hql.internal.ast.QueryTranslatorImpl.doCompile(QueryTranslatorImpl.java:203)
    at org.hibernate.hql.internal.ast.QueryTranslatorImpl.compile(QueryTranslatorImpl.java:158)
    at org.hibernate.engine.query.spi.HQLQueryPlan.<init>(HQLQueryPlan.java:126)
    at org.hibernate.engine.query.spi.HQLQueryPlan.<init>(HQLQueryPlan.java:88)
    at org.hibernate.engine.query.spi.QueryPlanCache.getHQLQueryPlan(QueryPlanCache.java:167)
    at org.hibernate.internal.AbstractSessionImpl.getHQLQueryPlan(AbstractSessionImpl.java:301)
    at org.hibernate.internal.AbstractSessionImpl.createQuery(AbstractSessionImpl.java:236)
    at org.hibernate.internal.SessionImpl.createQuery(SessionImpl.java:1800)
    at insert.hql.InsertTest.main(InsertTest.java:20)

Exception in thread "main" org.hibernate.hql.internal.ast.QuerySyntaxException: unexpected token: FROM near line 1, column 70 [INSERT INTO NewStudent(id, name, email) SELECT o.id, o.name, o.email FROM insert.hql.OldStudent o]
    at org.hibernate.hql.internal.ast.QuerySyntaxException.convert(QuerySyntaxException.java:91)
    at org.hibernate.hql.internal.ast.ErrorCounter.throwQueryException(ErrorCounter.java:109)
    at org.hibernate.hql.internal.ast.QueryTranslatorImpl.parse(QueryTranslatorImpl.java:304)
    at org.hibernate.hql.internal.ast.QueryTranslatorImpl.doCompile(QueryTranslatorImpl.java:203)
    at org.hibernate.hql.internal.ast.QueryTranslatorImpl.compile(QueryTranslatorImpl.java:158)
    at org.hibernate.engine.query.spi.HQLQueryPlan.<init>(HQLQueryPlan.java:126)
    at org.hibernate.engine.query.spi.HQLQueryPlan.<init>(HQLQueryPlan.java:88)
    at org.hibernate.engine.query.spi.QueryPlanCache.getHQLQueryPlan(QueryPlanCache.java:167)
    at org.hibernate.internal.AbstractSessionImpl.getHQLQueryPlan(AbstractSessionImpl.java:301)
    at org.hibernate.internal.AbstractSessionImpl.createQuery(AbstractSessionImpl.java:236)
    at org.hibernate.internal.SessionImpl.createQuery(SessionImpl.java:1800)
    at insert.hql.InsertTest.main(InsertTest.java:20)

https://jsfiddle.net/chris2001/Lc57jw4c/1/

不确定它是否是您想要的。