I know HTML, I know CSS - So why can't I select some text and apply a style to it?

P

Paul H

I have just started using FrontPage 2002 and I want to speed up the web
development process. My website is fine and each page links to my external
css file like it should:

<LINK REL="stylesheet" HREF="files/mycssfile.css" TYPE="text/css">

I have looked in Google groups the helpfiles and even behind the fridge but
I can' find an answer to what I thought should be very straight forward..

MY QUESTION:
How do I quickly apply a style from my external style sheet to a highlighted
chunk of text?

If I select my text then click Format/Style..., the styles listed bear no
relation to the styles/classes in my linked css file.

What am I missing?

Thanks,

Paul
 
R

Ravi Anguluri

Open FrontPage From the menu View --> Quick Tag selector.
In the design mode on the top you will find the tags specific to the text
selected. Click on the tag and on the down arrow. Then select Tag
Properties. In the Window if you find class drop down box, select the
required class to apply to the selected text. or right click on the text
select the properties.

There are some HTML tags which do not support all the properties for
example the Class property. You can check at http://www.w3.org for the tags
and properties supported

Hope this Information helps.

Regards
Ravi
MSFT

This posting is provided "as is" with no warranties and confers no rights
 
P

Paul H

Thanks Ravi, but I can't find the menu options you mention. If I select
"View" I can see "Reveal Tags" but no "Quick tag selector". Also I have
three modes "normal", "HTML" and "Preview", no "design" mode.

So when you mention "In the design mode on the top.. " I have no idea where
you mean.

I am very grateful for your help, but I am no closer to solving this. Please
could you re-word your explanation if it's not too much trouble.

Many thanks,

Regards,

Paul
 
P

Paul H

Thanks Kathleen!!

If I highlight a piece of text and then select a style from the style
dropdown, the code that is inserted is:
<p class="body_bold">
But I want
<a class="body_bold">
Because I don't want the entire page wrapped in a <p> tag. I just want the
text I have selected wrapped in an <a> tag.

What am I doing wrong?

Regards,

Paul
 
M

Murray

Select the <a> on the Tag selector first.

Also, custom classes with underscores in their names are not supported in
NN4x, for what that's worth....
 
M

Murray

Wait - is the text you selected NOT currently wrapped in an <a> tag? So, if
that's the case, then you need to make it a link first, then select the <a>
on the Tag selector, and then apply the style.

A descendent selector might be a better way to go, however, e.g.

#foo a {...}

which would then automatically apply to just those a tags within the
container with id="foo". Not knowing the rest of your page structure I
can't say whether this is the best approach, but in general, the use of
descendent selectors improves the readability of your stylesheet and makes
your longer term maintenance easier.
 
R

Ronx

You upgrade to FrontPage 2003 :)

This is a feature that is new in FP2003 - your description of "Normal, HTML
and Preview" indicate that you are using FP2000 or FP2002.

Since the current version of FrontPage is 2003, and has been out for a year,
many responders will assume that is the version you are using unless you say
otherwise.
 
P

Paul H

Since the current version of FrontPage is 2003, and has been out for a
year,
many responders will assume that is the version you are using unless you
say otherwise.
Click to expand...

I did! :O).
 
P

Paul H

What I am trying to achieve is to turn "only" the bold text into
bold/italic...

Here's my code:

<body>
<a class="body_bold">Hello World - in bold</a>
<br><br>
<a class="body_italic">Hello World - in italic</a>
</body>

In normal mode I click on the opening <a> tag for the "Hello World - in
bold" line which selects the text and the tags for the first line only. From
the pull down style menu I select "body_bold_italic".

Here is the resulting code:

<p class="body_bold_italic">
<a class="body_bold">Hello World - in bold</a>
<br><br>
<a class="body_italic">Hello World - in italic</a> </p>
</body>

Why has the whole lot been wrapped in a <p> tag? I only selected the first
line!

The code I was expecting to see was:

<body>
<a class="body_bold_italic">Hello World - in bold</a>
<br><br>
<a class="body_italic">Hello World - in italic</a>
</body>

What am I missing?

Thanks Kathleen,

Paul
 
P

Paul H

Aha, I think I am learning some basics here...

The text in question is "not" a hyperlink it's just ordinary text. So my
next question is...

How "should" I be formatting my text? What should the code look like?

If
<a class="10pt_bold_pink">Hello World</a>
is wrong

What should the code look like to achieve the following.

I want this text 12pt. I want this text 12pt bold italic. I want this text
12pt again.

Last question promise :O)

Thanks again

Paul
 
R

Ronx

Yes, it is there in the original post. Unfortunately the information was
lost in the thread.
 
R

Ronx

In FP2003, right click on the hyperlink, choose Hyperlink properties, then
click the Style button and choose the style for the hyperlink. IIRC, FP2002
has a similar functionality.
 
K

Kathleen Anderson [MVP - FrontPage]

Paul:
Your ordinary text would look like this: <p>Hello World</p>

To apply a style to it, you would add this to your stylesheet:

p {
color: #FFC0CB;
font-size: 12pt;
}


p.other {
color: #FFC0CB;
font-size: 12pt;
font-weight: bold;
font-style: italic;
}

The choose .other from the dropdown to format the one you want italic and
bold.

--

~ Kathleen Anderson
Microsoft FrontPage MVP
Spider Web Woman Designs
http://www.spiderwebwoman.com/resources/



Paul H said:
Aha, I think I am learning some basics here...

The text in question is "not" a hyperlink it's just ordinary text. So
my next question is...

How "should" I be formatting my text? What should the code look like?

If
<a class="10pt_bold_pink">Hello World</a>
is wrong

What should the code look like to achieve the following.

I want this text 12pt. I want this text 12pt bold italic. I want this
text 12pt again.

Last question promise :O)

Thanks again

Paul

Kathleen Anderson said:
Paul:
Before you try and apply a style to an anchor, which is what the <a>
tag represents, you need to properly format the tag; like this:

<p><a href="http://www.w3.org/TR/html401/"> HTML 4.01
Specification</a></p>

Your anchor has no href.

--

~ Kathleen Anderson
Microsoft FrontPage MVP
Spider Web Woman Designs
http://www.spiderwebwoman.com/resources/



Paul H said:
What I am trying to achieve is to turn "only" the bold text into
bold/italic...

Here's my code:

<body>
<a class="body_bold">Hello World - in bold</a>
<br><br>
<a class="body_italic">Hello World - in italic</a>
</body>

In normal mode I click on the opening <a> tag for the "Hello World -
in bold" line which selects the text and the tags for the first line
only. From the pull down style menu I select "body_bold_italic".

Here is the resulting code:

<p class="body_bold_italic">
<a class="body_bold">Hello World - in bold</a>
<br><br>
<a class="body_italic">Hello World - in italic</a> </p>
</body>

Why has the whole lot been wrapped in a <p> tag? I only selected the
first line!

The code I was expecting to see was:

<body>
<a class="body_bold_italic">Hello World - in bold</a>
<br><br>
<a class="body_italic">Hello World - in italic</a>
</body>

What am I missing?

Thanks Kathleen,

Paul



"Kathleen Anderson [MVP - FrontPage]" <[email protected]>
wrote in message <a> is not a style, it's an HTML tag. You have to add the <a> tag
in the HTML first, then select your <a> tag style from the
dropdown.

--

~ Kathleen Anderson
Microsoft FrontPage MVP
Spider Web Woman Designs
http://www.spiderwebwoman.com/resources/



Thanks Kathleen!!

If I highlight a piece of text and then select a style from the
style dropdown, the code that is inserted is:
<p class="body_bold">
But I want
<a class="body_bold">
Because I don't want the entire page wrapped in a <p> tag. I just
want the text I have selected wrapped in an <a> tag.

What am I doing wrong?

Regards,

Paul



I believe Ravi is referring to the style dropdown as shown in the
attached image.

--

~ Kathleen Anderson
Microsoft FrontPage MVP
Spider Web Woman Designs
http://www.spiderwebwoman.com/resources/



Here's the tag selector (see snap). But I can see no Class
dropdown in the properties panel. I would be very interested in
knowing this answer myself.


Thanks Ravi, but I can't find the menu options you mention. If
I select "View" I can see "Reveal Tags" but no "Quick tag
selector". Also I have three modes "normal", "HTML" and
"Preview", no "design" mode.

So when you mention "In the design mode on the top.. " I have
no idea where
you mean.

I am very grateful for your help, but I am no closer to solving
this. Please
could you re-word your explanation if it's not too much
trouble.

Many thanks,

Regards,

Paul


message Open FrontPage From the menu View --> Quick Tag selector.
In the design mode on the top you will find the tags specific
to the text selected. Click on the tag and on the down arrow.
Then select Tag Properties. In the Window if you find class
drop down box, select the required class to apply to the
selected text. or right click on the text select the
properties.

There are some HTML tags which do not support all the
properties for example the Class property. You can check at
http://www.w3.org for the tags
and properties supported

Hope this Information helps.

Regards
Ravi
MSFT

This posting is provided "as is" with no warranties and
confers no rights
Click to expand...
Click to expand...
Click to expand...
 
P

Paul H

Thanks Ronx,

As I have just discovered, I have been doing this incorrectly. The text in
question is not a hyperlink so, as I understand it, I should not be using
the <a> tag at all. If that is the case what should the code look like for
the following text:


I want this text 12pt. I want this text 12pt bold italic. I want this text
12pt again.


Here is a snippet of my external style sheet:

..text_12pt_bold_italic
{
font: bold italic 12pt verdana;
}

..text_12pt
{
font: 12pt verdana;
}

Thanks,

Paul
 
M

Murray

By the way - it's not a great idea to use points on the web. Use pixels,
ems, ens, exs, percents, or size names instead. Points are a print metric
with little real relevance to a pixel-based display. As such, you will find
quite a bit of variation from one system/browser to another.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

How do I set focus (and select text) on a text box on a modeless userform? 0
css external H1, H2, H3 3
Apply a Style to left margin Only Please 1
CSS Query for learner useing FP 2003 SP2 is this a FP BUG or is it me 2
Cascading style sheets 2
How to correctly use CSS in FrontPage? 2
CSS Problems 9
CSS and Background Gradients 2

Top