Internal Style Sheet basic issue
I am trying to create a basic style sheet with a background, and a form in the middle.
With the code I have, the background shows but the form is not visible. When all is said开发者_开发知识库 and done, the only HTML I will need will be text inside the form. But for now, I need the form to display. I am sure it is a mental error on my part, but here is the code:
<head>
<title>Basic Form</title>
<style type="text/css">
body
{
background-image:url('images/background.png');
}
#main{
background: url('/images/form.png') 0 0 no-repeat;
margin:250px auto;
z-index: 1;
}
</head>
<body>
<div id="main">
</div>
</body>
</html>
You have not set any dimensions for #main, so the width and height are auto.
That div has no content, so the height becomes 0.
With no height, there is no visible area to render a background image on.
if you want to see your div then you'd need to put something inside or give it a min-height.
Since the <div> has no height (width is 100% by default), no background will show. You should simply insert your form or at least set a min-height on it.
Also, you forgot to close your <style> tag.
if it's not a typo the <style> tag should be closed inside the head.
Basic Form
body
{
background-image:url('images/background.png');
}
#main{
background: url('/images/form.png') 0 0 no-repeat;
margin:250px auto;
z-index: 1;
}
加载中,请稍侯......
精彩评论