PDA

View Full Version : basic css Q?


mat
08-26-2002, 02:57 AM
hi,


so i'm using a style sheet to control my headings, so when i want to make a heading i just put <p class="heading">this is the heading</p> but say i want to have just one word in the heading red?

if i do this the same way as i have been i end up with the word i want in red on a new line ?

Gordo
08-26-2002, 03:15 AM
This goes in your CSS file:

.red {
color: #FF0000
}

This goes in your example:

<p class="heading">this is the <span class="red">heading</span></p>

mat
08-26-2002, 03:19 AM
I see now, cheers ;)

webmarkart
08-26-2002, 04:02 AM
wouldnt it just be easier to do this?

.heading {color: #FFFFFF; font: bold 7pt TAHOMA}


<p class="heading">this is the</p>

mouse
08-26-2002, 04:06 AM
Originally posted by webmarkart
wouldnt it just be easier to do this?

.heading {color: #FFFFFF; font: bold 7pt TAHOMA}


<p class="heading">this is the</p> You don't seem to have grasped the question :p

He doesn't want all the words using the same styling. This is what the <span> tag is made for; inline styling. :D

webmarkart
08-26-2002, 04:39 AM
gotcha, I guess I read the question too fast :o

Zvona
08-26-2002, 02:05 PM
Do not use paragraph element for making headings, because it's not meant for it. It's easier and much more logical to use heading elements for headings :)

Like

.
.

<style type="text/css">
H1 {font:bold 16px arial,serif;}
H2 {font:bold 14px arial,serif;}
H2 {font:normal 14px arial,serif;text-decoration:underline;}
P {font:normal 12px arial,serif;}
.parag1 {margin-left:0cm;}
.parag2 {margin-left:2.29cm;}
.parag3 {margin-left:4.57cm;}
</style>
.
.
<h1>1. My example</h1>
<p class="parag1">Hello, this is my example. blah blah..</p>

<h2>1.1 Sub-header</h2>
<p class="parag2">Now, we're going more deeper in the subject.
Text is indented more due to class="parag2" style definition. Isn't
it easy to read this?</p>

<h3>1.1.1 Sub-Sub-header with <span style="color:red;">red text</span></h3>
<p class="parag3">This is a paragraph indented more than
others. We also have some red text in header.</p>
.
.

Following code has stucture :
1. My example
|-First paragraph (not indented)
|
|-1.1 Sub-header
&nbsp;&nbsp;|-Second paragraph (indented 2.29cm)
&nbsp;&nbsp;|
&nbsp;&nbsp;|-1.1.1 Sub-sub header with red text
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;|-Third paragraph (indented 4.57cm)

This is very much alike with Finnish standard for documentation. Of course there are differences with standards, but this is the basic idea.

After the explanation I hope, using paragraph element for headings is considered irrational.