因此,在我们的 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>
最佳答案
问题是在打印媒体类型时未包含 CSS。
<link href="/SomeProject/static/bundle-bundle_bootstrap_head.css" type="text/css" rel="stylesheet" media="screen, projection">
那只包括屏幕和投影的 CSS。
关于您的评论:我非常确定,如果链接元素上的媒体属性不包含 print
,那么在打印时将不会解析 CSS。
因此,CSS 中的媒体查询根本没有机会运行。如果您查看 getbootstrap.com您将看到该站点在样式表中不包含媒体规范,因此针对所有媒体类型(包括打印)进行了处理。
关于css - Grails bootstrap 隐藏打印无法按预期工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23204703/