editing css script for menu bar
i have a css script for make jquery menu bar.. i want it can show at left upside and no border... so..it will show just a menu bar... i have a text logo and i want to put it below the menu bar... but actually the logo lies below menu bar body... how to change it...??
<head>
<style type="text/css">
* { margin:0 auto;
padding:0;
}
html { background:#ffffff; }
body{ margin:40px auto;
width:560px;
height:552px;
overflow:hidden;
background:#ffffff;
}
div#menu {
margin:40px 0 0 95px;
position:left;
}
div#copyright {
font:11px 'Trebuchet MS';
color:#fff;
text-align:center;
clear:left;
position:absolute;
top:546px;
width:560px;
}
div#copyright a { color:#425B7B; }
div#copyright a:hover { color:#fff; }
</style>开发者_如何转开发;
</head>
<body>
<p align="left"><img src="coollogo_com-30735352.gif" border="0"></p>
</body>
It's hard to tell what you're trying to do without seeing any HTML markup. To use wood.jpg as your body background, use background: #ffffff url(/images/wood.jpg); in the body style definition in place of background: #ffffff
Other than that, here are some general pointers:
- For the wildcard style (*), you only need margin: 0;
- Adding a background color to both html and body is redundant. You only need it on body
- You don't need any margin on body since you already defined it with the wildcard
- I would advice against using overflow: hidden with a fixed height for your body, unless that's exactly what you want. Any long running content will get cut off. Consider using overflow: auto;
- The style "position: left" is not valid. If you want the contents of #menu to align to the left, use text-align: left or float the contents to the left and clear the div using a "clearer div" or overflow auto;
<head>
<style type="text/css">
* { margin:0 auto;
padding:0;
}
html { background:#ffffff; }
body{ margin:0px;
width:1600px;
height:800px;
overflow:auto;
background-image:url("wood_texture2.jpg");
}
div#menu {
margin:40px 0 0 95px;
position:absolute;
text-align:left;
}
div#copyright {
font:11px 'Trebuchet MS';
color:#fff;
text-align:center;
clear:left;
position:absolute;
top:546px;
width:560px;
}
div#copyright a { color:#425B7B; }
div#copyright a:hover { color:#fff; }
</style>
</head>
<body>
<p align="left"><img src="coollogo_com-30735352.gif" border="0"></p>
</body>
精彩评论