OKWAVEのAI「あい」が美容・健康の悩みに最適な回答をご提案!
-PR-
解決
済み

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

  • 困ってます
  • 質問No.219508
  • 閲覧数60
  • ありがとう数5
  • 気になる数0
  • 回答数3
  • コメント数0

お礼率 51% (180/349)

タグの本を読んでいたのですが、スタイルシートが推奨されるそうです。
私も使いたいんですが質問があります。

(背景)
<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上にアップして見ても
   普通に表示できました、でもどれかが無茶な(無理の、無駄のある)
   文法だと思うんです。
解りづらい説明かと思いますが、アドバイス頂けませんか?
通報する
  • 回答数3
  • 気になる
    質問をブックマークします。
    マイページでまとめて確認できます。

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

  • 回答No.3
レベル11

ベストアンサー率 53% (199/370)

再び、こんにちは。
>ただ、別売り(同出版社)のスタイルシート辞典を参照してくださいとのこと・・・
つまり、HTMLのタグ辞典にオマケでついているスタイルシートの解説だったんですね。

本当は、CSSの仕様邦訳とかを見るのが一番なんでしょうが、いきなりあれはつらいですから
普通は解説本ということになるでしょうね。

>つまり HEADで全体のレイアウト(位置)を指定しておいて
>BODYには具体的な内容を入れてやる
まぁ、そんなところですかね?
HEAD部は、まんま「ヘッダ」ですから、直接的にHTMLの中身ではないスタイルシートや
各種スプリクト(JavaScriptなど)はここに入れますね。

>>#left { /* IDがleftの要素に適用するスタイル */
>の#LEFTはIDの名前で 別にhidari とかでも良いんですよね?
かまいません。
ただし、お解りになっているかもしれませんが、ID属性でhidariという名前をつける
ことができるのは、同一ページではひとつだけです。
<P ID="hidari">段落1</P>
なんたらかんたら
<P ID="hidari">段落2</P>
のような使い方はできません。
IDは、Identificationですからね、IDをいったらただひとつの対象が特定できるように。

もし、単純に、「左寄せをするスタイル」をいろいろなタグにつけたかったら、CLASS
を使ってみてください。こっちならばOKです。
.hidari {text-align:left;}
<P CLASS="hidari">段落1</P>
といった感じで。

>背景ではなく 普通に画像を張りつけたい(連続表示しないで1枚だけ)場合それ用の
>スタイルシートの分は在るのですか?
><IMG SRC=・・・>
ないですよ。
スタイルシートの意味を考えればないのが解ると思います。
background・・・は、何かの背景スタイルを指定するものですが、
<IMG>、普通に画像を貼り付ける、ということは、「HTML文書に画像を配置する、コンテンツ
として画像というオブジェクトを持つ」ということですよね?
スタイルシートは、HTMLでマークアップされるなどして「既にあるもの」に対して、
スタイル(位置、背景、色、大きさなど)を指定するものだと思ってください。
HTMLタグの属性の部分を、スタイルシートを使って置き換えることはできますが、
HTMLのタグそのものを置き換えることはできません。
お礼コメント
twelve

お礼率 51% (180/349)

おおっ! たびたびすいません

本の後ろの方に少しだけCLASS の事が書いてありました、そうですね
CLASSをつかうという方法もあるんですね、私の使いたい方法からいえば
CLASSの方がよさそうです。




画像については、普通にタグで張りつけることにします

ほんとうにありがとうございました。
投稿日時 - 2002-02-20 01:17:28
-PR-
-PR-

その他の回答 (全2件)

  • 回答No.1
レベル11

ベストアンサー率 53% (199/370)

こんにちは。 う~ん・・・ 正直、ご覧になっている参考書に一体どういう解説がされている のか理解に苦しむモノがありますが(^^; CSSをHTMLに適用する方法はいくつかあります。 そのなかで、 #left {text-align:left;} のように同一HTML文書内で、特定のタグ、クラス、IDに一括して 適用したい場合は、 <STYLE>~</STYLE> ...続きを読む
こんにちは。
う~ん・・・
正直、ご覧になっている参考書に一体どういう解説がされている
のか理解に苦しむモノがありますが(^^;

CSSをHTMLに適用する方法はいくつかあります。
そのなかで、
#left {text-align:left;}
のように同一HTML文書内で、特定のタグ、クラス、IDに一括して
適用したい場合は、
<STYLE>~</STYLE>で囲んだスタイルシートの定義をHEAD要素の中に
書きます。つまり、
<HTML>
<HEAD>
<TITLE>ページのタイトル</TITLE>
<STYLETYPE="text/css">
<!--
BODY { /* BODY要素のスタイル */
background-image : url("");
background-attachment: fixed;
background-position: 100% 100%;
}

#left { /* IDがleftの要素に適用するスタイル */
text-align:left;
}
-->
</STYLE>
</HEAD>

<BODY>
~ここからボディをかく~

早い話、BODYの中身は普通に装飾なしのHTMLで記述しても、
HEAD内にスタイルの定義を挿入すればいきなり見栄えが変わる・・・
そうなるものだと思っていいのではないでしょうか?BODY要素の中は
(IDやCLASSを指定する必要がある時以外)触るら無くともスタイル(見栄え)
のみ変更できます。

>もう一つ、先の背景と文字のスタイルシートを同時に使う場合
><STYLE>の中に背景と文字を一緒に書いていいのでしょうか?
分けて書く必要はないでしょう。
>自分としては<STYLE>タグが分かれているとバグらないか不安なんです。
ですね。
分けた場合の挙動は、ブラウザの実装により異なるかもしれません。
たとえば、一番最後に書かれた<STYLE>タグの中身しか反映しない動作を
するブラウザがあるかもしれません。
お礼コメント
twelve

お礼率 51% (180/349)

ありがとうございます
 んー 本なんですが、タグの説明のあとに唯ソースが書いていて
おまけでスタイルシートのソースが書いてあるぐらいですね。HEADに書けとかBODY
に書けとかはまだ見つかっていません(汗 見逃したかな?
 ただ、別売り(同出版社)のスタイルシート辞典を参照してくださいとのこと・・・
 まぁ 買え! ということでしょう(笑)

<HEAD>タグの部分にはHTMLの情報を入れると聞いたことがあります
>>早い話、BODYの中身は普通に装飾なしのHTMLで記述しても、
HEAD内にスタイルの定義を挿入すればいきなり見栄えが変わる・

つまり HEADで全体のレイアウト(位置)を指定しておいて
BODYには具体的な内容を入れてやる(何種類かパターンがある場合、LEFT、CENTER など、はIDなどをふる必要あり)
で良いんですよね?

つまり極端には
>#left { /* IDがleftの要素に適用するスタイル */
の#LEFTはIDの名前で 別にhidari とかでも良いんですよね?
 愚問かもしれませんが・・
投稿日時 - 2002-02-18 21:22:30
  • 回答No.2
レベル9

ベストアンサー率 50% (50/100)

こんにちは。 >もう一つ、先の背景と文字のスタイルシートを同時に使う場合 <STYLE>の中に背景と文字を一緒に書いていいのでしょうか? 簡単に言うと一緒に書くべきです。スタイルシートは背景と文字 というように分かれているのではなくタグに対してそれぞれスタイルを 分けて書くような感じなります。 つまりある<p>に背景と文字のスタイルを指定する場合は ...続きを読む
こんにちは。

>もう一つ、先の背景と文字のスタイルシートを同時に使う場合
<STYLE>の中に背景と文字を一緒に書いていいのでしょうか?

簡単に言うと一緒に書くべきです。スタイルシートは背景と文字
というように分かれているのではなくタグに対してそれぞれスタイルを
分けて書くような感じなります。

つまりある<p>に背景と文字のスタイルを指定する場合は

<head>
<style type="text/css">
<!--
p{
background:#ffffff url(back.jpg)/*背景の色 及び 画像*/
color:#000000; /*文字の色*/
  font-size:15px;         /*文字の大きさ*/
font-family:serif;       /*フォントの種類*/
}
-->
</style>
<head>
<body>
<p>あいうえお</p>
</body>

のように背景と文字の指定を同時に行うのが普通です。

スタイルシートについて解説いているサイトはたくさんありますので
色々調べてみるのがいいとおもいます。

スタイルシートは自分で作ってみながら実践的に勉強すると
早く習得できますよ。
お礼コメント
twelve

お礼率 51% (180/349)

お答え ありがとうございます。
今の状態はタグで背景の色、フォントのサイズ、色を指定
スタイルシートで文字の位置と背景の位置の指定をしています

本当はどちらかに統一した方がいいのでしょうけど・・

私はどちらかというと色々弄って覚える方が好きです(笑)
今作ってるHPがある程度落ち着いたら
 一度スタイルシートONLY(無茶かな?)に挑戦したいと思います。

で気になったんですが(本にも書いていなくて<タグの本ですが・・・・)
スタイルシートの背景に複数枚の背景画像をつかうことはできるのでしょうか?
 背景ではなく 普通に画像を張りつけたい(連続表示しないで1枚だけ)場合それ用のスタイルシートの分は在るのですか?
 background-image : url("");    <ここで画像のURL
background-attachment: fixed;    <ここは・・・・
background-position: 100% 100%   <画像の位置  
て、のをみるとbacgroundと在りますがタグの<IMG SRC=・・・>のような
はたらきをさせたい場合も上のようにつかうんでしょうか?

もしかするとbackgroundの指定が二つある(背景は指定しておいて別に張りつけたいとして)とどちらかが打ち消されないのか気になるんですが・・・

もしよろしければ どなたかアドバイスいてだけ無いでしょうか?
投稿日時 - 2002-02-18 21:40:59
このQ&Aで解決しましたか?
関連するQ&A
-PR-
-PR-
こんな書き方もあるよ!この情報は知ってる?あなたの知識を教えて!
このQ&Aにはまだコメントがありません。
あなたの思ったこと、知っていることをここにコメントしてみましょう。

その他の関連するQ&A、テーマをキーワードで探す

キーワードでQ&A、テーマを検索する
-PR-
-PR-
-PR-

特集


いま みんなが気になるQ&A

関連するQ&A

-PR-

ピックアップ

-PR-
ページ先頭へ