467,072 Members | 1,220 Online
Bytes | Developer Community
Ask Question

Home New Posts Topics Members FAQ

Post your question to a community of 467,072 developers. It's quick & easy.

Two <PRE> Selectors

I want to have a css with 2 PRE styles, one bold with large font, and
another non-bold and smaller font.

I am new to CSS (and not exactly an expert in HTML, for that matter). Is
there a way to do this in CSS?

<STYLE TYPE="text/css">
pre{ font-size:xx-large;
font-family:monospace;
font-weight:bold;text-decoration:none;
}
</STYLE>

<STYLE TYPE="text/css">
pre2{ font-size:medium;
font-family:monospace;
white-space:pre
}
</STYLE>
Jul 21 '05 #1
  • viewed: 2455
Share:
2 Replies
On Thu, 2 Dec 2004 12:39:17 -0500, Buck Turgidson <jc***@hotmail.com>
wrote:
I want to have a css with 2 PRE styles, one bold with large font, and
another non-bold and smaller font.

I am new to CSS (and not exactly an expert in HTML, for that matter). Is
there a way to do this in CSS?


Yes. Style the <pre> element itself with the styles you will use most,
which you recon to be the normal for <pre> for your site. Don't define
styles that are already common to the element (like font-family:monospace
or font-style:normal or white-space:pre;). So, just put in:

pre {
font-weight:bold; }

if that is what you need.

Then name a class, make it semantic, logic, so you remember why you want
some content in pre tags look different from the normal pre style. For
example 'remarkable'. Add styles to that class, like

pre.remarkable {
font-size:xx-large; }

and use the class in your markup as needed:

<pre class="remarkable">this text will be bold (as it is <pre>) and
xx-large (because it is also class 'remarkable')</pre>

As you are new, read up on css at
<URL:http://www.w3schools.com/css/default.asp>.
--
Weblog | <http://home.wanadoo.nl/b.de.zoete/_private/weblog.html>
Webontwerp | <http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html>
Zweefvliegen | <http://home.wanadoo.nl/b.de.zoete/html/vliegen.html>
Jul 21 '05 #2
>
As you are new, read up on css at
<URL:http://www.w3schools.com/css/default.asp>.


It worked great. Thanks! I am on on my way to the above URL now.
Jul 21 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

7 posts views Thread by Alan Illeman | last post: by
1 post views Thread by Alan Illeman | last post: by
5 posts views Thread by Michael Shell | last post: by
9 posts views Thread by Eric Lindsay | last post: by
14 posts views Thread by Schraalhans Keukenmeester | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.