-
<resolved> CSS inherit
How do I actually CASCADE these things.
Or maybe I want to inherit... I'm not sure.
anyway.
Say I define a style as
Code:
.basictitle {font-size: 16;
color: white;
font-family: arial;
font-weight: bold;
border-style: solid;
border-width: 1px;
background-color: darkblue;
}
Now, what I want to do is use this for my entire website.
BUT, for some pages I want to modify the font size
for this element.
This willl allow me to use a basic style, and then for each
page I want to put something like :
Code:
.advtitle {[somecodehere that references .basictitle];
font-size:55;}
so that advtitle will use the bastitle, but be a bit bigger??
is there a way to do this?
-
so,
I can nest styles.
that is, I can put a
Code:
<div class=bastitle>
<div class=advtitle>
This will have all of bastitle properties, PLUS overridden properties of advtitle.
</div>
</div>
But what I'd really like to do is have this type of nesting effect take place in the style tag.
:sigh:
-
change
Code:
.basictitle {font-size: 16;
color: white;
font-family: arial;
font-weight: bold;
border-style: solid;
border-width: 1px;
background-color: darkblue;
}
to
Code:
Body {font-size: 16;
color: white;
font-family: arial;
font-weight: bold;
border-style: solid;
border-width: 1px;
background-color: darkblue;
}
That will se the base for use through out the whole body area (essentially the whole page).... then you can further define other elements as needed.
-
I think this is what you were saying, but just for the record.
Apparently I can define elements, or sub-classes as I like to say, of current HTML tags.
without explaining, here:
Code:
<style type="text/css">
<!--
P.beefy {font-family: script;
font-size: 40px;
}
P.veggie {font-family: arial;
color: green;
}
-->
</style>
now I can use different sub-classes of the P tag.
like this:
Code:
<body>
<p>
Hello this is normal <br>
</p>
<p class=beefy>
And this is beefy
This is <b>beefier</b>.
</p>
<p>
Normal again,
</p>
<p class=veggie>
This is veggie, hold the bacon
</p>
</body>
I love this stuff. Actually makes HTML interesting.
-
well you can also do this (I know you resoved it so this is just an FYI)
if you set a specific font size to the page and want another part to be different.
body {font-size: 16;
color: white;
font-family: arial;
font-weight: bold;
border-style: solid;
border-width: 1px;
background-color: darkblue;
}
then in a P tag you can do this
<p style="font-weight: normal">
that should over-write the body style since it is changing a font style.
that is inheritance :)
