Question

所以，在我们的grails项目中，我们使用的是twitter-bootstrap:3.1.1插件。到目前为止还没有遇到任何重大问题。

在我们的layouts/main.gsp中，我们添加了一个很棒的导航栏，随处可见。唯一的问题是我们不希望打印页面时打印。在2.3.2中，在多个案例中，我们只需添加类来隐藏元素。如下所示，hidden-print被添加到外部元素中。打印时，页面仍包含标记为隐藏的项目。

作为测试，我决定将其放在应用程序中的其他随机元素上，并且在所有方面似乎都忽略了无打印请求。

<div class="navbar navbar-default hidden-print" role="navigation">
  <div class="navbar-header">
    <g:link class="navbar-brand" uri="/">Eight States</g:link>
  </div>
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav navbar-right">
        <li><g:link controller="agency" action="index">Agency</g:link></li>
        <li><g:link controller="attendee" action="index">Attendee</g:link></li>
        <li><g:link controller="vendor" action="index">Vendor</g:link></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Reports <b class="caret"></b></a>
          <ul class="dropdown-menu">
            <li><g:link controller="activityRegistration">Event Report</g:link></li>
            <li><g:link controller="attendee" action="flightReport">Flight Report</g:link></li>
            <li><a href="#">Something else here</a></li>
            <li class="divider"></li>
            <li><a href="#">Separated link</a></li>
          </ul>
        </li>
        <li>
        <sec:ifLoggedIn><a href="${createLink(uri: '/j_spring_security_logout')}">Logout</a></sec:ifLoggedIn>
        <sec:ifNotLoggedIn><g:link controller='login' action='auth'>Login</g:link></sec:ifNotLoggedIn>
        </li>
      </ul>
    </div>
  </div>

Answer 1

问题是在打印媒体类型时不包含CSS。

<link href="/SomeProject/static/bundle-bundle_bootstrap_head.css" type="text/css" rel="stylesheet" media="screen, projection">

仅包含用于屏幕和投影的CSS。

关于您的评论：我非常确定如果链接元素上的媒体属性不包含print，则在打印时不会解析CSS。

因此，CSS中的媒体查询永远不会有机会运行。如果您查看getbootstrap.com网站，您会发现它没有在样式表中包含媒体规范，因此会针对所有媒体类型（包括打印）进行处理。

Grails bootstrap hidden-print无法按预期工作

1 个答案: