Question

我尝试过各种各样的css组合，但我只会活得这么长时间而且我宁愿有人帮助我度过余生这段问题！

我在页面上有手风琴面板，但客户希望我提供网站的.pdf文件，因此需要显示面板内容。我已经尝试了各种网站的各种代码建议，无法通过常规打印命令或通过Adobe Acrobat Pro XI打印来展开和显示/打印内容。尝试通过“打印网页”命令在Acrobat中打印具有相同的结果。

我很确定这是我的CSS中的一个错误，但我有点像新手。

提前感谢您的帮助！代码：

<!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Print Example Bootstrap 3 Accordion</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap-theme.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<style type="text/css">
    .bs-example{
        margin: 20px;
    }
@media print {
.Accordion {
  overflow: visible !important;
}

.AccordionPanelContent {
  display: block !important;
  overflow: visible !important;
  height: auto !important;
}
.collapse {
  display: block !important;
  overflow: visible !important;
  height: auto !important;
}
}
</style>
</head>
<body>
<div class="bs-example">
    <div class="panel-group" id="accordion">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title">
                    <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">1. What is HTML?</a>
                </h4>
            </div>
            <div id="collapseOne" class="panel-collapse collapse">
                <div class="panel-body">
                    <p>HTML stands for HyperText Markup Language. HTML is the main markup language for describing the structure of Web pages.</p>
                </div>
            </div>
        </div>
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title">
                    <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">2. What is Twitter Bootstrap?</a>
                </h4>
            </div>
            <div id="collapseTwo" class="panel-collapse collapse">
                <div class="panel-body">
                    <p>Twitter Bootstrap is a powerful front-end framework for faster and easier web development.</p>
                </div>
            </div>
        </div>
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title">
                    <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree">3. What is CSS?</a>
                </h4>
            </div>
            <div id="collapseThree" class="panel-collapse collapse">
                <div class="panel-body">
                    <p>CSS stands for Cascading Style Sheet. CSS allows you to specify various style properties for a given HTML element such as colors, backgrounds, fonts etc.</p>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>

Answer 1

我知道这已经有5年了，但是最终让我的面板出现的唯一方法是在标题（在head标签之间）中使用以下代码：

library(data.table)
      dfA <- fread("
      A   B   C   D   E   F   G   Z  H   I   J   K  year_from_B iso  year   matchcode
      1   0   1   1   1   0   1   0  1   0   1   0 2009  NLD   2010   NLD2010
      2   1   0   0   0   1   0   1  NA  NA  NA  NA  NA  NLD   2014   NLD2014
      3   0   0   0   1   1   0   0  NA  NA  NA  NA  NA  AUS   2010   AUS2010
      4   1   0   1   0   0   1   0  NA  NA  NA  NA  NA  AUS   2006   AUS2006
      5   0   1   0   1   0   1   1  NA  NA  NA  NA  NA  USA   2008   USA2008
      6   0   0   1   0   0   0   1  NA  NA  NA  NA  NA  USA   2010   USA2010
      7   0   1   0   1   0   0   0  NA  NA  NA  NA  NA  USA   2012   USA2012
      8   1   0   1   0   0   1   0  0   0   1   0 2007  BLG   2008   BLG2008
      9   0   1   0   1   1   0   1  NA  NA  NA  NA  NA  BEL   2008   BEL2008
      10  1   0   1   0   0   1   0  1   1   0   1   2009 BEL  2010   BEL2010
      11  0   1   1   1   0   1   0  1   0   1   0 2009  NLD   2010   NLD2010
      12  1   0   0   0   1   0   1  NA  NA  NA  NA  NA  NLD   2014   NLD2014
      13  0   0   0   1   1   0   0  NA  NA  NA  NA  NA  AUS   2010   AUS2010
      14  1   0   1   0   0   1   0  NA  NA  NA  NA  NA  AUS   2006   AUS2006
      15  0   1   0   1   0   1   1  NA  NA  NA  NA  NA  USA   2008   USA2008
      16  0   0   1   0   0   0   1  NA  NA  NA  NA  NA  USA   2010   USA2010
      17  0   1   0   1   0   0   0  NA  NA  NA  NA  NA  USA   2012   USA2012
      18  1   0   1   0   0   1   0  0   0   1   0 2007  BLG   2008   BLG2008
      19  0   1   0   1   1   0   1  NA  NA  NA  NA  NA  BEL   2008   BEL2008
      20  1   0   1   0   0   1   0  1   1   0   1   2009 BEL  2010   BEL2010",
      header = TRUE)

Bootstrap 3手风琴面板不会打印

1 个答案: