CSS fonts and javascript

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
mintedjo
Forum Contributor
Posts: 153
Joined: Wed Nov 19, 2008 6:23 am

CSS fonts and javascript

Post by mintedjo »

Hi!
I'm stuck...

How can I get the font of an HTML element?
I've looked at the styles for elements to see what's what and found these properties relevent to fonts.

font,fontFamily,fontSize,fontSizeAdjust,fontStretch,fontStyle,fontVariant,fontWeight

Now fontFamily returns a value - which I would expect as in css thats how you define the font to be used. But what exactly does it mean?

I thought that fontFamily was just a group of fonts listed in the order that they should be used. I'm working on something which produces xml files in MS Excel 2003 xmlss format and the styles have a fontname property as well as a font family property. I've tried to understand the difference by reading various articles but i dont get it.

Can anybody explain what the difference is between a font and a font-family.
Also using javascript how would i get the FONT name? Will I have to retreive the fontFamily and parse the string?

Thanks
Joe

Thanks
User avatar
Eran
DevNet Master
Posts: 3549
Joined: Fri Jan 18, 2008 12:36 am
Location: Israel, ME

Re: CSS fonts and javascript

Post by Eran »

Can anybody explain what the difference is between a font and a font-family.
The 'font' css property is a shorthand property for a variety of font attributes. It allows to set multiple font attributes with one style declaration.
Of those, 'font-family' is what you consider as the font name which is used in the font style declaration. You can read more about font CSS attributes here - http://www.w3.org/TR/CSS2/fonts.html#font-properties.

So using Javascript, you indeed have to retrieve the fontFamily attribute of an element style, and parse it for the various font family used to render the element.
mintedjo
Forum Contributor
Posts: 153
Joined: Wed Nov 19, 2008 6:23 am

Re: CSS fonts and javascript

Post by mintedjo »

pytrin wrote:So using Javascript, you indeed have to retrieve the fontFamily attribute of an element style, and parse it for the various font family used to render the element.
That was the main bit I wanted to know :-)
Thanks for that.

I've already read about css and fonts and wotnot. I use css so I'm not unfamiliar with the properties, I just felt like I was misunderstanding the font-family property and to a certain extent I'm still not really sure what is meant by the term "font family". As I mentioned in my first post XMLSS format has the following properties in the style section inside <Font> tags: ss:Font and ss:FontFamily. What is the significance of having 2 separate variables for this?

From what I gather the css and xmlss meaning of the term fontfamily are different.

Thanks
Joe
Post Reply