html・xhtml&cssを勉強している初心者です。約2週間位前から同じ宣言文でソースを入力していたところ、以前と同じ宣言文で打ってるにも関わらずcssのソースどうりいかなくなりました。宣言文を消去するとソースどうりに出来ます。PC DEPOTの方に問い合わせしたところ、HTML4がHTML5に自動的にバージョンアップしてのが原因で打つ手がないとの事でした。 どなたか解決の方法をご存じでしたら是非お教え下さい。よろしくお願い致します。

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

A 回答 (10件)

度々…以下略


私も完全独学でここまで学んできましたので、多少なりとも誤った考えを持っている事は否めません…
でも自由にレイアウトして自分の作りたいとおもう物を形にすることくらいは出来ると自負できます。
わざわざ参考書を買い替える必要はないと私は思います。
まぁたまにおかしな参考書もある事も事実ですが…
(いくらHTMLだけの参考書だとしてもタグを同一ページでの説明中に大文字小文字を織り交ぜて説明したり…)
この際初心者ですのでHTMLとXHTMLの違いは
簡潔に空要素の閉じ方とタグを全て小文字で書く(DOCTYPE等は別)これだけの違いだと認識下さい。
(多少偏ってますが…)この位の違いです。初心者ですと
空要素とは…<br>改行やhead内部に書くmeta>等が空要素(終了タグが無いものと思って下さい)
これらはXHTMLでは、<br />、<meta........... />と字を打ち終わったら半角スペースと/を入れて閉める。
あとはタグは必ず開始タグで始まり終了タグで終わる。こう言う文法上のお約束を守る。
参考書で仮に開始タグが有って終了タグがなく、空要素でもない場合は記述ミスと捉えて下さい。
結構今見ると私も参考書を買いあさるほうなんで凄い滅茶苦茶な参考書もあります…
HTMLのものですがね。XHTMLでは適当(HTMLでは問題が無くてもこっちはダメ)は許されません。
まぁ文法的におかしいと思う物は間違っているという事です。はじまりが有れば終わりがある。
この3点をまず気にかけて作っていくと難しいレイアウトとかを使わない限り普通に表示できる物は作れます。
どんな環境でタグ打ち練習してます?
私はホームページ全盛期後半(2004年頃)に其の当時有名だったジオシティーズというところで
参考書片手にHTML、CSS、JavaScriptを学びました。あそこが無ければ続いていなかったと思います。
理由は初心者がいきなりWINのメモ帳で作ってアップロードして表示されない…では
どこをどうすればよいかさっぱりだからです。
ジオシティーズでは、ページ内で使う画像をいきなりアップロードしないと使えないという
いきなりハードルを上げる事はあるにせよ、サーバー内でホームページを作成する利点として
随時プレビュー機能をつかってその都度現状を確認しながら作っていける利点があります。
その際ジオシティーズの簡単機能は使わず、「自由にホームページを作る」の処を使い
そこに入るといきなりポップアップで出るジオクリエイターも使わず(使いづらい)それを消して
画面下部のファイルマネージャーを開くから自分に与えられたディレクトリを開いて
新規にページを参考書片手に作って行く事をお勧めします。
そうして逐一チェックしながら作って行く事でちゃんとタグを打てているか、間違ってるかがすぐわかります。
そうして確認しながらまず普通に運営できる物を作ってみる事をお勧めします。
それからそれを外部CSSとして再編したりJavaScriptを無意味に取り入れてみたり(こういう練習は重要)
JavaScriptにかんしては、画面写真が載ってる「こういう事をする」という感じで書いてある物で最初は良いですが
たまにそのプログラム丸映しでも全く機能しない場合があります。こっからは別の参考書を買ったり、
ネットで調べまくったりして身につける。
過去のほーむぺージ作成全盛期のおかげでかなりの量のHTML、CSS、JavaScriptはたまたCGIプログラム
CGIプログラムとはサーバー機能をつかって情報のやり取りをする仕組みの事です。
言語的には何でもCGIできます。Cだろうが++CだろうがperlだろうがPHP、Ruby、Javaその他諸々…
話がそれましたが、いろいろな参考サイトで親切サイトが多いので、ある程度タグ打ちの基礎と要点をふまえたら
逆にネット検索で「あれがしたい」と検索すると沢山出てきます。
そして良いサイトが有ればかたっぱしから「お気に入り登録」なるべく何を調べるのに良いかを
名前を変えて設定しておくと後々見ると参考になります。
余り沢山のサイトをお気に入りにすると「これなにしにお気に入り??」という事が後からみた事によりおきます。
書き過ぎましたのでこの辺で…
それでは頑張って下さい。
    • good
    • 0
この回答へのお礼

abacabu様 何度もご親切にご指導有難うございました。 ご指導のメールで超初初心者ですのでまだ
理解出来ない言葉等ありますが、一つ一つ調べながら向上して行きたいと思います。また、何かの時はご指導頂けたらと図々しく思っています。 今回は本当に有難うございました。

お礼日時:2011/04/14 21:08

度々失礼します。


私の回答間違っていたみたいですいません…
DOCTYPE宣言について簡単に書きます(XMLと一緒だとして)
素人ですのであれですが…
まずDOCTYPEとはタグに意味と使い方を指定する物です。
<table>を例にとると(今は非推奨ですが…)
<table>というタグはテーブルの最初に使うタグです。
その中には<tr>や<th>や<td>を入れて使います。
<tr><th><td>は複数個出てきても良いですが、
<table>タグはこのタグの下に複数出て来てはいけません。
等…
こう言う事をW3Cという団体が標準書を作っていてそれを外部リンクで
貼りつけているという様に解釈して頂ければわかり易いと思います。
様はCSSを外部リンクで反映させている様な感じです。
XMLではそれぞれ使用者がタグを定義して使います。(本当にちょっと齧る程度です…)
で、ですが、その宣言の種類によって、使えるタグ、非推奨になったタグ、
使えなくなったタグがあります。特にHTML5では結構増えてますし。
まぁ色々な種類がありますのでどういうサイトを作りたいか、
そしてその為に必要なタグは何か、それによって
旧バージョンを使っても良いと思います。新しいから良いという訳でもないですし。
ある意味HTML(XMLでもですが)の一番重要な部分と言えます。
フレームを使いたいのにXHTML1.1を使ってはフレームが使えません。(確か…)
私も最初の頃は同じようにやっていたのですが、たまになんか不具合が起きたりしました。
私も参考書片手に独学でやっていたので、ちょくちょく記述ミスがありました。
たまに全角半角間違えてそれがなかなか見つからなくてループ状態で気が狂いそうになったり…
(相当アホですが…)
今一度しっかりとタグを見直してみる(CSSもふくめて)事をお勧めします。
案外記述ミスが有ったりする事もありますから。
    • good
    • 0
この回答へのお礼

abacabu様 何度もご指導有難うございます。正直これからどのように勉強していこうか迷っています。
とりあえずhtmlを基礎からまたやり直そうと思います。本屋さんに行くと殆どxhtml/htmlという本が
多く、何冊も購入しましたがこれからはhtml/cssの物を探そうと思っています。度々お忙しいのに
ご親切にお教え頂き本当に有難うございました。

お礼日時:2011/04/14 08:08

横から失礼。



過去モードと標準モードでレンダリングが変わります。
ブラウザによっても変わります。

<?xml version="1.0" encoding="Shift_JIS"?>
このXML宣言が有る事によって古いIEブラウザでは、
標準モードなのに過去互換モードとして解釈されます。
また、DOCTYPEが無い場合と、
後半の部分のURL「システム識別子」が無い場合も過去互換モードになります。
更に、IEでは互換性を変更する仕様もあります。

この辺を理解していないと、
autoが効かない = センターリング出来ないとか、
幅が違う = カラム落ちするとかになり、困惑します・・・

----------------
対処法としては、
1、XHTMLでのDOCTYPEスイッチを理解する。
2、標準モードで書く(XHTMLでなくても良い)
3、XML宣言をわざと書かない。
4、標準モードでも過去互換モードでも同じ表現になるCSSで書く。
5、ハックを使う
6、ブラウザを変更する(古いブラウザを無視・サポート外)
7、それ以外のCSSでの因果関係があるかもしれません。
8、諦める
などなど他にも選択・方法があり、人によって方法や選択肢が違うが、
適当にやると更に別の問題も発生します・・・
#6.7回答では、XHTMLstrictだからとかmarginのショートハンドなどを問題視されているようですが、#6.7さんには失礼ながら全く問題無いので、誤解されないように。

また、先の画像のセンターリングだけの話なら、display: block;もautoも不要です(ケースバイケースでは使いますが)
<p style="text-align:center;"><img src="photo.jpg" width="400" height="300" alt="海の風景" /></p>

この回答への補足

naokita様 ご指導有難うございます。対処法の1、2、を検討中なんですが、なにせ超初心者ですので
とにかく最初は購入した本のとうりソースを打ち覚えようと思っている時に「auto」が反応せず質問させて頂きました。本のとうりの画面が出ないと次に進めず何日も悩んでいる次第です。
<p style="text-align:center;">も試して中央に移動しましたが、本の後半の複雑なソース(私にとっては)になるとやはり本のとうり「auto」で処理した方が未熟な私には好都合ですので悩んでいます。今はとりあえずhtmlを最初から勉強し、DOCTYPE宣言を理解しようと思っていますが。(正直難しいです)本当にご親切に有難うございました。 

補足日時:2011/04/13 16:13
    • good
    • 0

たびたび…以下略


記述的には何らまちがってはいないとおもうんですよね。
個別設定するなら4段にしないで、1まとめにしてみては?
margin:20px auto 20px ←値は半角スペースで区切ります。
としたらどうでしょうか?
何となく2個のautoが喧嘩する訳は無いのですがちょっとひっかかりまして。
ちなみに
値1個→「上下左右」
値2個→「上下」と「左右」
値3個→「上」と「左右」と「下」
値4個→「上」と「右」と「下」と「左」
もう私の少ない知識では厳しいですね…
こう言うたわいもない変更で案外まともに表示される場合もあります。
    • good
    • 0
この回答へのお礼

abacabu様 何度もこの超初心者の疑問点にお答え頂き本当に有難うございました。 ご指導どうり色々やってみます。 有難うございました。

お礼日時:2011/04/12 22:29

またまた失礼します。


恐らくですがautoがキックされたというよりは、XHTMLstrictだった事に問題があるとおもいます。
XHTML1.0でもTransitionalとFramesetだと以前のHTML4.01どうようにアバウト表現と
タグに関しても使えるのですが、strictですと結構使えない属性、要素というのが存在します。
それにたまたまautoが付いていた事に起因するのではないかとおもいます。
autoが効かないのではなくそれをしていした要素に問題があったのではないでしょうか?

この回答への補足

abacabu様 何度も有難うございます。下記のソースを本(xhtml/html+css)のとうり以前の宣言文で打つと:auto;が反応せず質問箱でお教え頂いた宣言文を入力した結果センターに移動しました。
略して書きます。
xhtml
<div>
<img class="imgcenter" src="photo.jpg"
width="400" height="300" alt="海の風景" />
</div>
-----------
css
.imgcenter {display: block;
margin-left: auto;
margin-right: auto;
margin-top: 20px;
margin-bottom: 20px;}
です。よろしければまたお教え下さい。よろしくお願い致します。

補足日時:2011/04/12 16:27
    • good
    • 0

度々失礼します。


<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1--strict.d …
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
上記宣言文に不都合な個所が御座います。
下の回答にもありますが
最後のxhtml1--strict.dtdはxhtml1-strict.dtdです。
XHTMLで書く以上記述は正確に!!
あとどういう参考書を読んで書いておられるかわかりませんが、
HTML4.01からXHTMLへの移行に関してだけ言えば
タグの閉め方が変更されて、HTMLでは許されている
閉めタグ</html>これは省けませんが省ける物がありますが
XHTMLにおいては省く事ができません。
結構HTMLとCSSを独学で学んでゆくと
かるーく、HTMLでつくってCSSで色々デザインを作りこんでゆく
様な錯覚を起こしがち(私は以前そうでした)が
根本のHTMLの宣言と、それにマッチした記述というのが
とっても重要です。
前の回答でも書きましたが、
HTMLとXHTMLは基本的に使用方法が違います。
HTMLは思っている通りの使い方ですが、
XHTMLではさらにXMLというプログラム言語で
記述する事が出来ます。
これがXHTMLの利点だと思います。
といっても私もさっぱりXMLはわかりません…
JavaScriptはすこーし使ってページを作ってます。
後最近CGI(perl)の勉強をしてます。
簡単に言います。
HTML4.01がHTML5になった訳ではございません。
新たにHTML5という物が増えたに過ぎません。
そして、XHTML1.0で記述している限りは、そのXHTML1.0の
W3Cにおいての仕様変更が無い限り(タグの削除等)
そのWEBページに何ら影響を与えるものではありません。
どういう方法で勉強されているかわからないのでなんともいえませんが、
CSSのほうで、同じたとえばbodyに対する要求が2こあるとか・・・
なんか変なところはございませんか?
色々追加して行くうちにこうなったとか…
それくらいしか原因が思い当たりません…

この回答への補足

abacabu様ご親切にご回答有難うございました。ノートPCの方は<!DOCTYPE HTML PUBLIC "-//W3C/
/DTD html 4.01 Transitional//EN">に直したところうまく表示されました。以前は先の宣言文で表示されていましたが、どうもよくわかりません。 それとこの宣言文ですと{---: auto;}が反応しませんのでどうしたらいいか迷っています。色々有難うございました。

補足日時:2011/04/12 11:56
    • good
    • 0

うん? DOCTYPE 中


xhtml1--strict.dtd
って書いてあるように見えるんだけど, ハイフンは 2つなんだっけ?

この回答への補足

Tacosan様 ご回答有難うございました。今回お送りした宣言文は別のファイルのをコピーして送りました。確かにハイフンは2つありました。スイマセンでした。不具合の起きてるノートPCはハイフンは1つでした。まぎらわしいメールをお送りして申し訳ありませんでした。またご回答有難うございました。

補足日時:2011/04/12 09:35
    • good
    • 0

No,2です…ちょっと補足しておきます。


HTML5はどちらかというとXHTML5と言っても良いほど
XHTMLよりな物の様ですね。
一応HTML4からHTML5への違いの日本語サイトがあったので
リンク貼っときます。
一応ページ作るならこういう項目も読んでおいて損は無いです。
タグも結構変わってるみたいですし(現状??今後の発展???)

参考URL:http://standards.mitsue.co.jp/resources/w3c/TR/h …

この回答への補足

aoumiushi様.abacabu様 ご親切にお教え有難うございます。DOCTYPE宣言は下記のようにしています。現在このメールはデスクトップ型のPCでお送りしていますが、もう一台のノートPCで不具合が起きています。最初デスクトップの方もうまく表示されなかったのですが、色々やっている内に表示される
ようになりました。(原因はわかりませんがソースの打ち間違えではないようです)ノートはビスタでデスクトップはXPの違いだけですが、なぜだかわかりません。もう少しご指導頂いたとうりやってみたいと思います。
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1--strict.d …
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
本当に有難うございました。

補足日時:2011/04/11 23:02
    • good
    • 0

趣味でWEBページを過去に作成していた者です。


まずお使いのブラウザはなんですか?
(IE?firefox?safari?opera?Google Chrome?)
仮にIEだとして6と7辺りでしたっけね…不具合もありますね。
あとどの宣言で書かれているかによっても違います。
HTML4.01?HTML5?
私も余り違いを理解していない部類ですが
XHTML1.0?XHTML1.1?XHTML2?
どれをお使いですかね?
HTMLはある程度適当でも案外まとまりますが、
XHTMLは記述的にかなりの正確性がないと上手く表示されません。
良く有る文法チェッカー等を利用すると初心者さんだと楽かもしれません。
ちなみに…タグの手打ちですかね。
HTMLはプログラム言語でないので、(最初は案外上手くいきませんが)
まずはXHTMLで文法的な勉強をされた方が良いと思います。
恐らく上手く表示されないのはタグの打ち間違いか
XHTMLで作成の場合、HTMLでは表示されるようなミスがある場合。
あとはブラウザで単に不具合がある場合等状況は考え出すと様々です…
どういう「タグ」がお使いの「ブラウザの種類とバージョン」で上手く表示されないのかが
案外ミソな場合もありますので、補足お願いします。
余りブラウザで左右される事は少ないのですが、たまに上手く表示されないタグも
ありますので…
あと一応各種ブラウザに対応させるとなるとXHTMLでしっかりとした文法で書いた方が
不具合は少ないらしいです。(当然ブラウザ毎にチェックする必要はあり)
どこまで作りこむかわかりませんが、
みる人みんなにちゃんと見てほしいという場合ですと、各種ブラウザを
インストールする事をお勧めします。
IE(普通はこれですかね?)、それともMacOS?(これはWinでは無理かな…)、
safari、firefox、opera、Google Chrome辺りは無料ダウンロードできます。
以外にサファリとか、ファイヤーフォックスとか使ってる人いますので、
IE、firefox、safari位でもいいので見比べて作ってみても良いと思います。
初心者作成サイトだと、見るも無残に表示が違うはずです…
まぁ企業サイトでもない限りIE向けにしか作られていませんが…
えっと、後別にHTML4.01がHTML5になったからってそれ程変化は無いと思われます…
HTML5の構文を私はみていませんが、大概違うというのはタグが使えなくなったり
復活したり、同様の働きをする新しタグが出来たり(みた事無いですが…)
こう言った変化位ですので同じバージョン(HTML4からHTML5)での変化でそんなには違いは無いと思います。
後厳密に言うとCSSも私の作ってた時期で(数年前)バージョンが1から3がありました。
どう違うかは・・・知りませんww
    • good
    • 0

DOCTYPE宣言に<!DOCTYPE html>と記述していませんか?


これだと5.0になるみたいです。
4.0の例で以下のものがあります。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

他にもあるので参照を参考になさってください。

参考URL:http://www.animegif.net/tips/html/doctype-html-p …
    • good
    • 0

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


人気Q&Aランキング

おすすめ情報