[Blog_users_ml] 画面の印刷が２重刷りになる
Toshitaka Kuno
blog_users_ml@dropcontrol.com
Thu, 20 Nov 2003 20:51:27 +0900
At 01:29 03/11/20 +0900, you wrote:
>Piece of a Puzzleの前川です。
>
> > 印刷プレビューすると同じ画面が２重に重なって（ずれて）表示されます
> > （ひとつの画面の上にもうひとつ重なって表示）。
> > 投稿画面部のみ２重になります（Moblog名、カレンダなどは２重にならない）。
> > カテゴリで表示させた場合には、印刷プレビューでも２重にはなりません。
>
>要するに、WEBページをプリントアウトしたいということですよね?
>それならCSSでメディアタイプを指定してやればいいのでは?
>
>具体的にはCSSに.........................
---------------------------------------
ご指導ありがとうございます。
当方、基本的知識が欠けていますので、いろいろご迷惑をおかけいたします。
ご指摘の
@media print {
body { font-size: 9pt; }
}
を下記のようにcssファイルへ追加してみましたが、変化ありませんでした。
１）まず印刷プレビューが２重になっている画面をデスクトップへ保存して、
a.html とa.filesを得る。
２）a.filesの中にある styles-site.css を開いて
そのリスト（スレッド）のトップに
@media print {
body { font-size: 9pt; }
}
を書き込み、保存してから、a.html をダブルクリックして表示させ、
ファイル/印刷プレビュー としてプレビューしてみる。
結果は２重刷りは存在し、変化なしでした。
やり方が間違っているのでしょうか？
注記：２重刷りというのは、 blogbody部分の表示が、画像も含めて一度表示し
た上に、
少しずれてもう一度書き込んでいるような表示です。
----------------------------------------------------------------------------------------
ご参考用に a.htmファイルの一部、 styles-site.css (未修正のすべて）の2つ
のファイルのリストを下記に表示しておきます。
メールが長くなってすみません。
１）a.htmのリスト上半部；
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<!-- saved from url=(0036)http://kunolabs.zive.net/wblg1/mtmb/ -->
<HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>モブログ研究</TITLE>
<META http-equiv=Content-Type content="text/html; charset=EUC-JP"><LINK
href="モブログ研究.files/styles-site.css" type=text/css
rel=stylesheet><LINK title=RSS
href="http://kunolabs.zive.net/wblg1/mtmb/index.rdf" type=application/rss+xml
rel=alternate><LINK title=RSD href="http://kunolabs.zive.net/wblg1/mtmb/rsd.xml"
type=application/rsd+xml rel=EditURI>
<SCRIPT language=javascript type=text/javascript>
function OpenComments (c) {
window.open(c,
'comments',
'width=480,height=480,scrollbars=yes,status=yes');
}
function OpenTrackback (c) {
window.open(c,
'trackback',
'width=480,height=480,scrollbars=yes,status=yes');
}
</SCRIPT>
<META content="MSHTML 6.00.2800.1276" name=GENERATOR></HEAD>
<BODY>
<DIV id=banner>
<H1><A accessKey=1
href="http://kunolabs.zive.net/wblg1/mtmb/">モブログ研究</A></H1><SPAN
class=description></SPAN></DIV>
<DIV id=content>
<DIV class=blog>
<H2 class=date>November 15, 2003 </H2>
<DIV class=blogbody><A name=000035></A>
<H3 class=title>８月のディズニー。 [<A
href="http://kunolabs.zive.net/wblg1/mtmb/images/cat_6.html">kunosem</A>]</H3>
<DIV class=caption>スギより。まだ写真は現像してません。すみません。 </DIV>
<DIV class=photo><IMG src="モブログ研
究.files/blog-photo-1068897904.59-0.jpg"></DIV>
<DIV class=posted>投稿者 mobkuno : <A
href="http://kunolabs.zive.net/wblg1/mtmb/images/000035.html">09:05 PM</A> | <A
onclick="OpenComments(this.href); return false"
href="http://kunolabs.zive.net/mt/mt-comments.cgi?entry_id=35">コメント (2)</A>
</DIV></DIV>
................................
2）styles-site.css のリストのすべて(未修正）;
BODY {
BACKGROUND: #fff; MARGIN: 0px 0px 20px
}
A {
COLOR: #003366; TEXT-DECORATION: underline
}
A:link {
COLOR: #003366; TEXT-DECORATION: underline
}
A:visited {
COLOR: #003366; TEXT-DECORATION: underline
}
A:active {
COLOR: #999999
}
A:hover {
COLOR: #999999
}
H1 {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px;
MARGIN: 0px; PADDING-TOP: 0px
}
H2 {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px;
MARGIN: 0px; PADDING-TOP: 0px
}
H3 {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px;
MARGIN: 0px; PADDING-TOP: 0px
}
#banner {
PADDING-RIGHT: 15px; BORDER-TOP: #666 4px double; PADDING-LEFT:
15px; FONT-WEIGHT: normal; FONT-SIZE: x-large; PADDING-BOTTOM: 15px; COLOR:
#333; PADDING-TOP: 15px; FONT-FAMILY: palatino, georgia, verdana, arial,
sans-serif
}
#banner A {
FONT-SIZE: xx-large; COLOR: #333; FONT-FAMILY: palatino, georgia,
verdana, arial, sans-serif; TEXT-DECORATION: none
}
#banner A:link {
FONT-SIZE: xx-large; COLOR: #333; FONT-FAMILY: palatino, georgia,
verdana, arial, sans-serif; TEXT-DECORATION: none
}
#banner A:visited {
FONT-SIZE: xx-large; COLOR: #333; FONT-FAMILY: palatino, georgia,
verdana, arial, sans-serif; TEXT-DECORATION: none
}
#banner A:active {
FONT-SIZE: xx-large; COLOR: #333; FONT-FAMILY: palatino, georgia,
verdana, arial, sans-serif; TEXT-DECORATION: none
}
#banner A:hover {
FONT-SIZE: xx-large; COLOR: #333; FONT-FAMILY: palatino, georgia,
verdana, arial, sans-serif; TEXT-DECORATION: none
}
.description {
FONT-SIZE: small; TEXT-TRANSFORM: none; COLOR: #333; FONT-FAMILY:
palatino, georgia, times new roman, serif
}
#content {
BORDER-RIGHT: #fff 1px solid; BORDER-TOP: #fff 1px solid;
BACKGROUND: #fff; MARGIN-BOTTOM: 20px; MARGIN-LEFT: 225px; BORDER-LEFT:
#fff 1px solid; WIDTH: 70%; MARGIN-RIGHT: 20px; BORDER-BOTTOM: #fff 1px
solid; POSITION: absolute
}
#container {
BORDER-RIGHT: #fff 1px solid; BORDER-TOP: #fff 1px solid;
BACKGROUND: #fff; BORDER-LEFT: #fff 1px solid; BORDER-BOTTOM: #fff 1px solid
}
#links {
BORDER-RIGHT: #fff 1px solid; PADDING-RIGHT: 15px; BORDER-TOP:
#fff 1px solid; PADDING-LEFT: 15px; PADDING-BOTTOM: 15px; BORDER-LEFT: #fff
1px solid; WIDTH: 200px; PADDING-TOP: 15px; BORDER-BOTTOM: #fff 1px solid
}
.blog {
PADDING-RIGHT: 15px; PADDING-LEFT: 15px; BACKGROUND: #fff;
PADDING-BOTTOM: 15px; PADDING-TOP: 15px
}
.blogbody {
FONT-WEIGHT: normal; FONT-SIZE: small; BACKGROUND: #fff; COLOR:
#333; LINE-HEIGHT: 200%; FONT-FAMILY: palatino, georgia, verdana, arial,
sans-serif
}
.blogbody A {
FONT-WEIGHT: normal; TEXT-DECORATION: underline
}
.blogbody A:link {
FONT-WEIGHT: normal; TEXT-DECORATION: underline
}
.blogbody A:visited {
FONT-WEIGHT: normal; TEXT-DECORATION: underline
}
.blogbody A:active {
FONT-WEIGHT: normal; TEXT-DECORATION: underline
}
.blogbody A:hover {
FONT-WEIGHT: normal; TEXT-DECORATION: underline
}
.title {
FONT-SIZE: medium; COLOR: #666; FONT-FAMILY: palatino, georgia,
times new roman, serif
}
#menu {
BACKGROUND: #fff; MARGIN-BOTTOM: 15px; TEXT-ALIGN: center
}
.date {
FONT-WEIGHT: bold; FONT-SIZE: large; MARGIN-BOTTOM: 10px; COLOR:
#333; BORDER-BOTTOM: #999 1px solid; FONT-FAMILY: palatino, georgia, times
new roman, serif
}
.posted {
FONT-SIZE: x-small; MARGIN-BOTTOM: 25px; COLOR: #000000;
FONT-FAMILY: verdana, arial, sans-serif
}
.calendar {
PADDING-RIGHT: 2px; PADDING-LEFT: 2px; FONT-WEIGHT: normal;
FONT-SIZE: x-small; BACKGROUND: #fff; PADDING-BOTTOM: 2px; COLOR: #666;
LINE-HEIGHT: 140%; PADDING-TOP: 2px; FONT-FAMILY: verdana, arial,
sans-serif; TEXT-ALIGN: left
}
.calendarhead {
PADDING-RIGHT: 2px; PADDING-LEFT: 2px; FONT-WEIGHT: normal;
FONT-SIZE: small; BACKGROUND: #fff; PADDING-BOTTOM: 2px; TEXT-TRANSFORM:
uppercase; COLOR: #666600; PADDING-TOP: 2px; FONT-FAMILY: palatino,
georgia, times new roman, serif; LETTER-SPACING: 0.3em; TEXT-ALIGN: left
}
.side {
PADDING-RIGHT: 2px; PADDING-LEFT: 2px; FONT-WEIGHT: normal;
FONT-SIZE: x-small; BACKGROUND: #fff; PADDING-BOTTOM: 2px; COLOR: #333;
LINE-HEIGHT: 140%; PADDING-TOP: 2px; FONT-FAMILY: verdana, arial, sans-serif
}
.sidetitle {
PADDING-RIGHT: 2px; MARGIN-TOP: 30px; PADDING-LEFT: 2px;
FONT-WEIGHT: normal; FONT-SIZE: small; BACKGROUND: #fff; PADDING-BOTTOM:
2px; TEXT-TRANSFORM: uppercase; COLOR: #666600; PADDING-TOP: 2px;
FONT-FAMILY: palatino, georgia, times new roman, serif; LETTER-SPACING: 0.3em
}
.syndicate {
PADDING-RIGHT: 2px; MARGIN-TOP: 15px; PADDING-LEFT: 2px;
FONT-SIZE: xx-small; BACKGROUND: #fff; PADDING-BOTTOM: 2px; LINE-HEIGHT:
140%; PADDING-TOP: 2px; FONT-FAMILY: verdana, arial, sans-serif
}
.powered {
PADDING-RIGHT: 2px; MARGIN-TOP: 50px; PADDING-LEFT: 2px;
FONT-SIZE: x-small; BACKGROUND: #fff; PADDING-BOTTOM: 2px; TEXT-TRANSFORM:
uppercase; COLOR: #666; LINE-HEIGHT: 140%; PADDING-TOP: 2px; FONT-FAMILY:
palatino, georgia, times new roman, serif; LETTER-SPACING: 0.2em
}
.comments-body {
FONT-WEIGHT: normal; FONT-SIZE: small; BACKGROUND: #fff;
PADDING-BOTTOM: 10px; COLOR: #666; LINE-HEIGHT: 140%; PADDING-TOP: 10px;
BORDER-BOTTOM: #999 1px dotted; FONT-FAMILY: palatino, georgia, verdana,
arial, sans-serif
}
.comments-post {
FONT-WEIGHT: normal; FONT-SIZE: x-small; BACKGROUND: #fff; COLOR:
#666; FONT-FAMILY: verdana, arial, sans-serif
}
.trackback-url {
BORDER-RIGHT: #999 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP:
#999 1px dotted; PADDING-LEFT: 5px; FONT-WEIGHT: normal; FONT-SIZE: small;
BACKGROUND: #fff; PADDING-BOTTOM: 5px; BORDER-LEFT: #999 1px dotted; COLOR:
#666; LINE-HEIGHT: 140%; PADDING-TOP: 5px; BORDER-BOTTOM: #999 1px dotted;
FONT-FAMILY: palatino, georgia, verdana, arial, sans-serif
}
.trackback-body {
FONT-WEIGHT: normal; FONT-SIZE: small; BACKGROUND: #fff;
PADDING-BOTTOM: 10px; COLOR: #666; LINE-HEIGHT: 140%; PADDING-TOP: 10px;
BORDER-BOTTOM: #999 1px dotted; FONT-FAMILY: palatino, georgia, verdana,
arial, sans-serif
}
.trackback-post {
FONT-WEIGHT: normal; FONT-SIZE: x-small; BACKGROUND: #fff; COLOR:
#666; FONT-FAMILY: verdana, arial, sans-serif
}
.comments-head {
MARGIN-TOP: 20px; FONT-WEIGHT: bold; FONT-SIZE: small; BACKGROUND:
#fff; COLOR: #666; BORDER-BOTTOM: #999 1px solid; FONT-FAMILY: palatino,
georgia, verdana, arial, sans-serif
}
#banner-commentspop {
BORDER-RIGHT: #fff 1px solid; PADDING-RIGHT: 15px; BORDER-TOP:
#fff 1px solid; PADDING-LEFT: 15px; FONT-WEIGHT: bold; FONT-SIZE: large;
BACKGROUND: #003366; PADDING-BOTTOM: 5px; BORDER-LEFT: #fff 1px solid;
COLOR: #fff; PADDING-TOP: 5px; FONT-FAMILY: palatino, georgia, verdana,
arial, sans-serif
}
INPUT {
FONT-FAMILY: "Hiragino Kaku Gothic Pro W3", "Osaka", "MS PGothic",
verdana, arial, sans-serif
}
TEXTAREA {
FONT-FAMILY: "Hiragino Kaku Gothic Pro W3", "Osaka", "MS PGothic",
verdana, arial, sans-serif
}
-----------------------------------------------------------------------------------------
********************************
久野敏孝
e-mail: tkuno@nifty.com
********************************