• ベストアンサー

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

sightの回答

  • ベストアンサー
  • sight
  • ベストアンサー率53% (199/370)
回答No.3

再び、こんにちは。 >ただ、別売り(同出版社)のスタイルシート辞典を参照してくださいとのこと・・・ つまり、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
質問者

お礼

おおっ! たびたびすいません 本の後ろの方に少しだけCLASS の事が書いてありました、そうですね CLASSをつかうという方法もあるんですね、私の使いたい方法からいえば CLASSの方がよさそうです。 画像については、普通にタグで張りつけることにします ほんとうにありがとうございました。

関連するQ&A

  • テーブルにスタイルシートを使う方法

    こんにちは、テーブルタグのことで質問があります。 普通、背景画像でスタイルシートを使い右下などに固定するタグは <STYLE TYPE="text/css"> <!-- BODY { background-image : url("画像の名前"); background-repeat : no-repeat; background-attachment : fixed; background-position : left bottom; background-color:#FFFFFF; } --> </STYLE> となると思いますが、これは通常<head></head>の間にいれますよね。 これをテーブルの中で使うにはどうすればいいでしょう? テーブルの背景画像を右下や左下などに固定したいということなんですがそういうことはできますか? よろしくお願いします;

  • 外部スタイルシートが読み込めない

    こんにちは。 外部スタイルシートが読み込めず 困っています。 HTMLは、 <html> <head> <link rel="stylesheet" href="controlbox2.css" type="text/css"> </head> <body> <div class="modal">syun</div> </body> </html> controlbox2.cssは .modal{ background-color:#fff; padding:10px; border:1px solid #333; } だけです。 もちろん同じディレクトリで あり何度も確認しています。 ブラウザは、IE7です。 ヘッダー部分に スタイルシートを書くと 当然効果があります。 <head> <style type="text/css"> .modal{ background-color:#fff; padding:10px; border:1px solid #333; } </style> </head> 文字コードは、ともに SHIFT_JISで保存しています。 何が悪いのか、 全くわかりません。 何か分かる人がいましたら、 よろしくお願いします。

    • ベストアンサー
    • HTML
  • スタイルシートを二つ並べたら一つが反映されない

    ホームページを作りましたが、背景があまりに殺風景だったので、画面の両端に画像を縦に並べて貼り付けようとしました。 色々調べて <style type="text/css"> <!-- body{background:fixed url(画像名) #ffffff repeat-y top right} --> </style> というソースを<head>~</head>間に打ち込めば、右端に画像が並んで表示されると分かりました。 左にも同様に画像を並べようと <style type="text/css"> <!-- body{background:fixed url(画像名2) #ffffff repeat-y top left} --> </style> と、先ほどのソースの下に打ったところ、最初に書き込んだ右の画像が消え、左の画像のみがあらわれました。 右、左を書き換えてもやっぱり上のソースは消え、下のソースのみ反映されます。 どうすれば両端共に画像が出てくるようになるでしょうか?

    • ベストアンサー
    • HTML
  • スタイルシートで上手く段組が出来ません。

    スタイルシートで段組をして、いわゆる擬似フレームのHPを作りたいのですが、いまいち上手く出来ません。 下の画像の赤紫部分(HTML内ではtopsとしている部分)も分割して、全部で5つのフレームに分けたいのですが、そこを分割しようと <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <style type="text/css"> <!-- body { margin:0px; padding:0px; } #top { width:450px; height:200px; float:left; background-color:#cc6600; } #tops { width:300px; height:200px; float:left; background-color:#cc5555; } #left { width:250px; height:600px; clear: both; background-color:#ff9933; } #right { width:500px; height:600px; float:left; background-color:#ffcc66; } #under { width:750px; height:10px; clear: both; background-color:#ff9955; } --> </style> </head> <body> <div id="top"></div> <div id="tops"></div> <div id="left"></div> <div id="right"></div> <div id="under"></div> </body> </html> というタグを打つと、topsの部分はちゃんと回り込んでくれるのですが、画像のように、回り込みを解除したleftの横のrightがちゃんとfloat:left;と打ち込んでいるのにも関わらず、leftの下にいってしまうのです。 どうしたらちゃんと5つに分割出来るのでしょうか? よろしくお願いしますm(_ _)m

  • スタイルシートの記述について

    例えば、文字を黒く、背景色を白くしたい場合ですが、どちらの記述が正しいですか? (1)は兄が教えてくれたタグの書き方で、(2)はネットで見かけたタグ(CSSについて説明していたサイト)の書き方です。 カッコの違いが気になっています。 ネット検索をしたところ、(2)の形で書かれているほうが多かったです。 今は『<!-->』は、もう古かったりなどして使わない形なのでしょうか。 それとも(2)の『{}』のみの形はCSSとして使う場合なのでしょうか。 (1) <style type="text/css"> <!--P{color:#000000;}--> <!--BODY{background-color:#ffffff;} </style"> (2) <style type="text/css"> p{color: #000000;} body{background-color:#ffffff;} </style">

  • HP作成 スタイルシート

    ビルダーを使ってHPを作成しています。そこで、ページの背景の上だけにgif画像を指定したくスタイルシートを追加してみたのですがうまくなりません。ビルダーのHTMLに追加しているのですが追加する場所を間違えているような気がします。ビルダーで背景色を#cc0000設定しています。 <TITLE></TITLE> <STYLE type="text/css"> <!-- BODY { background-image: url("image/gurad1.gif"); background-repeat: repeat-x } --> </STYLE> <LINK rel="stylesheet" href="image/table.css" type="text/css" id="_HPB_TABLE_CSS_ID_"> </HEAD> <BODY bgcolor="#cc0000" link="#ffffff" alink="#009900">

  • styleの直接指定が効きません。

    外部ファイルにてbodyに背景画像を設定しているんですが、インラインフレームの中だけ背景色にしたく、 (1)<head>内に <Link rel="stylesheet" href="style.css" type="text/css"> <style type="text/css"> body { background-color: #fffff3; } </style> (2)<body style="background-color: #fffff3;">~</body> と両方試してみましたが、背景色が反映されず背景画像のままです。 外部ファイルの body { color : #57450f; background-image : url(image/back01.gif); } 背景画像の部分をはずすと背景色は反映されるんですが、何が問題なのでしょうか? 回答よろしくお願いします。

    • ベストアンサー
    • HTML
  • 2つ画像を背景にするスタイルシートってある?

    1つの画像をスタイルシートで背景にするのは、知ってるんですが、2つの画像を同じページに背景にはできるのでしょうか?下記は1つの画像を背景にするスタイルシートです。これのどこかをいじれば可能なのでしょうか? <STYLE TYPE="text/css"> <!--    BODY {       background-image:素材のURL;       background-position:0% 100%;       background-repeat:no-repeat;       background-attachment:fixed;     } --> </STYLE>

    • 締切済み
    • CSS
  • DreamWeaverMXでスタイルシートを使わない方法

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

  • 背景を固定する。

    <HTML> <HEAD> <TITLE>・・・</TITLE> <STYLE TYPE="text/css"> <!-- BODY { background-image: url(画像のURL); background-repeat: no-repeat; background-position: right bottom; } --> </STYLE> </HEAD> <BODY> ・ ・ ・ </BODY> </HTML> このタグをいれても、背景が表示されず真っ白です。 何か間違ってるところがありますか?