• ベストアンサー

style要素について

Webページの作成においてスタイルシートによるレイアウトしています。スタイルシートでレイアウトを指定する時<head>タグ内に記述しますが、以下を見てほしいのです。 (1) <style type="text/css"> ~~~ </style> (2) <style type="text/css"> <!-- ~~~ --> </style> (1)と(2)を比較するとどちらの記述方法が適しているのでしょうか? また、"<!--"と"-->"は無くても正しく反映されるのでしょうか? 後は、"<!--"と"-->"は本当に必要なのでしょうか? 補足)HTML4.01 Transitionalで標準準拠モードです

  • HTML
  • 回答数2
  • ありがとう数2

質問者が選んだベストアンサー

  • ベストアンサー
  • STICKY2006
  • ベストアンサー率29% (1536/5269)
回答No.1

後者。 2番ですね。 Webページに関しては、不特定多数の人がそれぞれバラバラの環境で見ています。 その際に1番と2番の方法ではそれぞれ違う症状が起こる可能性があります。 1番の場合ですが、「スタイルシート」が対応しているブラウザで閲覧する文には問題ないです。 しかし、対応していないブラウザで閲覧する方ももちろん存在すると思います。 不特定多数の人。。。ですから。 その際に<!--~~-->が必要となってきます。 <!--~~-->のタグは、HTMLの意味するコメントタグです。 ですので、もしもスタイルシート未対応ブラウザであっても、コメントしてあれば表示されないです。 もしも、コメントタグがない&スタイルシート未対応ブラウザの場合、<Style>~</Style>の中身はブラウザに全て表示されてしまいます。 それを考えると、ほんの少しのコメントタグ。入れておいたほうが安全です。 ちなみに、コメントタグがなくても、正しく反映されるはずですよ。 スタイルシート未対応ブラウザのことは知りません!責任取りません!見ないでください!という心意気でしたら入れなくてもいいと思いますが、入れてもそんな手間ではないと思いますので。。。

beaper
質問者

お礼

回答ありがとうございます。 コメントタグですか、呼び方が分からなかったので教えていただきありがとうございます。 確かに閲覧環境を配慮するとそのようにした方がいいのですね。

その他の回答 (1)

  • Ikonos00
  • ベストアンサー率28% (86/302)
回答No.2

どちらでも、反映はされますが、 表示する側がスタイルシートに対応していなければ、 中身が表示されてしまうので、 (2)のようにコメントアウトした方が良いと思います。

beaper
質問者

お礼

回答ありがとうございます。 最近の新しいWebブラウザだとどちらでも反映されるとみなしても大丈夫、といったところでしょうか。 スタイルシートに対応していない場合、中身が表示されるというのはできれば避けたいですね。ご意見ありがとうございました。

関連するQ&A

  • スタイルシート

    こんばんは。HPを独学で作っている超初心者です。 スタイルシートが反映してくれないのです。下記の記述で 何が違うのでしょうか??? ---01.css--- <sytle type="text/css"> a:link{text-decoration:none;} <style> ---index.html(抜粋)--- <head> <link rel="stylesheet" href="01.css" type="text/css"> </head> どうしても index.html のリンク部分に下線が出てきます。 どうして消せないのかが分かりません!!! どなたか教えてください!よろしくお願いいたします!

  • <Style>~</Style>

    <Style>~</Style>を使いたいのですが、 使い方として以下の注意書きを見ました。 </head>タグの直前に<Style>キーワード</ Style> をコピー&ペーストしてください。 CSSは詳細なレイアウトであって文字は入れられるかどうか知りたいのですが。 多分入れられないと思うのですが。 例えば「あけましておめでとう。」の文字を <head> <style type="text/css"> <!-- div{color:#f00} -->あけましておめでとう。 </style> </head> とかできるかどうかと思ったので。 上記の意味として <head>~<Style>単語</ Style></head>で使い方はあっているのでしょうか。

  • スタイルシートの設定

    スタイルシートをリンク設定したく、文頭に下記の記述をしました。 ++++++++++++++++++++++++++++++++ <html> <head> <link rel="stylesheet" type="text/css" href="styles.css"> </head> <body> ++++++++++++++++++++++++++++++++ まったく、反映されません・・ どうして何でしょうか? どなたかお助けください。

  • スタイルシート2

    1.スタイルシートで、外部スタイルシートがありますが これはそんなに使い勝手がよいでしょうか? <link rel="stylesheet" type="text/css" href="style.css"> と記述する上で、これはルールですからしょうがないでしょうが、<link rel="stylesheet" type="text/css" とここで、stylesheetを指定していて、さらにtext/css" でも、”スタイルシート”ですよ!! といっているのですから、最後のhref"URL"後のstyle.css の記述は無駄になるような(くどい^^)気もします。 これは、しょうがないですよねー。 個人で使うなら、HTMLで充分なような・・ あと、埋め込みスタイルでよういような・・ 2.さらに、スタイルシートはたしかに軽くなりますが、 記述が面倒で、フルスペル(省略できない)。 HTMLでは、<Li></LI>や、<tr></tr>で 表示できますが、こちらはすべて書かなくてはならないので便利とはいえ、つかいやすいでしょうか^^ リンクできるのは、見やすく便利ですが・・・

  • スタイルシートに関して教えてください!本当に困っています!

    超初心者で悪いのですが、スタイルシートの記述方法がよく分かりません。確か記述方法は3つあると思うのですが、CSSファイルを利用して記述する方法が分からない(できない)のです。ここからは実際に自分が今使っているホームページ作成サイト(初心者)に書かれていて理解できない(実際にやってみたがうまくいかない)所をここに書きます。 3、CSSファイル利用により記述する方法 テキストエディターで”スタイルを適用する対象名 { ~ }”として記述し、 ファイル保存するときに、拡張子が”.css”というCSSファイルを作ります。 そして、HTMLファイル内にはCSSファイルを参照しなさいという指示である、<LINK href="CSSファイル名.css" type="text/css" rel=stylesheet> をヘッダー部分に記述します。 << CSSファイルデータ例(下記のデータだけを記述して.cssファイルを作成 >> < ファイル名=style.css > p { color:blue } << HTMLデータ例(.cssファイルと同じフォルダ内に作成する) >> <html> <head> <LINK href="style.css" type="text/css" rel=stylesheet> </head> <body> <p>スタイルシート</p> </body> </html> << ブラウザ表示 >> スタイルシート 分かりずらかったらここを参照してください。(たぶん削除されると思うが) http://homepage-how.com/hp/hp-css2.html まず、3に書いてあるとおりにCSSファイルを作成しました。 次からがよく分からないのです。3に書いてあるとおりにHTMLファイルを作成しようと思ったのですが、なぜか、ホームページの基本構造ではないのです。 こういう事です   ↓ <html> <head> <LINK href="style.css" type="text/css" rel=stylesheet> </head> <body> <p>スタイルシート</p> </body> </html> 見ても分かるとおり、タイトルの部分がないのです。 タイトルがなくても良いのですか? あと、このHTMLデータを.CSSファイルと同じフォルダ内に作成するという意味が分かりません。 本当に超初心者で悪いのですが、本当に困っています。誰か分かりやすく教えてくれる方はいないでしょうか?お願いします。

  • CSS今度は外部ファイル!

    前回「CSSが反映されない」で質問させていただきました。 おかげさまで、ヘッダー内で記述したものが、反映されるようになりました。 ところで、今度は外部ファイルの読み込みで「できない!」となっています。 自分ではどこがいけないのか、発見できなかったので、また皆さんのお力をいただきたいと 思います。 ○abc.css(外部ファイル) .body{ color:#006666; font-size:30px; } ○HTMLファイル <! DOCTYPE PUBLIC HTML "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html;charaset=shift_jis"> <meta http-equiv="Content-Style-Type" content="text/css"> <style type="text/css"> <!-- <link rel="stylesheet" href="abc.css" type="text/css"> --> </style> </head> <body> 背景色は濃い青緑です<br> フォントサイズは30px・・・<br> <br> になるはずです・・・ </body> </html> ・・・結果・・・ 真っ白な画面に標準フォントで表示。 ○外部ファイル .hp-name{ font-size:55px; color:#006666; text-align:center; } ⇒ファイル名 hp-name.css ○HTMLファイル <! DOCTYPE PUBLIC HTML "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type"Content="text/html;charaset=shift_jis"> <meta http-equiv="Content-Style-Type" content="text/css"> <style type="text/css"> <!-- <link rel="stylesheet" href="body.css" type="text/css"> --> </style> </head> <body> <div class="hp-name"> HP名は「○○△△◇◇」です </div> ////////////////////////////////////////////////////////////////////////////////////// 今度はどこがいけないのでしょう。 <link rel・・・・・・・・ で、外部ファイルを読み込むだけではいけないのでしょうか? それとも、外部ファイルの書き方がいけないのでしょうか? 外部ファイルには「スタイルシートの部分だけ」記述すればいいと思っていたのですが・・・ ○外部ファイルを <style type="text/css"> <!-- --> </style> をつけてみたのですが、ダメでした

  • スタイルシートのタグの入る部分

    タグの本を読んでいたのですが、スタイルシートが推奨されるそうです。 私も使いたいんですが質問があります。 (背景) <STYLE type="text/css"> <!-- BODY { background-image : url(""); background-attachment: fixed; background-position: 100% 100%; } --> </STYLE> 一応HTMLの<body>タグの中に書いているのですが TEXTの場合 <STYLE TYPE="text/css"> #left {text-align:left;} </style> <body> <p ID="left">字</P> </BODY>  スタイルシートの<STYLE TYPE~>から</BODY> をそのままHTMLの<BODY>タグの中に貼り付けて良いんでしょうか? 個人的には<body>タグの中にまた<body>タグ!? もしかすると<STYLE>タグは<HEAD>タグの間に ソースの<BODY>タグの中身だけHTMLの<BODY>に貼り付けるのでしょうか?  もう一つ、先の背景と文字のスタイルシートを同時に使う場合 <STYLE>の中に背景と文字を一緒に書いていいのでしょうか? 自分としては<STYLE>タグが分かれているとバグらないか不安なんです。 まとめると (1) <HTML>   <HEAD></HEAD>   <body>      <STYLE>ソース(中に<BODY>タグがまだ入っている)</STYLE>   </BODY>   </html> で良いのか? (2)HTML>   <HEAD>  <style>~</style>の部分  </HEAD>   <body>      <STYLE>ソース<BODY>タグで囲まれた部分   </BODY>   </html> (3)二つのソースがあった場合   <style> ソースA と ソースB </STYLE>   <BODY>  ソースA ソースBのbody部分  </body> まとめて良いのでしょうか? ps まとめても、分けても WEB上にアップして見ても    普通に表示できました、でもどれかが無茶な(無理の、無駄のある)    文法だと思うんです。 解りづらい説明かと思いますが、アドバイス頂けませんか?

    • ベストアンサー
    • CSS
  • HTMLとスタイルシートのタグの違い

    Webサイトを作りを始めたばかりの初心者です。 私は、スタイルシートを使うにはheadの部分に次のタグを埋め込むことを知りました。 <link rel="stylesheet" href="style.css" type="text/css"> また、「style.css」というファイルを「index.html」とは別に用意することも知りました。 そして私はWebサイト作りのために、まずはhtmlだけを記述し、その後にスタイルシートを使ってデザインをしようと思うようになりました。 そこで、htmlとスタイルシートのタグの違いを把握するために、次のスタイルシートの一覧表を確認しました。 http://www5.airnet.ne.jp/tomy/knowhow/stylepty.htm この一覧表では、COLORやFONTなども含まれておりますが、このタグは「style.css」のファイルを用いなくても「index.html」のファイル内だけで使用することでWebサイト内にある文章などの色やサイズを変えられるはずです。 そのため、HTMLとスタイルシートのタグの違いがわからなくなり、htmlだけを記述するということが難しくなってしまいました。 デザインを考えずに、まずはhtmlだけで全体を記述する場合、デザインの境界線は何なのでしょうか? 改行を指定する<br>もデザインに含まれるのでしょうか? 質問が漠然としているかもしれませんが、何でも良いのでいろんな人からのアドバイスを頂きたいです。

    • ベストアンサー
    • CSS
  • DreamWeaverMXでスタイルシートを使わない方法

    DreamWeaverMXを使用しています。 文字に色をつけたり大きさを変えたりするときに、自動的にスタイルシートでタグが入力されてしまいます。 例えば赤文字にしたときに <font color="red">赤い文字</font> こうしたいのに <head> <style type="text/css"> <!-- .style1 {color: #FF0000} --> </style> </head> <body> <span class="style1">赤い文字</span> </body> こういうタグが入ってしまいます。 これをHTMLだけのタグがはいるようにしたいのですが、そういう設定方法はないでしょうか? ご存知の方がいましたらよろしくお願いします。

  • 普通のタグとSTYLEは混用できるでしょうか?

    教えてください。XP HOME EDITION OFFICE 2003です。 縦書きやダウンロード方法などでお世話になっております。 私は「メモ帳」でHTMLソースを書いています。 テキストは秀和システムの「ダイアログさん著」です。 別の本でCSSとかSTYLE というのを知りましたがよく分かりません。ただ、STYLEでは、使いたいな、と思う機能が紹介されています。そこで質問。 <質問1> 普通の<>タグと<STYLE>とは混用してよいのでしょうか? <質問2> 意味が分からず、お呪いのように下記のタグを書き込んでいます。 書き込んでいるものと居ないものを自作のHTML相互にリンクさせても支障はないようですが、どのように扱ったら良いのでしょうか。 お願いします。 ******************************* 次のファイルは意味の分からないデッドコピーです。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML><head> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css">

専門家に質問してみよう