Question

我正在尝试打印我的页面，我用bootstrap创建。在页面上我选择了输入控件。

当它被打印时......它有一个小三角形，这意味着这个字段是选择字段。但我不想打印这些信息。

有谁知道如何从打印中删除此三角形？ This one

以下是我的代码的外观：

<div class="col-sm-6 col-xs-12">
                        <span class="hidden-print">Wybierz z listy </span><!-- todo Radiobutton-->
                        <div class="input-group">
                            <select name="RAdiagnosisSelect"
                                    class="form-control"
                                    multiple-limit="1"
                                    ng-model="visit.diagnosisId"
                                    ng-disabled="!technical.firstVisit && visit.RADiagnosis!=2"
                                    required>
                                <option value="1">M05.8 Inne sero-dodatnie reumatoidalne zapalenie stawów</option>
                                <option value="2">M06.0 Surowiczoujemne reumatoidalne zapalenie stawów</option>
                                <!--<option value="3">M06.1 Choroba Stilla u osoby dorosłej</option>-->
                            </select>
                        </div>
                    </div>

我正在使用普通打印库：

<link href="Content/bootstrap.min.css" rel="stylesheet" media="all">

Answer 1

写下这种风格

<style>
@media print {
.caret {display:none;}
}
</style>

Answer 2

您可以将其隐藏在另一个元素后面，例如：在

之前

这是一个fiddle

用div包裹您的选择：

pnr  FlightId    DepartureDate                 SeatNo  class     fare      status       Source  Destination      Arrival Date

1     sh120 03-JAN-16 10.00.00.000000 AM    1   A   900 confirmed   pew karachi     03-JAN-16 12.00.00.000000 PM
2     sh120 03-JAN-16 10.00.00.000000 AM    2   A   900 reserved    pew karachi     03-JAN-16 12.00.00.000000 PM
3     sh120 03-JAN-16 10.00.00.000000 AM    3   A   900 reserved    pew karachi     03-JAN-16 12.00.00.000000 PM
4     sh120 03-JAN-16 10.00.00.000000 AM    4   A   900 reserved    pew karachi     03-JAN-16 12.00.00.000000 PM

.input-group {
  position: relative;
}

.input-group:before {
  content: '';
  position: absolute;
  width: 29px;
  height: calc(100% - 2px);
  background: white;
  top:1px;
  right:1px;
  z-index: 1; 
}

.select-wrapper {
  position: relative;
  z-index: 0;
}

.select {
  border: 1px solid gray;
}

Answer 3

老实说，我是以其他方式做到的。我拆开了可见部分和打印部分。

从显示用户内容获得一个代码，第二个是打印。

效果很好，所以我没有格式化问题。

所以，答案是：使用hidden-print和visible-print：）。

Bootstrap选择输入字段打印

3 个答案: