2017-09-11 5 views
1

ここに私のユーザが情報を記入して印刷することができる印刷可能なアプリケーションのフォームがあります。紙に印刷するとドットの点が異なって見える

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Pritable Document</title> 
    <style> 
     p{ 
      font-size: 20px; 
     } 
     .fillin { 
      border-bottom: 2px dotted #888; 
      font-weight: bold; 
      line-height: 12px; 
     } 
    </style> 
</head> 
<body> 
    <p> 
    Name:<span class="fillin">Jonh Nathon</span> 
    </p> 
    <p> 
    Gender:<span class="fillin">Male</span> 
    </p> 
    <p> 
    Date of Birth:<span class="fillin">10-July-1990</span> 
    </p> 
</body> 
</html> 

入力可能なスペースとしての点(...)はブラウザ上で問題なく表示されますが、印刷するとブラウザと同じには見えません。代わりに正方形やアスタリスクのようなものです。

Here it look like when I print it

私はすでにborder-bottomスタイルdottedを使用するように私はCSSでこの問題をどのように修正することができますか?ありがとう。

答えて

1

これを行うには、あらかじめ定義されたhtml方法を使用してみてください!

<!DOCTYPE HTML> 
<html> 
<head> 
<style> 
    u.dotted{ 
     border-bottom: 1px dashed #999; 
     text-decoration: none; 
    } 
</style> 
</head> 
<body> 
    Name: <u class="dotted">John Nathon</u> 
</body> 
</html> 
+0

ありがとうございます。しかし、印刷されると、それはブラウザのように見えません。 –

+0

別のプリンタを変更しよう –

+0

私の友人も自分のプリンタで印刷しようとしますが、それでも同じ問題があります。 –

関連する問題