- ベストアンサー
CSSファイルを指定したら元のHTMLファイルが破損してしまった！初心者が失敗してしまった理由とは？
- 初めてCSSを使うものです。いままでは、ワードとかからHTML出力していましたが、今回初めてコンポーザーでHTMLでシンプルに作っていました。CSSをまともに作り始めたのは初めてです。で、HTMLからCSSを指定すると元ファイルが壊れました。どこが悪いのでしょう。すみませんがアドバイスお願いします。
- CSSファイルを指定したらHTMLファイルが壊れてしまう問題に遭遇しました。初心者の私は、今までワードからHTMLを出力していたのですが、今回はコンポーザーでシンプルなHTMLを作成しました。CSSを使うのも初めてだったため、どこが原因なのか分かりません。アドバイスをお願いします。
- 初めてCSSを利用したところ、HTMLファイルが壊れてしまいました。これまではワードからHTMLを作成していたのですが、今回はコンポーザーを使用してシンプルなHTMLファイルを作成しました。CSSを正しく作成するのは初めてだったので、どこが間違っているのかわかりません。アドバイスをお願いします。
- みんなの回答 （5）
- 専門家の回答
質問者が選んだベストアンサー
私も HTML と CSS を勉強中で、昔おなじことに相当悩みました(^_^) 最近は《UTF-8》が一般的なそうなので、まずは <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> を <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> に直します。 そのうえで、《UTF-8N》という文字コードに対応したエディタを使います。つまり、《content="text/html; charset=UTF-8" /》で作成したウェブページを、《UTF-8N》形式で保存するのです。『メモ帳』は、こうした細かい設定ができないために文字化けするそうで、私も失敗しています。 なお、そのときは下記の過去質問とエディタが役に立ちました。このエディタは、《タグ入力補完機能》があるので便利ですよ。 ◆shift_jisとutf-8 | その他([技術者向] コンピューター)のQ&A【OKWave】 http://okwave.jp/qa/q3178822.html ◆HeTeMuLu Creator - Hosiken Labs http://hosiken.jp/dev/hetecre/
その他の回答 (4)
- DrFell
- ベストアンサー率55% (305/551)
>＞UTF-8の文書であるのに 恐れ入ります、どこからUTF-8ってわかるのでしょうか？ イトヘンの文字化けはUTF-8をS-jisで見るときに起こる文字化けの特徴ですので、そうじゃないかと。 理由などを説明すると長くなるのですが、charsetでよく起こる文字化けは変化と文字化けでググれば簡単に情報が得られますよ。ちょっとだけ捜したのですが一覧としては見つけられませんでした。 https://twitter.com/hadsn/status/299246035547586560 他にも?だらけとか％、菱形……とそれぞれに特徴があるので、興味があればググってください。
- ORUKA1951
- ベストアンサー率45% (5062/11036)
CSSには関係ありません。 保存した文字コードと開くときの文字コードが違うだけです。 具体的には、UTF-8で保存して、Shift_JISで開くとそうなります。 任意の文字コードで保存、開くができるテキストエディタ(EmEditror http://jp.emeditor.com/ )などでお試しを!!
お礼
＞具体的には、UTF-8で保存して、Shift_JISで開くとそうなります。 参考になりました。 コンポーザーで試してみて、 2つ目のツールとしてEmEditror使ってみます。 もうひとつシンプルなエディター欲しかったので。 回答どうもです。
- DrFell
- ベストアンサー率55% (305/551)
UTF-8の文書であるのに、Shift_JISであるとメタタグで記入している事による文字化けだと思います。 ★shift_jisで保存するか ☆<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> を <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> に直す。 どちらかの☆で解決すると思います。
お礼
ありがとうございます。 ＞UTF-8の文書であるのに 恐れ入ります、どこからUTF-8ってわかるのでしょうか？ ★shift_jisで保存するか ちなみにこちらで保存すると文字が化けたまま保存されてしまいます。（メモ帳で開いても） 大変参考になりましたが、さらに疑問が出てしまいました。 よかったらよろしくご指導のほど。
- tracer
- ベストアンサー率41% (255/621)
疑問におもうのは、 ・なぜ文字化けしてるのでしょうか。 ・「壊れる」とは一般的ではない言葉ですが、具体的にどういうことを指しているのでしょうか。 の2点です。 おそらくほとんどの人が何を言ってるのか分からないと思います。
お礼
すみません。よくあることなのかと思い少しはしょりました。 元のHTMLファイルで <link rel="stylesheet" href="style.css">を指定したところ その元のHTMLファイルをコンポーザーで開くと上記のようなソースが出てきて 困ってました。 しかし今元のHTMLファイルを、メモ帳で開くと文字化けおよびタグ化けは綺麗です。 コンポーザーと元のHTMLファイルの関係で文字化け等が発生しています。
補足
メモ帳で開くと <!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"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta name="keywords" content="LM386,ミニアンプ,モニターアンプ,電子工作,ダイソーのケース"> <meta name="description" content="ダイソーのケースを使ったミニアンプ"> <link rel="stylesheet" href="../style.css"><title>シンプルLM386モニターアンプの製作</title> </head> <body> <h1>シンプルLM386モニターアンプの製作</h1> <h2>電子工作の超定番LM３８６アンプを製作いたしました。</h2> <h2>簡単なアンプを製作してみよう。</h2> <h2>概要</h2> 以下略 コンポーザーで開くと質問のとおりです。 style.css適用前には起こらなかったことです。 他のHTMLファイルをコンポーザーで開いても文字化けは起こりません。
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/images/related_qa/c205_2_thumbnail_img_sm.png)
お礼
なんだかわからないけれど、 CSSもしくはHTMLどちらかにSHIFT＿JISが書かれていて、一度適用すると文字化けが直らないです。 おっしゃるとおりUTF-8でHTMLを指定したら回復しました。 （CSSもUTF-8にしました） なんだこれ。ですが、とりあえず作業先に進めそうです。ありがとうございます。