アプリ版：「スタンプのみでお礼する」機能のリリースについて

Webの作成について

解決済

  • 質問者：55milktea
  • 質問日時：
  • 回答数：5件

カテゴリが違ってたらスイマセン。ある文章があって
「index.html」「style.css」をエディタで開き以下の指示に従いなさい。 「style.css」に「green」を追加し、以下の設定を記述しなさいって問題があります。

ソース画面では
〈div class=”green”〉


文章


〈/div〉
で囲って、画面を最小化にして「style.css」を開き、

.green｛
color：＃000000；
background-color：＃ccff66；

テキストでは、こんな感じですが、手順が悪いのか、全く変わりません。どうすればいいでしょうか？

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (5件)

No.1

  • 回答者： utakataXEX
  • 回答日時：

ソースがすべてこちらに見えているわけではないので、見える範囲、想像できる範囲で箇条書きします。



〈div class=”green”〉 文章 〈/div〉
↓
タグは〈〉 ではなく、半角の <> です。

cssの中も同様です。
記号は半角で書いてください。

｛→{
：→:
＃→#
；→;

greenクラスの閉じカッコがないかも。

以下は、それ以外の想像。

ブラウザの再読み込みをしていない。

または、ローカルで作業していて、まだサーバーにアップロードしていないのに、http://で見ている。
    • good
    • 0
    • 件
通報する
この回答へのお礼

一応、全て半角で入力してます。

ソースの内容は
〈html lang＝”ja”〉
〈head〉
〈meta http-equiv＝”Content-Type” content＝”text/html； charset＝Shift_JIS”〉

〈meta http-equiv＝”Content-Style-Type” content＝”text/css”〉

〈title〉問題16〈/title〉
〈/head〉
〈body〉
〈h1〉明太子スパゲティ〈/h1〉
〈div class＝”green”〉
〈h2〉材料（2人分）〈/h2〉

本分省略


〈/div〉
〈/body〉
〈/html〉

のような感じです。

通報する
お礼日時：2011/04/08 21:12

No.2

  • 回答者： Iguchi_Y
  • 回答日時：

回答No1 の言うように，全体像がはっきりしないので，


自分で，それを作ってみました。
添付した画像のように見せるんでしょうか？


index.html は以下のとおり


<html>

<head>
<link rel="stylesheet" type="text/css" href="style.css" >
</head>

<body>

<div class="green">

文章

</div>

</body>
</html>

style.css は以下のとおり

.green{
color:#000000;
background-color:#ccff66;
}


注意点
No1で述べられたように，
全て半角で。特に，コピペすると全角になってたりするので，要注意。
greenの閉じカッコが必要。
style.cssのファイルで，.(コンマ）green とコンマ付けて。
「Webの作成について」の回答画像2
    • good
    • 0
    • 件
通報する
この回答へのお礼

一応
indexとstyleには
文章の文字色、背景色の入力は終わりました。
それからが分かりません。

通報する
お礼日時：2011/04/08 21:37

No.3

  • 回答者： Iguchi_Y
  • 回答日時：

No1へのお礼に書いたプログラムで



<title>問題16</title>

の上に，


<link rel="stylesheet" type="text/css" href="style.css" >

を入れて

<link rel="stylesheet" type="text/css" href="style.css" >
<title>問題16</title>

すると，画像のようになる
「Webの作成について」の回答画像3
    • good
    • 0
    • 件
通報する

No.4ベストアンサー

  • 回答者： utakataXEX
  • 回答日時：

#1 です。



ソース全体を見てわかりました。

と言うか、#2さんの回答に答えそのものが書いてありますｗ

<link rel="stylesheet" type="text/css" href="style.css" >

が抜けていますね。

「このHTMLでは同じフォルダにあるstyle.cssをスタイルシートとして使うよ」

と言う意味です。

これが無いと、index.html と style.css を結び付けられません。
index.html と style.css が赤の他人状態なので、どんなに修正しようが、反映されないわけです。
    • good
    • 0
    • 件
通報する
この回答へのお礼

問題16の上には、既に
〈link～.css〉
は入っています。

通報する
お礼日時：2011/04/09 00:31

No.5

  • 回答者： utakataXEX
  • 回答日時：

#1、4 です。



＞問題16の上には、既に
＞〈link～.css〉
＞は入っています。

うーん、私の環境でも #2、3の回答者さんと同様、普通に緑色が反映されています。

と言う事は、回答者2人と質問者様の間に何らかの差異（「手順の漏れ」「環境の違い」etc.）がある、と言う事です。

現在作成されているソースはひとまず置いて、以下の手順でやってみてもダメでしょうか？

(0) 拡張子の確認
そもそもブラウザで表示されているのか、どうかも質問には書かれていないので、一応確認です。
実はindex.html.txtやstyle.css.txtになっていたりしていないか確認してください。
拡張子の表示は以下参照。
↓
ファイルの拡張子を表示するには?
http://support.microsoft.com/kb/978449/ja

(1) C:ドライブ直下にtestフォルダ作成

(2) 以下の index.htmlを「そのまま」testフォルダに
<!-- index.html -->
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<link rel="stylesheet" type="text/css" href="style.css" >
<title>問題16</title>
</head>
<body>
<h1>明太子スパゲティ</h1>
<div class="green">
<h2>材料（2人分）</h2>
本分省略
</div>
</body>
</html>

(3) 以下の style.css を「そのまま」testフォルダに
/* style.css */
.green{
color:#000000;
background-color:#ccff66;
}

(4) C:\test\index.html をダブルクリック

これで、回答者2人と同様に緑が反映されたとしたら、現在作成されているソースに「余計な部分」「足りない部分」があると言う事です。

(5) 問題のソースを C:\test\index.html C:\test\style.css に反映
testフォルダの方のソースに問題16のソースを「『少しずつ』追記して確認」を繰り返してみてください。

その中のどこかで緑が反映されなくなる箇所があるはず、原因はそこにあります。

(4)で反映されない場合は、環境の問題が考えられます。
インターネットのセキュリティレベルを少し落としてみるとか、かなぁ？
「Webの作成について」の回答画像5
    • good
    • 0
    • 件
通報する

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

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報