Beginner CSS Question
Why do the bg and header not overlap?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>My First CSS Webpage</title>
<link rel="stylesheet" type="text/css" href="css.css"/>
</head>
<body>
<img class="bg" src="bg.jpg"/>
<img class="header" src="header.png"/>
</body>
</html>
#bg{
position:absolute;
开发者_如何学运维 left:0px;
top:0px;
}
#header{
position:absolute;
top:0px;
left:0px;
}
Use a .
instead of a #
or change class=
to id=
I recommend the latter because I'm assuming that bg
and header
are unique.
<img id="bg" src="bg.jpg"/>
<img id="header" src="header.png"/>
See here for more info.
The two images in the html have been given classes, while in your css you define styles for ids.
If the element has a class, target it in css using .classname, if it has an id target it using #idname. If the element only occurs once in the html, use id. If there are multiple occurences, use a class.
also, I would suggest for 2 elements which use the same basic properties to define them as:
#element1, #element2
{
/* css properties */
}
This will save space on your css file, and can add up to quite alot.
In the CSS, a class selector is a name preceded by a full stop (“.”) and an ID selector is a name preceded by a hash character (“#”).
The HTML refers to the CSS by using the attributes id and class.
The difference between an ID and a class is that an ID can be used to identify one element, whereas a class can be used to identify more than one.
you can not use class in your HTML file and use a hash character (“#”) in your CSS file to style a particular element.
精彩评论