472,141 Members | 995 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 472,141 software developers and data experts.

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
2 2668
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
reply views Thread by leo001 | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.