締切済み

HTMLで枠線を指定したいのですが

2005/01/27 18:19

全くHTMLに関してはわからないのですが、あるソフトの結果印刷みたいなのがHTMLなんです。それを印刷して結果を出しているのですが、枠線がないのでまとまりが悪いのです。 @page {size:21.0cm 29.7cm; ;margin-top:0.0cm;margin-bottom:1.0cm;/ margin　left:0.0cm;marginright:0.0cm;marks:cross;} </style> <script language="JavaScript"> というような記述があります。これはA4の指定でしょうか？ここに何らかの記述をすると、20.0と28.0ぐらいの枠線が出来るのでしょうか？どうか、こんな素人の意味もよくわからないような質問ですが、助けて下さい。

satoshi777
お礼率43% (95/216)

HTML
回答数1
ありがとう数1

回答全件

HTMLの"table"項目をお調べになるとわかりやすいと思いますが …

2005/01/27 18:43

みんなの回答 （1）
専門家の回答

みんなの回答

hurry5me
ベストアンサー率30% (74/242)

2005/01/27 18:43 回答No.1

HTMLの"table"項目をお調べになるとわかりやすいと思いますが 21cm×29.7の枠の中に下1.0の余白を作るといった意味です。つまり、20×28のほぼA4サイズ表示になります。枠線を引くにはもう少し広範囲でソースを見ないとわかりにくいですが、border="0"という記述があれば数値を1か2と書き換えてみてください。線の太さを表します。上書きしてI.E.を更新する操作はお分かりでしょうか。以下に参考になるサイトを紹介します。

参考URL：: http://www.tohoho-web.com/js/index.htm

全文を見る

ログインすると、全ての回答が全文表示されます。

関連するQ&A

昨日も質問したのですが、HTMLでの枠線について
昨日も質問したのですが、現在、会社で仕様しているソフトの結果表示がHTMLを使用しています。それを印刷しているのですが、枠線がない為、まとまりが悪いのです。僕はHTMLなどプログラムは全くわかりません(>_<)どうかお助け下さい。   <html> <head>  <style type="text/css"> @page {size:21.0cm 29.7cm; ;margin-top:0.0cm;margin-bottom:1.0cm;/ margin-left:0.0cm;margin-right:0.0cm;marks:cross;} </style> <script language="JavaScript"> </script> </head> <body bgcolor = #C5C5D2> <spacer type=vertical size=10> <HR COLOR="#0000FF"> <h3 align=center><U>作業内容</U></h3> <HR COLOR="#666666"> <br clear=all> <table border=1 cellspacing=1 > <tr align=center> * * といった感じで中にある各項目には枠線がありますが、全体の枠線がないのです。僕は、20cmと28cmぐらいの枠線を入れたいのですが、どこにどのような記述が必要でしょうか？素人で申し訳ありませんがよろしくお願い致します。
- ベストアンサー
- HTML
何度もすみませんHTMLでの枠線についてなんですが・・・
先ほどの皆様方の回答のおかげで、枠線が出ました。しかし、違う問題も出ました(>_<)   <html> <head>  <style type="text/css"> @page {size:21.0cm 29.7cm; ;margin-top:0.0cm;margin-bottom:1.0cm;/ margin-left:0.0cm;margin-right:0.0cm;marks:cross;} @media print { body {border:solid 0.5pt black;padding:0.5cm} } </style> この @media print { body {border:solid 0.5pt black;padding:0.5cm} } を追加したことで、枠線が現れたのですが(ありがとうございました)、2ページにわたる場合に1枚目は下の線がなく、2ページ目は上の線がありません。これを、ページごとに枠線を出すことは可能でしょうか？先ほども言われたのですが、僕は素人すぎて、用語など必要箇所などもわかりません。必要な情報など載っていなくてわかりにくいと思いますが、よろしくお願いします。
- ベストアンサー
- HTML
枠線で全体を囲んだとき下の枠線が消えてしまう
kbd要素を枠線で囲って、その部分と「と入力してください。」の文字とバランスよく表示させたいのですが下のように記述したところ、下の枠線が消えてしまいます。 marginやpaddingを調整してもうまくいきません。どうすればよいでしょうか？回答よろしくお願いします。 CSSソース kbd { margin: 0 0.3em; padding: 0.1em 0.3em; border: 1px solid black; } HTMLソース <kbd>keybord</kbd>と入力してください。
- ベストアンサー
- HTML
HTML、ＣＳＳが、なかなかうまくいきません。
お世話になります。 HTMLを始めたばかりですので、ご教授いただけたら幸いです。以下の図のような感じに並べたいのですが、なかなかうまい具合にいきません。黄色は、全てボタンになります。赤は、ボタンについた吹き出し部分となります。上段の２つのボタンは、やや大きい感じのボタン。下段の３つのボタンは、上段に比べて、少し小さい感じのボタンになります。ボタンは、上段(A)と下段(B)で、 HTML と CSS は、分けようかと考えています。【HTML】 <div class="Button"> <div class="contents"> <div class="Button_boxA clearfix"> <div class="Yellow_Btn_01"><img src="img/Yellow_Btn_01.png" width="200" height="75" /> </div> <div class="Yellow_Btn_02"><img src="img/Yellow_Btn_02.png" width="200" height="80" /> </div> </div> <div class="btn_boxB clearfix"> <div class="Yellow_Btn_03"><img src="img/Yellow_Btn_03.png" width="100" height="60" /> </div> <div class="Yellow_Btn_04"><img src="img/Yellow_Btn_04.png" width="100" height="65" /> </div> <div class="Yellow_Btn_05"><img src="img/Yellow_Btn_05.png" width="100" height="60" /> </div> </div> </div> </div> 【 CSS 】 div.Button{ width:600px; margin-top:20px; margin-right:auto; margin-left:auto; padding-right:25px; } div.btn_boxA{ width::500px; margin-left:auto; margin-right:auto; margin-bottom:10px; } div.low_btn_01{ width:200px; height:75px; margin-left:auto; margin-right:auto; margin-bottom:10px; float:left; } div.low_btn_02{ width:200px; height:80px; margin-left:auto; margin-right:auto; padding-left:25px; margin-bottom:10px; float:left; } div.btn_boxB{ width::500px; margin-left:auto; margin-right:auto; margin-bottom:10px; } div.low_btn_03{ width:100px; height:60px; margin-left:auto; margin-right:auto; margin-bottom:10px; padding-left:25px; float:left; } div.low_btn_04{ width:100px; height:65px; margin-left:auto; margin-right:auto; margin-bottom:10px; padding-left:25px; float:left; ] div.low_btn_05{ width:100px; height:60px; margin-left:auto; margin-right:auto; margin-bottom:10px; padding-left:25px; float:left; } 長ったらしくなってしまいましたが、ご教授いただけたら、幸いです。宜しくお願いします。
- 締切済み
- CSS
dreamweaverのHTMLと他のマージン設定の違い？
はじめまして。現在、dreamweaverを使いホームページを作成しています。他方、しっかりとした知識を身につけるため、HTMLを毎度確認しているのですが、さまざまなサイトとのHTML記述の微妙な違いが気になっています。以下の違いを教えていただけないでしょうか？ dreamweaverでのマージン設定『margin-left: 0px; 　margin-top: 0px; 　margin-right: 0px; 　margin-bottom: 0px;』他のサイトのマージン設定と思われる記述『topmargin=0 leftmargin=0 marginheight=0 marginwidth=0』『LEFTMARGIN=0 TOPMARGIN=0 MARGINwidth=0 MARGINheight="0" 』等これらの違いはいったい何なんでしょうか？初心者なため見当違いな質問をしているかもしれませんがどうかよろしくお願いいたします。また、dreamweaverだけで作成したサイトは「よくない」みたいな記述をたまに見かけますが、具体的にはどのようなことがあげられるのでしょうか？どうかよろしくお願いいたします。
- ベストアンサー
- HTML
テーブルの枠線（外内両方）をすべて同じ太さ(1px)にしたい
はじめまして。 cssから初めて、いま初めてテーブルタグを触っているのですが・・・おそらくとても初心者なことだと思うのですが、tableタグの枠線の太さを揃える方法がわかりません・・・ <table ～>で直接HTMLで指定すると重なり合う2つのborderのおかげで2px分のテーブルが表示されます。これを1px分だけの細い（ここのサイトもそうだと思います。）テーブルを作りたいのですが、こちらはCSSでそれぞれのセルに対してこのセルはbottomだけ、このセルはleftだけ、というように指定していかなければいけないのでしょうか？テーブル自体ほとんど触ったことはないのですが、なぜか余計にややこしいことをしているような気がして質問させていただきました。どうかよろしくお願致します。
- ベストアンサー
- HTML
プリント設定をPHP、JAVA、jQuerなどで
Ａ４サイズで帳票を作り、htmlで保存しました。（下記にサンプルとソースを掲載）これを余白やサイズをそのままでプリントアウトしたいと思います。この場合、ブラウザ上のプリント設定で、「縮小して全体を印刷する」のチェックをはずしたり、余白を0にしたりしなければなりません。この設定を、プログラムで設定できないでしょうか。ブラウザ上で設定しなくても自動的にＡ４サイズぴったりにプリントできないでしょうか。 CSS、PHP、JAVA、jQueryなどで、そういう方法がありましたら、ご教授いただきたいたいと思います。何卒よろしくお願いします。 ※サンプルでは、余白を四方2cmずつとっています。 ★サンプル http://pips.chu.jp/0/a4/index.html ★上記のソース <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 14.0.8.0 for Windows"> <title>印刷範囲の指定</title> <style type="text/css">  h1{ font-size : 15pt; font-weight : normal; text-align : center; } #table{ margin-top : 1cm; margin-left : 1cm; margin-right : 1cm; margin-bottom : 1cm;border-width : 1px;border-style : solid; width : 15cm; height : 22cm; text-align : center; } --> </style> </head> <body bgcolor="#fff1e6"> <div id="print"> <h1>帳票をＡ４サイズで出力したい</h1> <table id="table"> <tbody> <tr> <td>帳票</td> </tr> </tbody> </table> </div> </body> </html>
- ベストアンサー
- PHP
h1にタイトル画像を指定しているのですが・・
h1にテキストでは、ページのタイトルを入れて、CSSで背景を指定しています。【HTML】 <div id="header><h1>タイトル</h1></div> 【CSS】 #header h1{ text-indent: -9999px; background-image: url(../images/share/title.gif); background-repeat: no-repeat; height: 43px; width: 317px; margin-top: 10px; margin-bottom: 10px; margin-left: 10px; text-align: left; } FirefoxとIEでは表示されているのですが、Operaで見ると表示されていません。Operaで表示させることは難しいのでしょうか？
- 締切済み
- HTML
HTML　いじったらデザインが崩れました。
ホームページ作成について。初心者です。大変困っています。初心者ながらも空いた時間を使い、コツコツ作成してきたのですが、ある日なにをどういじったのかデザインがガラッと崩れてしまい、修復不能なまま１週間戦い続けましたがもう駄目です。どなたかお分かりになる方、どうかどうかご教授願います。テーブルとテーブルの間に <p style="font-family: MS 明朝;font-size: 20pt">ＰＩＣＵＰ<span> / 注目商品</span></p></div>を入れたいのと、サブメニューがかなり下にずれこんでしまったので、上に戻したいです。ＨＴＭＬ↓（文字数が多いので一部省略しています） <std{border: 1px botted #000000;} .uenashi td{border-top:0px;} .hidarinasi td{border-reft:0px;} {width:230px;height:230px} </style> <STYLE> TABLE.dotBorder { border-collapse: collapse; border-style: dotted frame: void magin-left: 100px; } TABLE.dotBorder TD{ width: 200px; height: 50px; border: 1px dimgray dotted; } </STYLE> <body> <div align="center"> <div id="field_spc"> <div id="logo_mono"> <img src="img/monochrom5.png" alt="monochrom" style="margin: 0; paddin:0;"> </div>  <div id="top_waku"> <img src="img/bords.jpg" width="950" height="500" alt="モノクローム"> </div>  <div id="main_spc"> <Table class="dotBorder"> <tr align="right" valign="bottom"> <td><img src="img/monochrom3.png" width="200" height="200" border="0" alt="新商品７月３０日～発売予定"> 1.新商品</td> <td><img src="img/monochrom3.png" width="200" height="200" border="0" alt="新商品７月３０日～発売予定"> 2.新商品</td> </tr> <tr align="right" valign="bottom"> <td><img src="img/monochrom3.png" width="200" height="200" border="0" alt="新商品７月３０日～発売予定"> 1新商品</td> <td><img src="img/monochrom3.png" width="200" height="200" border="0" alt="新商品７月３０日～発売予定"> 2新商品</td>  <div id="sub_spc"> <img src="img/menu.png"> <div class="midashi"> <span class="big">ＭＥＮＵ</span> </div> <div class="column"> <a href="./index.html">1.トップページ</a><br> <span class="hutomoji">2.テーマ</span><br> <a href="./link.html">3.リンク</a> </div> どなたかお願いします・・・ＣＳＳはこちらです↓ body { background-image: url(); margin-top: 0px; margin-bottom: 0px; margin-left: 0%; margin-right: 0%; padding: 0px; text-align: center; line-height: 150%; font-family: ＭＳゴシック,sans-serif; color: #333333; font-size: 14px; } #field_spc{ width: 1000px; margin: 0px 0px; background-image: url(img/.jpg); padding: 0px 10px; } #logo_mono { width: 70px; height: 70px; margin: 0; margin-bottom: 0; padding: 0; } #top_waku { width: 950px; line-height: 350px; margin-top: 0px; margin-bottom: 20px; border: 3px ridge #ffff00; background-color: #ffffff; padding: 0px 0px 0px 0px; text-align:; } #menu_block { margin-top: 10px; font-size: 25px; font-family: cursive; } #news_1 { margin-top: 40px; margin-left: 20px; text-align: left; } #main_spc { width: 40%; margin-top: 0px; margin-bottom: 20px; margin-left: 60px; margin-right: ; padding: 0px 10px; text-align: left; float: left; } #sub_spc { width: 22%; margin-top: 0px; margin-left: 0px; margin-right: 0px; margin-bottom: 20px; padding: 0px 0px; text-align: left; float: right; } #tb2 { width: 70%; margin-top: 0px; margin-bottom: 20px; margin-left: 60px; margin-right: ; padding: 0px 10px; text-align: left; float: left; } .fe { clear: both; } .ao_waku { background-color:gray; margin-top: 10; padding-bottom: 5; h2 { font-size: 18px; color: #ffffff; display: inline; } p { margin-top: 0px; } strong { font-size: larger; background-color: green; color: white; padding: 3px 5px; } .hutomoji { font-weight: 700; } .black { color: #000000; } .red { color: #ff0000; } .blue { color: #0000ff; } .gray { color: #808080; } .green { color: #008000; } .big { font-size: 18px; font-weight: 700; } .midashi { width: 90%; background-color: #dd9900; padding: 5px; border: 2px solid #dd9900; text-align: center; color: #ffffff; } .column { width: 90%; margin-bottom: 20px; background-color: #ffffff; padding: 5px; border: 2px solid #dd9900; text-align: left; line-height: 120%; color: #333333; } a:link { text-decoration: underline; color: #0000ff; } a:visited { text-decoration: underline; color: #0000ff; } a:hover { text-decoration: underline; position: relati
- ベストアンサー
- HTML
この度HPを作成していて疑問に思ったのですが、imgを回り込ませたとき
この度HPを作成していて疑問に思ったのですが、imgを回り込ませたときなどに、添付画像の様にならなくする方法はありますか？なるべくCSSでそれを行いたいのですが、高さを指定してなどは、やりたくありませんよろしくお願いします。 HTML <h2>キングギドラ公開開始 </h2> <p class="up"> <img src="file:///C:/Users/chako/Desktop/G-Works/img/lrg53616_0_357935.png" width="150" height="112" border="0"> キンブギドラ公開しました詳細はギャラリーより </p> CSS .up{ bottom : auto; line-height : 15px; border-bottom-width : 2px; border-bottom-style : dotted; border-bottom-color : #990000; } h2{ margin-top : 0px; margin-left : 0px; margin-right : 0px; margin-bottom : 0px; height : 20px; border-bottom-width : 2px; border-bottom-style : dotted; border-bottom-color : #990000; bottom : auto; padding-top : 5px; font-size : 20px; } #right img{ float : left; margin-top : 0px; margin-left : 5px; margin-right : 10px; margin-bottom : 10px; }
- 締切済み
- ネットトラブル