詳しい人求む！

div要素に枠線を指定とページに色付けするには

締切済

質問者：koi_koikoi
質問日時：2015/12/13 08:49
回答数：1件

<!DOCTYPE html>
<html lang="java">
<head>
<meta charset="utf-8" />
<title>sample</title>
</head>
<body>
<div>
<p id="p3">text 3</p>
</div>
<script type="text/javascript">
var obj = document.getElementById("p3");
obj.style["color"]="#ccff00";
obj.style.fontSize="100px";
obj.style.fontFami="monospace";
</script>
</body>
</html>

・document.getElementByIdメソッドを使ってp3という要素を見つけ、変数objに代入する。
・objが保持しているオブジェクトのstyle属性に値を設定する。colorプロパティに値#ccff00を代入している。
・プロパティに代入する値は数値であっても文字列で書く。
・CSSプロパティの名前でハイフンを含むときは、ハイフンを除きその直後の文字を大文字に変える。
(font-size→fontSize)

上のdiv要素に枠線を指定し、背景色などを使ってページに色を付けなさいと言われましたが、具体的にどうすればいいでしょうか？

通報する

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

質問の本文を隠す

回答 (1件)

最新から表示
回答順に表示

No.1

回答者： fujillin
回答日時：2015/12/13 12:44

出題の意図が正確にはつかみきれないのですが・・・

課題のようなので、ヒントのみです。
具体的な書式などはウェブ上にたくさんありますので、御自分で調べてみてください。

＞上のdiv要素に～～
まずは、対象となるdiv要素を取得する必要がありますが、そのままのHTMLで直接divを取得するのは難しいですね。
例に示されている方法を使うのであれば、divにidを設定しておくことで、getElementById()を用いて例示と同様に取得することができますね。
HTMLを変えることが許されないのであれば、目的とするdiv要素は、例で取得できているp要素の親要素にあたりますので、obj.parentNodeで取得することができます。

＞枠線を指定し、背景色などを使って～～
取得した要素のstyle属性を変更することで実現できると思います。
説明文にあるようにCSSとほぼ同様ですので、枠線はborder、背景色はbackgroundColorで指定することになります。
枠線は、太さ、線種、色をまとめて設定する方法と個々に指定する方法があるのもCSSと同様です。

＞ページに色を付けなさい
ページの一部に色が付けば良いという意味であれば、div要素に色を付けることで題意を満たしますが、文字通りページに色を付けることを求められているのであれば、body要素に背景色を設定するなどが必要なのかもしれません。

頑張ってください。