PDA

Click to See Complete Forum and Search --> : my CCS does not work.

keith28
03-28-2005, 11:38 AM
I have tried this in 3 different browsers and it does not work.
Can anyone help? I tried it 2 different ways.

<STYLE TYPE-"type/css">
<!--
A:link {COLOR: #222222}
A:hover {COLOR: #655EBB}
H2 {font-family: arial}
-->
</STYLE>



<STYLE type=text/css>
A:link {COLOR: #222222}
A:hover {COLOR: #655EBB}
H1 {font-family: arial}
</STYLE>




:confused:
BonRouge
03-28-2005, 11:42 AM
Try using lower-case. If that doesn't work, can you show us the page?
the tree
03-28-2005, 11:46 AM
Can we see your comlete html page?
CSS should be put in, something like this:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<title>A Page</title>
<style type="text/css">
<!--
a {color: #222;}
a:hover {color: #655ebb;}
h1 {font-family: arial, sans;}
//-->
</style>
</head>
<body>
<h1>A Page</h1>
<p>A paragraph with <a href="#">a link</a>.</p>
</body>
</html>
keith28
03-28-2005, 11:51 AM
the tree, I can't see your example.

look ot this link I put up a test file.
http://www.keithurbandesign.com/test.html
keith28
03-28-2005, 11:58 AM
Arial Font does not work
MstrBob
03-28-2005, 12:32 PM
Arial font doesn't work, because you aren't using an H1 element. Get rid of your presentational markup, back to basics.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="Content-Style-Type" content="text/css">
<title>Page Name</title>
<style type="text/css">
h1 {
font-family:arial, sans-serif;
}
a:link {color: #222;}
a:visited {color: #222;}
a:hover {color: #655ebb;}
a:active {color: #655ebb;}
</style>
</head>
<body>
<h1>Top Level Header</h1>
<p><a href="">This is a link to onwhere</a>.</p>
</body>
</html>
the tree
03-28-2005, 12:34 PM
Well you don't actualy have an h1 tag in there so it's not surprising that you don't see any airial.
Everything else seems dandy.

edit: sorry Bob, you must have started writing before me.
keith28
03-28-2005, 12:59 PM
my other sample does have H1 in it

<STYLE type=text/css>
A:link {COLOR: #222222}
A:hover {COLOR: #655EBB}
H1 {font-family: arial}
</STYLE>

and the sample link i sent has H1

http://www.keithurbandesign.com/test.html

still does not work.
MstrBob
03-28-2005, 01:01 PM
No, it doesn't. Are you even looking at your markup? You've used horrid, depreceated markup to resemble an H1 element, but you aren't using one.
keith28
03-28-2005, 01:01 PM
so H1 is a tag?
what if I just get rid of H1?
keith28
03-28-2005, 01:03 PM
is this correct?

<STYLE type=text/css>
A:link {COLOR: #222222}
A:hover {COLOR: #655EBB}
font {font-family: arial}
</STYLE>
BonRouge
03-28-2005, 01:03 PM
No h1 here : <body bgcolor="#ffffff">
<p><a href="(EmptyReference!)"><font size="7">test HOVER</font></a></p>
<p></p>
<p><font size="6">jhbjhbjhbjhbjhbjhbkjhbkjhbjhbj</font></p>
</body>
keith28
03-28-2005, 01:04 PM
can you tell me what "A:" stand for in the css?

<STYLE type=text/css>
A:link {COLOR: #222222}
A:hover {COLOR: #655EBB}
font {font-family: arial}
</STYLE>
BonRouge
03-28-2005, 01:08 PM
is this correct?

<STYLE type=text/css>
A:link {COLOR: #222222}
A:hover {COLOR: #655EBB}
font {font-family: arial}
</STYLE>
No.

Try this :

<style type="text/css">
body {font-family: arial, serif;}
a:link {color: #222222;}
a:hover {color: #655ebb;}
</style>
BonRouge
03-28-2005, 01:10 PM
can you tell me what "A:" stand for in the css?
anchor
the tree
03-28-2005, 01:25 PM
so H1 is a tag?No, it's a rare breed of monkey that has two tail and a cross-tail that form an H, and there's only one of it which is why it is called H1. Of course it's a tag, why else would you use it in that context?
what if I just get rid of H1?In your CSS? Nothing, although it wont validate. You really dont have an h1 in your html.
can you tell me what "A:" stand for in the css?The a refers to all a elements, which like BonRouge said, stands for anchor. The semicolon is just some syntax that says a pseudo-class is coming up.

The original page that I posted will work fine.
keith28
03-28-2005, 01:29 PM
How does Anchor relate to what I'm doing?
I thought Anchors were links to other spots on a webpage...

I just want all my text to be in Arial
BonRouge
03-28-2005, 01:34 PM
http://www.w3schools.com/html/default.asp :rolleyes:
keith28
03-28-2005, 01:54 PM
thanks for your help
I really appreciate it.
bathurst_guy
04-01-2005, 12:15 PM
Hi Keith, some people can be quite rude cant they...
Well just in case you havnt got it yet heres this.
I'll put my notes in the little quote boxes
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>A Page</title>
<style type="text/css"> <!--
a {color: #222;} //Ok so the A tag stands for Anchor. And yes that is a hyperlink.. this line says that the links colour will be #222
a:hover {color: #655ebb;} //This says that when the cursor is 'hovering' over the hyperlink, it will change colour. You can make it change heaps of properties when the cursor mouseovers a hyperlink. Visit http://www.w3schools.com/css/css_reference.asp for help with any of the CSS coding
h1 {font-family: arial, sans-serif;} //--> //This one sets the heading 1 font to arial or a sans-serif font if arial is not available (I dont know why the other person had "arial, serif" there before cause arial is a sans-serif font...). this only applies to heading 1's in the body of the document, it won't apply to any other tags such as p or h2
</style>
</head>
<body>
<h1>A Page</h1> <!-- Ok in the body of the page if you want a heading to be in arial then you need to specify it with the <h1></h1> tags just like this one -->
<p>A paragraph with <a href="#">a link</a>.</p> <!--And this shows the hyperlink changes on hover-->
</body>
</html>

And you can apply these styles to heaps of html tags not only the h1 and a.

Well I hope that that was a little more usefull..
don't forget to utalise the www.w3schools.com site aswell, they have heaps of tutorials on lotsa stuff!!!
keith28
04-01-2005, 01:00 PM
Yes you right, I found a lot of people online to be rude.
Thank you for submitting your reply.

I did some testing with this CCS below and the links look great.
But the plain text on the html has mixed fonts.
I would like to have all text to show up in Arial font.

What can I do?

---------------------------------------


<title>My Page</title>
<style type="text/css"> <!--
a {color: #222;}
a:hover {color: #655ebb;}
h1 {font-family: arial, sans-serif;} //-->
</style>
Scleppel
04-01-2005, 01:15 PM
body{
font-family: arial, sans-serif;
}

or

*{
font-family: arial, sans-serif;
}

for everything to be that font face.
keith28
04-01-2005, 01:26 PM
Will this work?

<title>My Page</title>
<style type="text/css">
body {font-family: arial}
a:link {color: #222222;}
a:hover {color: #655ebb;}
</style>
bathurst_guy
04-01-2005, 02:26 PM
yes that should work as long as there arent any <font> tags in the body of the document. these override any set previously.
Kurius_O
04-01-2005, 02:54 PM
Whoa. This discussion may be about to devolve quite considerably...

Keith, I think it may be time to do some reading. Check out my favorite reference at DevGuru.com (http://www.devguru.com/Technologies/css/quickref/css_index.html) He gives examples and explanations for just about everything. Also, I would highly recommend the free w3schools.com site: http://www.w3schools.com/

Kurius
bathurst_guy
04-01-2005, 03:20 PM
I dont mind helping - I just dont understand why some people even submit some of their answers. Sure they make sence to me, but obviously Keith is still new to CSS. Maybe this site can introduce a little icon that can be placed next to the articles that indicates the users experience. This way those who cant be bothered taking an extra 5 minutes to explain something properly can just pass over those threads. These forums are here so that the community can 'help' each other...
BonRouge
04-01-2005, 03:29 PM
The link to W3Schools (http://www.w3schools.com/) is very useful for beginners.