• 締切済み

文字が斜め(斜体、イタリック体)に表示されます。

dreamweaver MX2004 で編集しています。普通に入力しているのですが、HPでチェックすると、一部の文字が斜体になってしまいます。下記が原稿です。dreamweaverのデザインチェックでは、斜体ではなく普通の文字です。サーバーにアップロードすると斜体になります。 【有限会社 ○○のホームページです】は、普通に表示されるのですが、それ以外が斜体になってしまい、見にくくなってしまいます。 特に「I」ボタンも押してませんし、ソースを見ても<em></em> タグもありませんし…。何か設定が間違っているのでしょうか…。 アドバイスいただけますとありがたいです。 ============ </style> <table style="WIDTH: 480px; HEIGHT: 170px" cellspacing="0" cellpadding="0" width="480" border="0"><tr><td><p align="center"><br> <font size="2"> <div align="center"><span class="style1"> 【有限会社 ○○のホームページです】 </span> </div> <blockquote> <blockquote> <blockquote> <p align="left">   はじめまして。有限会社 ○○です。</p> <p align="left">   弊社は主に○○を営んでいます。==省略== 様々な面から皆様のお手伝いが出来ることと思います。</span> </p> </blockquote> </blockquote> </blockquote>

みんなの回答

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.2

質問された文章の範囲では、こちらでは再現しないようです。(styleも含めて) 考えられるのは他で全体に掛るような指定がされている可能性ですが・・・ そのHTMLファイルをメモ帳などで開いて、関連がありそうな語句を検索してみてください。 1)斜体を指定するタグなど・・・ <i> 、 <em> 2)斜体のフォントを指定・・・・・ face = 3)CSSでの指定・・・・ italic、 oblique (font-style) 4)  〃     ・・・・ font-family 外部のスタイルシートを利用してたりしませんよね? その他の可能性として、ご使用のブラウザのデフォルト表示のフォント指定が斜体系のフォントになっているとかもあるけれど・・・? 関係ありませんが・・・、table関連のタグは下の方でちゃんと閉じていますよね?

uzumagawa
質問者

お礼

アドバイスありがとうございます。 テキストインデントで位置の微調整をしていたのですが、それを解除したら文字の斜体は修正されました。 原因は分かりません。 ありがとうございました。

  • bin-chan
  • ベストアンサー率33% (1403/4213)
回答No.1

HTMLソース5行目の <div align="center"><span class="style1"> のclass="style1"がどのような定義なのか、気になります。

uzumagawa
質問者

補足

早速のレスありがとうございます。 dreamweaverでプロパティから見てみますと、「フォーマット:なし」「フォント:フォント指定無し」「サイズ:なし」「B:太字」「I:無し」となっています。 これですか? あ、それと、質問の欄に載せたコードの上に、これもありました。 ============= <style type="text/css"> <!-- .style1 { font-size: 18px; font-weight: bold; } .style11 {font-size: 12px} --> </style> <table style="WIDTH: 480px; HEIGHT: 170px" cellspacing="0" cellpadding="0" width="480" border="0"><tr><td><p align="center"><br> <font size="2"> <div align="center"><span class="style1"> 【有限会社 ○○のホームページです】 ========== </style>から下の部分が、質問欄に載せた文です。すみません m ( _ _ ) m、質問が正確ではなくて。

関連するQ&A

  • 写真と文字の大きさをそろえたい

    ビルダーを使いながらやっているのですが 二つのものを左右に並べて上下同じ大きさで表示したいのですが、 下記では同じ大きさになっていると思うのですが、 大きさが(上下の大きさのみ※左右は異なってよいのですが) ことなって表示されてしまいます。 解決方法を教えてください。。。 <DIV style="width : 191px;height : 335px;top : 94px;left : 157px; position : absolute; z-index : 10;" id="Layer8" class="hpb-lb-tb1-cell1" align="center"> <SPAN class="hpb-body4"><SPAN STYLE="line-height:1"><span style="font-size:15pt"> <B><STRONG>ここに文字</STRONG></B></SPAN></SPAN></SPAN> </DIV> <DIV style="width : 412px;height : 295px;top : 94px;left : 347px; position : absolute; z-index : 9; " id="Layer9" class="hpb-lb-tb1-cell2" align=""><IMG src="hpb_i_top10.jpg" alt="イメージ" width="412" height="295"></DIV>

  • google画像検索のように画像を表示させたい

    http://oshiete1.goo.ne.jp/qa4869855.html で質問した者です。 「googleのように 画像」で検索したところ http://okwave.jp/qa4567914.html このページがHITしました。 そこでNo3の方のソースを元に画像を表示させてみました。 ---ここから--- <style type="text/css"> <!-- p{ text-indent: 1em;} body>h1,body>h2{ text-align:center;} p.abstract{ margin-left: 20%; margin-right: 20%;} div.ImageList{ position: relative; margin-left:20%;margin-right:10%;width: auto; border: solid 2px blue;} div.ImageList ol{ display:block; margin:0px; padding:0px;} div.ImageList>ol>li{display: block; margin: 2px;padding:0px;border:solid 1px gray; width:160px;height: 100px;float:left;text-align:center;} div.ImageList>ol>li>ol>li{display:block;font-size:0.8em;text-align:left;padding:0.2em;text-indent:1em;} div.ImageList hr{ clear:both;visibility:hidden;} div.ImageList div{ position: absolute; width: 21%; left: -23%;top: 0px;font-size:0.9em} --> </style> ---ここまで--- このスタイルシートについてなのですが、 画像のまわりについている黒の薄い線と、大きな青い線を消すことは出来ないでしょうか? この二つの枠線を消してもっと画像どうしをギュッと詰め込みたいのです。 どの部分を削れば削除することが出来ますか?

    • ベストアンサー
    • HTML
  • IE6だと表示がおかしく表示される。

    添付写真の上がIE9での表示で、下はIE6(IETesterで表示)ですが。 殆んど同じ記述で「写真」の無いページは、正しく表示しています。 必要と思われるタグは、下記の内容です。なお親ホントは100%です。 <div style="width:32%;float:left;"><img src="省略></a></div> <div style="width:59%;float:left;"><img src="省略"></a></div> <div style="font:1em/2.8em 'MS 明朝',serif;width:27.9em;float:clear:both;"> <div style="margin-left:9.52em;font-weight:bold;clear:both;">九月十八日</div> <div style="clear:both;width:27.9em;"> <div style="width:11.63em;font:1em/2.8em 'MS 明朝',serif;float:left;">省略</div> <div style="width:5.81em;font:1em/1.4em 'MS 明朝',serif;float:left;">省略</div> <div style="width:10.34em;font:1em/2.8em 'MS 明朝',serif;float:left;">省略</div> 省略 </div> <div style="font:1em/2.8em 'MS 明朝',serif;width:27.9em;float:"> <div style="clear:both;width:27.9em;"> <div style="width:11.63em;font:1em/2.8em 'MS 明朝',serif;float:left;margin-top:1.5em;">省略</div> <div style="width:5.81em;font:1em/1.4em 'MS 明朝',serif;float:left;margin-top:1.5em;">省略</div> <div style="width:10.34em;font:1em/2.8em 'MS 明朝',serif;float:left;margin-top:1.5em;">省略</div> 省略 </div> 誤り内容を教えて下さい。 http://ryuso.info/test/ryu180_250.htm

    • ベストアンサー
    • CSS
  • CSSで文字が流れ込んでしまいます

    CSS勉強中ですが、このように組んだらFireFoxで見ると左のコンテンツより右のテキストを増やした場合に左の<div id="leftside">の領域まで文字が行ってしまいます。 clear: bothを入れるのかなぁと思いつつ、色々なところに入れてみたのですが、変らなくて・・・。 どのようにしたらいいでしょうか。 body { margin-top: 0; background: #30689D; text-align: center; } #header{ width: 760px; margin-left: auto;    margin-right: auto; background: #E2E2E2; } #container{ width: 760px; margin-left: auto;    margin-right: auto; background: #FFFFFF; text-align: left; } #wrap { padding: 0px; } #leftside{ width: 170px; float: left; background: #FFFFFF; } #photo{ width: 570px; float: left; margin-left: 10px background: #FFFFFF; } #news{ width: 570px; margin-left: 10px background: #FFFFFF; } #footer{ width: 760px; margin-left: auto; margin-right: auto; padding: 10px 0px 10px 0px; background: #E2E2E2; text-align: right; } p { margin: 0; padding: 0; } -----HTML <div id="header">ヘッド</div> <div id="container"> <div id="wrap"> <div id="leftside"> <p>1</p> <p>2</p> <p>3</p> <p>4</p> <p>5</p> </div> <div id="photo"> <p>写真を入れたいところ</p> </div> <div id="news"> <p>ここの文字をたくさん入れて下に増えるとと左に文字が流れ込んでしまいます。</p> <div id="footer">フッターく</div>

    • ベストアンサー
    • HTML
  • 画面の中央に配置しようとすると、レイアウトが崩れてしまいます(泣)

    画面の中央に配置しようとすると、レイアウトが崩れてしまいます(泣) ajaxを使用した住所自動入力フォームをあるファイルに作ったのですが、それをコピーしてもう一つのファイルにペーストし、floatでフォームを横並び配置にするところまではうまく出来たのですが、それを画面の中央配置にプロパティでしようとして、ドリームウィーバー上ではちゃんとフォームは横並びに配置されているのですが、アップロードしてブラウザで確認した時になぜか縦配置になってしまっています。どうすればきちんとフォームが横並びになって画面の中央配置にできるでしょうか? <style type="text/css"> div.exampleB table { width: 280px; margin-right: 10px; float: left; } .exampleB { position: absolute; left: 50%; width: 630px; height: 100%; margin-left: -315px; </style> <div class="exampleB"> <div align="center"> <table width="315" height="449" border="2" align="center" cellspacing="0" bordercolor="#006633"> <tr> <td width="315" height="449"><div align="center"><span class="style13"><span class="style15"><a href="/link/moto2.html" target="_blank"></a><img src="../image/dt_022_03.gif" alt="引越元のイラスト" width="290" height="200" /></span></span></div><p align="center"><span class="style13"><span class="style119"><引越<strong>元</strong>住所></span></span><span class="style119"><br /> 郵便番号:(省略) 都道府県:(省略) 市区町村:(省略) 町域(大字):(省略) 丁目番地:(省略)  建物名~号室:(省略) </span></p></td> </tr> </table> <table width="316" height="449" border="2" cellspacing="0" bordercolor="#006633"> <tr cellspacing="0"> <td width="301" height="449"><div align="center" class="style30"><img src="../image/dt_023_03.gif" alt="引越先のイラスト" width="290" height="200" /><br /> <p align="left"><span class="style123"><span class="style15"><span class="style118"><引越<strong>先</strong>住所></span></span><span class="style118"><br /> 郵便番号:(省略) 都道府県:(省略) 市区町村:(省略) 町域(大字):(省略) 丁目番地:(省略)  建物名~号室:(省略) </span></p> </div></td> </tr> </table> </div> </div>

    • ベストアンサー
    • HTML
  • float: leftで横に並べたら、サファリだけ

    float: leftで横に並べたら、サファリだけ隙間が空いてしまいます。 IEやファイヤーフォックスではピッタリ表示できています。 問題の箇所は以下です。 <div style="float: left;"> <p style="position: relative;"> <img src="./img/img-001.png" width="240" height="150" /> <br /> <span style="font-size: 12px; padding: 2px 5px 2px 5px; position: absolute; top: 130px; left: 0px; width: 230px; height: 16px; color: white ; background-color: black; opacity: 0.6;">テストテスト1</span> </p> </div> <div style="float: left;"> <p style="position: relative;"> <img src="./img/img-002.png" width="240" height="150" /> <br /> <span style="font-size: 12px; padding: 2px 5px 2px 5px; position: absolute; top: 130px; left: 0px; width: 230px; height: 16px; color: white ; background-color: black; opacity: 0.6;">テストテスト2</span> </p> </div> <div style="float: left;"> <p style="position: relative;"> <img src="./img/img-003.png" width="240" height="150" /> <br /> <span style="font-size: 12px; padding: 2px 5px 2px 5px; position: absolute; top: 130px; left: 0px; width: 230px; height: 16px; color: white ; background-color: black; opacity: 0.6;">テストテスト3</span> </p> </div> どうすればサファリの隙間を消せるでしょうか?

    • ベストアンサー
    • HTML
  • 同じ内容をフレーム分割と対象ページで異なる

    ルビーもFirefoxでも表示しようと作成しましたがIE9で下記の写真のように表示されました。 下の写真は、左側がフレーム分割の表示 右側が対象ページの内容です。 なおMACブラザーでも縦書きは、IE6のみ 1文書を除いて問題なく表示していますが。 ソース <div style="margin-left:9em;"><div style="margin-bottom:-0.6em;font-size:0.71em;">うえ</div></div> <div style="width:9.2em;float:left;margin-top:0.4em;">1駿州庵原之郡樽野</div><div style="width:1.2em;float:left;margin-top:0.4em;">上</div><div style="width:25em;float:left;vertical-align:top;">村武田甚右<sup>衛</sup>門子ニ、兄に左次右衛門</div></div> <div style="width:57em;clear:both;margin-top:0.4em;"><div style="margin-left:7em;width:9em;float:left;vertical-align:top;">額</div><div style="width:6em;float:left;vertical-align:top;"><div style="font-size:0.71em;">おなじく</div></div><div style="width:7em;float:left;vertical-align:top;">房</div></div> <div style="width:57em;clear:both;"> て、しゝのひたゐしろく、せすじ 同  <a href="javascript:gk_c1('t-03');">しゝふさ</a>のことく成</div> お分かりの方いましたら教えて下さい。 フレーム分割ページ http://ryuso.info/h/h002e5m.htm 対象ページ http://ryuso.info/h/heng2da.htm

    • 締切済み
    • CSS
  • IE6,7で画像の上に載せた文字がずれる

    HTMLなのですが、 画像が縦に3つつながって1つの画像のようになった状態で表示しようとしています。 さらに上と下の画像にはテキストを上にかぶせて表示します。 画像全体にリンクを貼ってあります。 下記のようなコードで作成した所、IE6,7でのみ、下記のバグが出てしまいました。 ・画像とテキストの縦位置のズレ ・画像間に2px程度の空白が生じる ・画像に設定したリンクが開かない 大変困っています。 どなたか原因と修正方法を教えていただけますでしょうか。 <a href="test.html"> <div style="position: relative; width: 183px; height: 265px; "> <img src="images/top.jpg" width="183" height="36" /> <div style="position: absolute; top: -11px; left: 55px;" class="font16b"> <p align="center">text1</p> </div> <img src="images/main.jpg" width="183" height="193" border="0" /> <img src="images/bottom.jpg" width="183" height="36" /> <div style="position: absolute; top: 218px; left: 4px; width: 181px;" class="font13"> <p align="left">text2</p> </div> </div> </a>

    • ベストアンサー
    • CSS
  • divタグ+CSSでのレイアウトで、Firefox, Operaで不必要な余白ができてしまいます。

    divタグ+CSSでレイアウトしようとしています。 横関係では全体がセンタリングされていて、縦関係においては、各ブロック要素間の余白がなくぴったりくっついている状態にしたいのですが、Firefox 1.0やOpera 8などを使ってレイアウトを確認すると、上下や要素間に余白が出来てしまい、なかなかうまくいきません。 以下、HTMLとCSSのソースを、レイアウトに関する部分だけ載せます。 [--HTML--] <body> <div id="all"> <div id="header"> <p>header</p> </div> <div id="body"> <p>body</p> </div> <div id="sidebar"> <p>sidebar</p> </div> <div id="footer"> <p>footer</p> </div> </div> </body> [--CSS--] @charset "shift_jis" body { margin: 0 auto; padding: 0; text-align: center; } div#all { width: 760px; background-color: blue; margin: 0 auto; padding: 0 0 20px; text-align: left; overflow: hidden; } div#header { position: relative; left: 17px; width: 717px; height: 50px; background-color: yellow; margin: 0; padding: 0; text-align: left; } div#body { position: relative; left: 17px; width: 522px; height: 200px; background-color: lime; margin: 0 0 2em; padding: 0; text-align: left; float: left; } div#sidebar { position: relative; left:32px; width: 180px; height: 200px; background-color: red; margin: 0 0 3em; padding: 0; float: left; } div#footer { position: relative; left: 17px; width: 717px; height: 100px; background-color: fuchsia; margin: 0; padding: 0; clear: both; } ---------- marginやpaddingを"0"にしているにもかかわらず、余白が生まれてしまうのはなぜなのでしょう・・?

    • ベストアンサー
    • CSS
  • text-alignの解除の方法

    text-alignの解除の方法ってありませんか? 例えばhtml内に以下のタグがあるとして、 <div style="text-align:center;"> <div style="width:100px; height:120px; background-image:url(○○○.jpg)"> <div style="width 50px; height: 60px; position:absolute; margin-top: 20px; margin-left:5px"> <p>あいうえおあいうえお</p> </div> </div> </div> このような場合に<div style="width:100px; height:120px; background-image:url(○○○.jpg)">から、対応している</div>のtext-alignを解除する方法ってありませんか? IEの標準には対応するのですが、互換だとブロック要素までもがセンタリングされてしまうため困っています。 分かりづらくて申し訳ありません。

専門家に質問してみよう