CSS

CSSで印刷されないボタンを作る

投稿日:2013/08/27 更新日:

印刷されないボタン作成

HTMLで作成した画面をブラウザー表示し、
その画面に印刷ボタンを設けて印刷できるようにします。
またそのボタンは印刷時には印刷されないように
CSSのメディアを利用して実現します。

1.CSSでセレクタを作成

.CSSでセレクタを作成します。

2.ボタンを印刷時に非表示

ボタンを印刷時に非表示にします。

これで画面には表示されるが、印刷結果には印刷されない
ボタンができあがりました。

また、メディアの「print」を別のものに変えれば
対応したメディアでは表示されなくなります。
CSS2.1で指定できるメディアは以下のものです。

all すべての環境
screen パソコン画面
tty 文字幅が固定の機器
tv テレビベースのウェブブラウザ
projection プロジェクタ
print プリンタ
handheld 携帯用機器
braille 点字出力機器
embossed 点字プリンタ
speech 音声出力機器

複数指定する場合は「,」で区切って指定します。




-CSS
-

Copyright© ソフトウェア開発日記 , 2018 All Rights Reserved.