- ベストアンサー
How to Add Color to the Area Outside of <div id='main'>?
- Learn how to add color to the area outside of the <div id='main'> element.
- Find out the solution to adding color to the white area in the image.
- Discover how to style the outer part of the <div id='main'> with color.
- jevyepbawes
- お礼率94% (55/58)
- HTML
- 回答数3
- ありがとう数10
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
div#main{position:relative;min-height:300px;border:10px blue solid;background-color:red;} div#main:before{content:"";display:block;width:110%;height:110%;top:-5%;left:-5%;position:absolute;background-color:yellow;z-index:-5;} borderは簡略化プロパティですから border-style,border-width,border-colorをあわせて指定します。
その他の回答 (2)
- anonymous（@phantom0112358）
- ベストアンサー率60% (6/10)
HTMLを勉強するのであれば略さずにしっかりと書いたほうがいいと思います。 <body>は内容がある場合と最初の要素がstyleの場合は必須です。更に、<style>は<head>中になければなりません。 構文違反をしてもブラウザ上ではうまいこと解釈してくれますが、これから将来もっと本格的なものを作るにあたって、もしかしたらブラウザによって挙動が変わって面倒なことになるかもしれません。 表示とはあまり関係ないことですがborder:30pxというのは少しborderの意味から逸れている気がします。 さて、本題ですが。 <body>を略さず囲ってbodyに対してbody {background-color:色}と書いてみたらどうでしょう。 <html> <head> <title>title</title> <style> body { background-color:black; } #main{ width: 70%; margin: 0 auto; text-align: left; background-color:red; border:30px solid blue; } </style> </head> <body> <div id="main"> test </div> </body> </html>
お礼
ありがとうございました。
- s-eiji
- ベストアンサー率40% (2/5)
こんにちは 背景に色をつけるという解釈ですと <body bgcolor="#808080"> <div id="main"> test </div> </body> で色が変わります スタイルシートで対応する場合は <style type="text/css"> ～ </style>の中に body { background-color: #808080; } のように指定すれば背景色が変わります
お礼
ありがとうございました。
お礼
ありがとうございました。