人に聞けない痔の悩み、これでスッキリ >>

ウェブページをプリントする際、例えばIEでは「ツール>インターネットオプション>詳細設定」で、「背景の色とイメージを印刷する」に設定すれば、htmlやcssで背景していしている画像もプリントされるのですが、、
設定方法を知らない人の方が多いかと思います。

そのチェックなしに、htmlやcssなどの指定により強制的に背景画像もプリントされるような状態にできるものなのでしょうか?

このQ&Aに関連する最新のQ&A

A 回答 (4件)

http://www.lucky-bag.com/archives/2005/12/print- …

そもそもWeb上の画像なんて印刷に耐えれるレベルじゃないし、背景ないほうが無駄なインクを消費しないですむのだけどね。
家庭用インクジェットプリンタなら画質はそんなに気にならないけど。

自分なら、印刷用にメニューとか余計なの印刷されない背景とか無くても見やすい別なCSS用意しますね。

参考URL:http://www.lucky-bag.com/archives/2005/12/print- …
    • good
    • 1
この回答へのお礼

参考になりました!! まさにそういうのがないかなぁ・・・って思っていたことでした。
しかしながら・・・
リンク先の内容を見ながらいろいろ記述してみましたが、なぜか中にはうまくいかないclassなどあり・・・結局、この方法はあきらめました。

でも、そこから発送が進展して、プリント時には、現状のスクリーンショットをプリントアウトできるようにhtmlとcssで指定してみました。

んんん。もちろん、なにかプリント用のcss・・・とは思っていたものの、ご教授頂いたアドバイスURLなしではこの発想はなかったです。ほかにも、このような形で、プリント時は別に画像(スクリーンショット)を用意すること等あるのですかねぇ。。

とにかく、解決策には至りました!!
どうもありがとうございました!

お礼日時:2008/02/29 21:06

「なぜ強制的に背景を印刷させたいか(印刷させなければならないのか)」を説明すれば、


よりよい方法を誰かが提示してくれるかもしれませんよ。

この回答への補足

理由はサイト制作を行ったお客様よりのご要望です。
CSSにて画像を背景指定している部分が多く、そのためブラウザ側での設定変更をしなくては、ウェブページ上の背景として指定されている画像はプリントされませんよね。

お客様より、プリントアウトしても画像がプリントされない・・・という指摘があり、設定により変更できることは伝えましたが、設定変更なしにプリントできるようにはできないか・・・という要望があったからなのです。

もちろん、再度htmlとcssを書き直せばよいのですが、画像には透過PNG等を利用し、何かと苦労して完成させてたウェブだけに・・・なにか簡単に指定できる方法はないかと考えたため、質問を書いてみました。

htmlやcssの指定でできないのであれば、再度背景指定している画像は、直接<img>タグにて記述するよう変更しなおすしかないかな・・と、作業量を考えると膨大なので・・悩んでいるところです。

補足日時:2008/02/29 14:27
    • good
    • 0

コントロールパネルで設定したシステム環境を外部のhtmlファイル


やJavaScriptごときに勝手に書き換えられるようでは困りますね。
あり得ません。が、そこはMS WindowsとIEのペア、ActiveXという巨
大な穴が用意されていました。参考URLへどうぞ。

参考URL:http://www.meadroid.com/scriptx/index.asp
    • good
    • 0

相手のPCの設定を断りもなく勝手に変更するということになりますが


それはウイルスと大差ないですよ。

自分が思った通りに印刷させようと思うなら 印刷用データを PDFな
どで配布すべきかと思います。Webページのまま印刷させる前提で考
えるなら その点まで考えたページ構成にする必要があります。

つまりは背景ではなく画像に位置指定でデータを重ねて表示させるとい
う意味です。

この回答への補足

ということは、やはり方法はないのですかね?

まず、あたりまえですが、なにかしらのプログラム等を組み込むなどして閲覧者のPC設定を操作するような考えは全くないです。

質問にも書いたように、「htmlやcss」を用いた指定で実現できるような方法はないかな・・と考えています。

さらに、画像を背景ではなく直接のせればよいのですが、すでにできてしまっているウェブページでcssの記述にてなにかと指定してしまっているので、作り直すのではなく、何かここから設定を加える方法はないかと・・・考えている次第なのでございます。。

んんんん。やはりhtmlとcssの記述をやり直すしかないのかな・・・

補足日時:2008/02/29 13:37
    • good
    • 1

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Q背景を印刷

ページを印刷させる時、セルの塗りつぶしを印刷させるにはどうしたらいいですか?
普通に<TD bgcolor="#000099">等にすると、ブラウザのプロパティーで「背景を印刷」にチェックが入っていないと印刷されませんよね。
これを「背景を印刷」にチェックが入っていなくても印刷させるように出来ないでしょうか?
CSSで「background-color : #000099;」としてみましたが、無理でしたorz

Aベストアンサー

背景として表示させていてはたぶんブラウザによってブロックされたままでしょう。
<img>として背景画像として使うものを配置した上に
<div>などを重ねてみると
<img>は背景ではなく画像ですので、印刷してくれるでしょう。

画像ではなく色をつけたい場合も同様に、
#000099が1ドットあるだけの画像を用意しておくとうまくいくと思います。

文法ものすごく汚いですが、サンプル。
ブラウザの互換性は確認してません。
<table border="1"><tr><td><img width="100" height="100"><div style="margin-top:-100px;">aaa</div></td></tr></table>

Q印刷用CSS IEのとき、画像が印刷できない

現在、ホームページを作成し、印刷用のcssの作成をしております。
そこで、chromeやsafariでは表示できるのに、ieでは印刷時に画像が表示されない部分があります。

以下のようなhtml、cssにてコーディングしております。

【HTML】
<div class="hoge">
  <a href="./">Top</a>
</div>

【print.css】
.hoge a{
content: url("../images/print/img_header_pr.jpg");
position: absolute;
top: 9px;
left: 9px;
}


IEで表示させるには、どのようにすればよいのでしょうか

Aベストアンサー

印刷には適用されないようですね。
印刷を考慮したページでしたら、後方互換のため次のように書くほうが良いでしょう。

★Another HTML-lint 5( http://www.htmllint.net/html-lint/htmllint.html# )
でチェック済み。HTML4.01strict+CSS2.1
★タブは_に置換してあるので戻すこと。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
_<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
_<title>サンプル</title>
_<meta name="author" content="ORUKA1951">
_<meta http-equiv="Content-Style-Type" content="text/css">
_<link rev="made" href="mailto:oruka1951@hoge.com" title="send a mail" >
_<link rel="START" href="../index.html">
<style type="text/css" media="screen">
<!--
a img{border:none;}/* IE対策 */
div.header h1{
width:900px;height:210px;
margin:0 auto;
overflow:hidden;
text-indent:-900px;
position:relative;
}
div.header h1 a{
display:block;width:100%;height:100%;
background: url("../images/main/img_header.jpg") top left no-repeat;
}
div.header h1 a:hover {
background-position:bottom left;
}
-->
</style>
<style type="text/css" media="print">
<!--
a img{border:none;}
div.header div.nav a:after{content:"\A( http://hoge.com"attr(href)" )";withe-space:pre;}
-->
</style>
</head>
<body>
_<div class="header">
__<h1><a href="./"><img src="../images/print/img_header_pr.jpg" width="900" height="210" alt="ようこそ****のサイトへ"></a></h1>
__<div class="nav">
___<ol>
____<li><a href="/">Top</a></li>
____<li><a href="/product">製品</a></li>
____<li><a href="/books">書籍</a></li>
____<li><a href="/profile">紹介</a></li>
___</ol>
__</div>
_</div>
_<div class="section">
__<h2>見出し</h2>
__<p class="goTop"><a href="/">トップへ</a></p>
_</div>
_<div class="footer">
__<h2>文書情報</h2>
__<dl class="documentHistry">
___<dt id="FIRST-PUBLISHED">First Published</dt>
___<dd>2012-08-10</dd>
___<dt id="LAST-MODIFIED">Last Modified</dt>
___<dd>2012-08-10 12:00:00 (JST)</dd>
__</dl>
__<address>&copy; ORUKA1951 2012 - 2016 All Rights Reserved mailto:*****</address>
_</div>
</body>
</html>

印刷には適用されないようですね。
印刷を考慮したページでしたら、後方互換のため次のように書くほうが良いでしょう。

★Another HTML-lint 5( http://www.htmllint.net/html-lint/htmllint.html# )
でチェック済み。HTML4.01strict+CSS2.1
★タブは_に置換してあるので戻すこと。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
_<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
_<title>サンプル</title...続きを読む

QIEの印刷でcssが無効になう

宜しくお願いします。

CSSを使って、DIVタグでレイアウトしています。TABLEでなくDIVだけで組むのは初チャレンジです。外部CSSを使用しています。

IE(Ver6)では、問題なくCSSが有効となって見えるのですが、印刷プレビュー及び印刷では、CSSが無効となりレイアウトが崩れてしまいます。DIV関係に限らず全てのCSSが無効です。

こんな経験は初めてで、何が悪いのかわかりません。

どこをチェックすれば良いのでしょうか?

Aベストアンサー

#2です。例題が悪かったです。(こうなっていると印刷にcssが効かないという例です。)
media="screen" になっているならこのCSSはscreenメディア(主にパソコンのディスプレイ)に対してだけ適用してください。という意味になります。
media="screen,print" と、すると画面と印刷の両方に適用されます。
(media="all"またはmedia自体を削除すれば全てのメディアに適用されます。)

Qjavascriptでページ内の一部分だけを印刷する設定

ページを印刷するjavascriptを調べたところ、

<a href="javascript:window.print();">
印刷する</a>

というのが最も多く出てきました。
今回、ページ内のクーポンの部分だけを印刷する、
という設定にしたいのですが、その場合の記述方法を教えてください。

また上記の場合、<script>~</script> で
javascript自体の指令は必要ないんでしょうか。

Aベストアンサー

HTML上の印刷する部分を限定したいということですが、
こんな感じでどうでしょうか?

スタイルシートの設定のしかたで、ある程度近いことができると思います。
IE6ではこれで動いています。

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=shift_jis">
<title></title>
<style media=screen>
<!--
/*印刷時のみ表示*/
.prtOnly {display:none;}
// -->
</style>
<style media=print>
<!--
/*ブラウザのみ表示*/
.dspOnly {display:none;}
// -->
</style>
</head>
<body>
<!-- ブラウザ上のみ表示 -->
<div class="dspOnly">テスト</div><br>
<!-- 印刷時のみ表示 -->
<img src="test1.jpg" border="0" class="prtOnly"><br>
<!-- 両方表示 -->
<img src="test2.jpg" border="0" class="">
<br>
<br>
<a href="javascript:window.print();" class="dspOnly">
印刷する</a>

</body>
</html>


> また上記の場合、<script>~</script> で
> javascript自体の指令は必要ないんでしょうか。

javascript:window.print()←自体がJavaScriptの命令になって
いますので特に必要ありません。

※さらに複雑さ処理がやりたい場合は別ですが。

HTML上の印刷する部分を限定したいということですが、
こんな感じでどうでしょうか?

スタイルシートの設定のしかたで、ある程度近いことができると思います。
IE6ではこれで動いています。

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=shift_jis">
<title></title>
<style media=screen>
<!--
/*印刷時のみ表示*/
.prtOnly {display:none;}
// -->
</style>
<style media=print>
<!--
/*ブラウザのみ表示*/
.dspOnly {display:none;}
// -->
</style>
<...続きを読む

Q外部CSSで作成したページの印刷について

「外部CSS」で作成したページを、印刷プレビューしてみると
「HTML」だけ?の状態のような感じです。

「外部CSS」で作成したページを、CSSが反映した見た通りには、印刷できないのでしょうか?

なにか、記述の追加をすれば、できるのでしょうか?
または、参考サイトがあれば、教えてください。
よろしくお願いいたします。

Aベストアンサー

外部CSSだからとか言う事ではありません。
どこからの丸写しで、メディアタイプに「screen」と指定していませんか?

<link REL="stylesheet" type="text/css" HREF="外部CSSファイル" media="screen">

最後の「media="screen"」で出力するメディアを指定していて、画面用や印刷用に別々のスタイルシートを適用する事ができます。
・all:画面も印刷も全てに適用。
・screen:画面用
・print:印刷用

http://msugai.fc2web.com/web/CSS/media.html
http://allabout.co.jp/internet/hpcreate/closeup/CU20050728A/

参考URL:http://msugai.fc2web.com/web/CSS/media.html

Qページの一部が消える印刷プレビューの原因について

ご質問です。
当方、実務経験の浅いwebデザイナー兼コーダーです。
仕事でコーポレートサイトを作成したのですが、htmlファイルの納品後に「印刷にも対応できるようにしてほしい」とクライアントからの要望を頂きました。

フルcssで作成したサイトを確認するも社内のWinXPのIE7・WinVistaIE7共に特定の倍率で「ページのある一部」が印刷プレビューに映らない(印刷しても、そこだけ白い・そこだけスペースが空いている)という現象が起きてしまいました。
(念のため・・クライアントからは最低IE7で印刷できればいい、と言われています)

私の確認では倍率70~75%で「ページのある一部」が表示できなくなり、クライアントの環境(WinXP IE7)では縮小して全体を印刷する、80%、60%の3つで「ページのある一部」が表示できないとのことです。
これはいったい何が原因となっているのでしょうか。

印刷用のcssにzoom指定で修正はできそうなのですが、何より原因がわからないので気になります。

プリンターの問題なのか、ブラウザによるものなのか・・
はたまたコーディングが悪いのか・・。

説明が悪いので伝わりにくく申し訳ないのですが、クライアントにうまく説明するためにも心当たりがある方のご意見を頂きたいです。
宜しくお願いします。

ご質問です。
当方、実務経験の浅いwebデザイナー兼コーダーです。
仕事でコーポレートサイトを作成したのですが、htmlファイルの納品後に「印刷にも対応できるようにしてほしい」とクライアントからの要望を頂きました。

フルcssで作成したサイトを確認するも社内のWinXPのIE7・WinVistaIE7共に特定の倍率で「ページのある一部」が印刷プレビューに映らない(印刷しても、そこだけ白い・そこだけスペースが空いている)という現象が起きてしまいました。
(念のため・・クライアントからは最低IE7で印刷で...続きを読む

Aベストアンサー

結構日数が経っているのでもう解決済みかもしれませんが…
私も一度その現象に出くわしたことがあります。
その時はoverflow:hidden;を消せば直りましたが、どうでしょうか。
もし解決済みでしたら、どうしてそうなったのか、解決方法はあったのかよろしければ教えて下さい。

Qサイト全体を縮小して印刷するには?

こんにちは。教えてください。
http://lexus.jp/
上記アドレスのサイトのように
横幅940pxと普通はA4縦では全てが印刷出来ないサイズのサイトでも
ブラウザから印刷するとサイト全体が縮小して
A4縦に収まって印刷される方法を教えてください。

JavaScript、css少しならわかります。
よろしくお願い致します!

Aベストアンサー

まず、このサイトは標準準拠モードではなく互換モードで作成されています。
(IEはプロパティにつくアンダーバーを無視する。
他のブラウザは仕様どおり存在しないプロパティ自体を無視する)

http://lexus.jp/models/common/css/import.css
から読み込まれる
http://lexus.jp/models/common/css/default.css
にある

@media print {
body {
_zoom: 0.68;
}
}

を読み込むことで印刷時のみzoomを効かせているんだと思います。

Minefield/Firefox,Opera,IE7にはShrink To Fitという
自動的にページ幅を基準とする機能が付いています。

MinefieldではScaleで調整し,
Operaでは[ファイル]-[印刷オプション]に「用紙幅におさめる」で有効になります。
IE6は上の指定で回避します。

ただし,IE7は標準でShrink To Fitであり,zoomプロパティを読み込んでしまうため,異様に小さく印刷されてしまいます。なのでShrink To Fitではなく100%で印刷した方が良いでしょう。

何故か俺の環境ではVPC上でしか動作しないSafariは,
VPCにプリンタドライバ入れなきゃいけないのが面倒なので検証していません。

まず、このサイトは標準準拠モードではなく互換モードで作成されています。
(IEはプロパティにつくアンダーバーを無視する。
他のブラウザは仕様どおり存在しないプロパティ自体を無視する)

http://lexus.jp/models/common/css/import.css
から読み込まれる
http://lexus.jp/models/common/css/default.css
にある

@media print {
body {
_zoom: 0.68;
}
}

を読み込むことで印刷時のみzoomを効かせているんだと思います。

Minefield/Firefox,Opera,IE7にはShrink To Fitという
自動的にペ...続きを読む

Q印刷範囲の指定はできますか?

現在、ホームページを制作しているのですが、A4紙に収まらないページがあるのです(写真が切れてしまいます)。
そこで、ページのある一部分(メインの部分)だけを印刷する、またはしないように指定したいのですが、可能でしょうか。

Aベストアンサー

スタイルシートを使えば可能ですよ。

印刷用のスタイルシートを適用すればよいのです。
http://linkage.xrea.jp/article/2004/07/make_mediacss.php

上記のサイトを参考にしていただければ分かりやすいと思いますが(やり方は二通りあります)

たとえば、次のページを用意します。
<html>
<head>
<link rel="stylesheet" href="print.css" type="text/css" media="print">
</head>
<body>
<div class="noprint">
ここは印刷したくない
</div>
<div>
ここは印刷したい
</div>
</body>
</html>

上のHTMLでprint.cssというファイルを読み込み指定していますよね。
このprint.cssというファイルを作ります。
この中に

.noprint{
display:none;
}

と書いてあれば、class="noprint"で指定された部分は印刷されません。

分かりますでしょうか?

参考URL:http://linkage.xrea.jp/article/2004/07/css2print.php

スタイルシートを使えば可能ですよ。

印刷用のスタイルシートを適用すればよいのです。
http://linkage.xrea.jp/article/2004/07/make_mediacss.php

上記のサイトを参考にしていただければ分かりやすいと思いますが(やり方は二通りあります)

たとえば、次のページを用意します。
<html>
<head>
<link rel="stylesheet" href="print.css" type="text/css" media="print">
</head>
<body>
<div class="noprint">
ここは印刷したくない
</div>
<div>
ここは印刷したい
</div>
</body>
</htm...続きを読む

Q白抜き文字の印刷

白抜き文字の印刷をしようとしてます。

以下のソースをIEで開くと、背景黒の文字は白で表示されるのですが、印刷すると、背景白で文字は薄いグレーになってしまいます。
背景黒の文字白で印刷する方法はないでしょうか?

プリンターはIBMの5587-L20(モノクロのレーザープリンター)です。

===========================================
<html>
<body>
<table border=1>
<tr>
<td bgcolor="black">
<font color="white">TEST</font>
</td>
</tr>
</table>
</body>
</html>
===========================================

Aベストアンサー

>お客様が何らかの操作をすることなく、
>白抜きで印字できる方法はありませんでしょうか。

そうですねぇ。
では、白抜き文字を使うのをやめましょう(笑)

・・というのは冗談ですが、印刷するのであれば、
ほとんどの文字は白抜きではなく、
タイトルなどにのみお使いのことと思います。
あまりに白抜きが多いと、トナーをバカ食いして大変ですからね。

 というわけで、タイトルのみであるなら、たとえば
「TEST」の白抜き文字をGIF画像化してみてはどうでしょう。

Q独自ドメインからどこのレンタルサーバーを使用してるか調べる方法

独自ドメイン(www.好きな名前.com等)からどこのレンタルサーバーを使用してるか調べる方法を教えて下さい。
またレンタルサーバー専用会社なのか大手プロバイダのレンタルサービスを使用してるかを調べる方法をできれば具体的に教えて下さい。

Aベストアンサー

.comや.orgなどならば http://www.whois.sc/
でドメイン名を入れて検索すると、
その結果表示の中の IP location という項目に
会社名がでます。

.jpならば コマンドプロンプトで"ping サーバ名"で
IPアドレスを取得、次に http://www.nic.ad.jp/
下部左の部分にそのIPアドレスを入れて検索すると
会社名がでます。

でドメインを入れて


人気Q&Aランキング