私は現在、ユーザーがサイト上の顧客からの機械的な要求を見ることができるウェブサイトで作業しています。その後、要求を印刷できます。印刷時に水平ルールが表示されるテキストエリア
"ノート"セクションを印刷版のリクエストにのみ追加しようとしています。私はブートストラップを使用しているので、印刷が簡単になるまで隠しています。 <textarea> with horizontal rule
行がテキストエリアに素晴らしい仕事:
私の問題は、私はまさにこの答えのように、テキストエリアでの水平線を持つようにしたいということです。印刷するとき
:
方法にはある問題がwindow.print()ページで
を呼び出すときに、彼らが表示されないということですこの版を印刷版に表示させますか?
<dt class="visible-print">
Notes
</dt>
<dd class="visible-print">
<textarea class="notes" rows="10" cols="100"></textarea>
</dd>
.notes {
background-image: -webkit-linear-gradient(left, white 10px, transparent 10px), -webkit-linear-gradient(right, white 10px, transparent 10px), -webkit-linear-gradient(white 30px, #ccc 30px, #ccc 31px, white 31px);
background-image: -moz-linear-gradient(left, white 10px, transparent 10px), -moz-linear-gradient(right, white 10px, transparent 10px), -moz-linear-gradient(white 30px, #ccc 30px, #ccc 31px, white 31px);
background-image: -ms-linear-gradient(left, white 10px, transparent 10px), -ms-linear-gradient(right, white 10px, transparent 10px), -ms-linear-gradient(white 30px, #ccc 30px, #ccc 31px, white 31px);
background-image: -o-linear-gradient(left, white 10px, transparent 10px), -o-linear-gradient(right, white 10px, transparent 10px), -o-linear-gradient(white 30px, #ccc 30px, #ccc 31px, white 31px);
background-image: linear-gradient(left, white 10px, transparent 10px), linear-gradient(right, white 10px, transparent 10px), linear-gradient(white 30px, #ccc 30px, #ccc 31px, white 31px);
background-size: 100% 100%, 100% 100%, 100% 31px;
border: 1px solid #ccc;
border-radius: 8px;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
line-height: 31px;
font-family: Arial, Helvetica, Sans-serif;
padding: 8px;
}
どのようにすればいいのかわかりません。私はhtmlやCSSの初心者です。例を追加してください。 –
あなたは何を困惑しているのか、より具体的になりますか? z-indexで物を積み重ねる?または別の印刷/画面CSSファイルを作成しますか?他に何か? –
あなたはこの質問が4か月以上前のことであることを理解していますか?私が今までにそれを動作させることができなければ、明らかに期限はずっと前です。私は必要な行を使って手動でイメージを作成し、印刷していないときにCSSを隠してそこに置く以外は、何もすることはできませんでした。だからこそ、私はそれがあなたの主なポイント(私は理解していない)ではなかったとしても、アイデアが実際に働いたので、それを受け入れたものとしてマークしたのです。 –