Guys, i want to set a specific size for a font (e.g +1), but if a viewer browses the page, i dont want the fonts to be scalable. I mean no matter what the viewer's IExplorer settings are (View->Text size->Large, small, smaller..etc) i want the fonts to be displayed with a specific size.<br />
Any ideas ? Thanks.<!--content-->welcome to the forums
<br />
<br />
sure, no probs, put this in your css<br />
<br />
P { font:bold italic 12px sans-serif }<br />
<br />
<br />
remove what you don't need, ie bold and italic, change the selector to the one you wish to apply it to, if you are unfamiliar with css post back<!--content-->Well, what do you mean by saying css ? Kinda newbie in this field When you say "P { font:bold italic 12px sans-serif }", i put this in the code as it is (including the 'P') ?. Waiting for your answer dude. Thanks.<!--content-->Basically, yes.<br />
<br />
Part of the code would look like this:<br />
<br />
<html><br />
<head><br />
<title>Page Name</title><br />
<style="text/css"><br />
P { font:bold italic 12px sans-serif }<br />
</style><br />
</head><br />
<body><br />
<br />
However, that's if you want everything in bold italics. Otherwise, just include the 12px and sans-serif information. You could add your colour information here, too, if you wanted a text colour other than black.<br />
<br />
Does that help?<br />
<br />
Peg<!--content-->Ok, i got it. But what if i want a style in a specific part of the page? Can i put the tags <style> wherever i want into the page? Probably a css file is like a guide to a web page. How can i connect a css file with a html file and how can i use information from css file in speficic parts of the html file? I hope im not getting too annoying Thanks<!--content-->*g* Never annoying. I need the practice myself. <br />
<br />
Okay, there's two ways of doing this, depending on how much you want different. Style tags generally go into the <head> tags, but single changes, like having one instance of h2 {font: italic 12px sans-serif green;} can go into the specific <h2> tag. <br />
<br />
1. You can put everything within the <head> tags. Let's say you're going to have 3 types of text - heading, subheading, normal text - and that's it. You could write it as:<br />
<br />
<style="text/css"><br />
h1 { font: bold 14px sans-serif blue; }<br />
h2 { font: italic 12px sans-serif red; }<br />
norm { font: 10px sans-serif black; }<br />
</style><br />
<br />
Any time you wanted a headline type text, you'd start the headline with <h1> and it would turn out like this.<br />
<br />
Subheadline text would turn out like this.<br />
<br />
Normal text would be a bit different. You'd have to have the 'normal' sections written as <p class="norm">.<br />
<br />
2. If you're going to be getting complicated and having different sections have different colours and/or sizes and/or styles, you'd be better off creating a CSS page and linking to it.<br />
<br />
It's a simple enough process. Decide what styles of text you want and give each style a unique name. Even just text1, text2, and so on, should work. Save the file with the extension .css and add this to the <head> tag:<br />
<br />
<link href=http://www.htmlforums.com/archive/index.php/"http://www.mysite.com/myfolder/styles.css" rel=stylesheet type=text/css> <br />
<br />
... or whatever you've decided to name your CSS file. You'll just have to remember two things - what you've called the style for each section and to add the class="stylename" to each section.<br />
<br />
Clear as mud?
<br />
<br />
There is 300+ pages of information (and some of it you may never need), but the World Wide Web Consortium (<!-- m --><a class="postlink" href="http://www.w3.org">http://www.w3.org</a><!-- m -->) has pdf files that you can Download <!--more--> on both HTML coding and CSS. I think both topics have the information on web pages, as well, but I find Download <!--more-->ing the stuff is a bit easier. I have both sections printed out so I can refer back to it. *lol* Usually at times like this, when I'm too lazy to open a second window.<br />
<br />
Just do me a favour? *g* I use a Mac and font sizes below 2 (9px) are almost impossible for me to read, depending on the background. Light text on a dark background tends to get mushy at 9px, too. Nothing too small, please?<br />
<br />
Peg<!--content-->yup :thumbup: <br />
<br />
one correction though, you can't include the color in the shorthand form, it has to be separate, ie:<br />
<br />
h1 { font: bold 14px sans-serif;color:blue; }<br />
<br />
and just a couple of examples of using classes:<br />
<br />
h1.title { font: bold 14px sans-serif;color:blue; }<br />
h1.subtitle { font: bold 12px sans-serif;color:blue; }<br />
<br />
<br />
and then call the styling you wish to apply to a particular h1 tag like so:<br />
<br />
<h1 class="title"><!--content-->Ok, thanks guys. I guess thats it. Peg can you repeat what you asked for me, i didnt get it. Or am i wrong?)) Not so familiar with english, calling from Greece, u see If you requested somth from me, can you rephrase please ? Thank you very much for one more time <!--content-->Ah. Okay. My apologies.<br />
<br />
I'm not sure which question you're referring to, but "Clear as mud" is sort of a backwards way of asking if what I've said makes sense to you. <br />
<br />
The other question I asked was about font sizes. You mentioned that you wanted to make your fonts a specific size and unchangeable, but what can be read on a computer using "Windows" isn't always readable on a Macintosh computer.<br />
<br />
Or did I confuse you right from the start? <br />
<br />
You can put this:<br />
<br />
<style="text/css"><br />
h1 { font: bold 14px sans-serif blue; }<br />
h2 { font: italic 12px sans-serif red; }<br />
p { font: 10px sans-serif black; }<br />
</style><br />
<br />
...in your <head> tag and any time you use <h1>, the text will look like the blue text I showed you. Using <h2> will look like the red text. The regular <p> tags would be in a black, 10 pixel size sans-serif. <br />
<br />
That's one way of adding CSS to your page.<br />
<br />
The other way is to make a list of the styles you want to use and save it as a .css file. You can use Notepad for things like that. In the <head> tag, you would add this:<br />
<br />
<link href=http://www.htmlforums.com/archive/index.php/"http://www.mysite.com/myfolder/styles.css" rel=stylesheet type=text/css> <br />
<br />
... with "mysite.com", "myfolder" and "styles.css" being changed to whatever names you use for the address of where you've stored the css file. Those are just names I used to give you an example. <br />
<br />
Does that help you understand?<br />
<br />
Peg<!--content-->Ok Peg, i got it. My english are kinda rusty i guess Thank you very much explaining that to me for one more time. Greetings from Greece. <!--content-->>> <link href=http://www.htmlforums.com/archive/index.php/"http://www.mysite.com/myfolder/styles.css" rel=stylesheet type=text/css><br />
<br />
You also need to "quote" the attribute values otherwise the / in the text/css part will simply be interpreted as being the </head> tag by the browser:<br />
<br />
<link href=http://www.htmlforums.com/archive/index.php/"http://www.mysite.com/myfolder/styles.css" rel="stylesheet" type="text/css"><!--content-->The quotes weren't in there? Hmmm...<br />
<br />
You know, you're right, giz! All I did was copy that link from this page and changed the URL. HTMLforums doesn't have the attributes quoted! <gasp!><br />
<br />
Thanks for pointing that out.<br />
<br />
Peg<!--content-->Yeah, that is a wierd bug with unquoted meta data that includes spaces or / slashes. One that has caught many people out many times (me included).<br />
<br />
<br />
I see that the forum CSS doesn't validate either!<!--content-->
Any ideas ? Thanks.<!--content-->welcome to the forums
<br /><br />
sure, no probs, put this in your css<br />
<br />
P { font:bold italic 12px sans-serif }<br />
<br />
<br />
remove what you don't need, ie bold and italic, change the selector to the one you wish to apply it to, if you are unfamiliar with css post back
<!--content-->Well, what do you mean by saying css ? Kinda newbie in this field When you say "P { font:bold italic 12px sans-serif }", i put this in the code as it is (including the 'P') ?. Waiting for your answer dude. Thanks.<!--content-->Basically, yes.<br /><br />
Part of the code would look like this:<br />
<br />
<html><br />
<head><br />
<title>Page Name</title><br />
<style="text/css"><br />
P { font:bold italic 12px sans-serif }<br />
</style><br />
</head><br />
<body><br />
<br />
However, that's if you want everything in bold italics. Otherwise, just include the 12px and sans-serif information. You could add your colour information here, too, if you wanted a text colour other than black.<br />
<br />
Does that help?<br />
<br />
Peg<!--content-->Ok, i got it. But what if i want a style in a specific part of the page? Can i put the tags <style> wherever i want into the page? Probably a css file is like a guide to a web page. How can i connect a css file with a html file and how can i use information from css file in speficic parts of the html file? I hope im not getting too annoying
Thanks<!--content-->*g* Never annoying. I need the practice myself. <br /><br />
Okay, there's two ways of doing this, depending on how much you want different. Style tags generally go into the <head> tags, but single changes, like having one instance of h2 {font: italic 12px sans-serif green;} can go into the specific <h2> tag. <br />
<br />
1. You can put everything within the <head> tags. Let's say you're going to have 3 types of text - heading, subheading, normal text - and that's it. You could write it as:<br />
<br />
<style="text/css"><br />
h1 { font: bold 14px sans-serif blue; }<br />
h2 { font: italic 12px sans-serif red; }<br />
norm { font: 10px sans-serif black; }<br />
</style><br />
<br />
Any time you wanted a headline type text, you'd start the headline with <h1> and it would turn out like this.<br />
<br />
Subheadline text would turn out like this.<br />
<br />
Normal text would be a bit different. You'd have to have the 'normal' sections written as <p class="norm">.<br />
<br />
2. If you're going to be getting complicated and having different sections have different colours and/or sizes and/or styles, you'd be better off creating a CSS page and linking to it.<br />
<br />
It's a simple enough process. Decide what styles of text you want and give each style a unique name. Even just text1, text2, and so on, should work. Save the file with the extension .css and add this to the <head> tag:<br />
<br />
<link href=http://www.htmlforums.com/archive/index.php/"http://www.mysite.com/myfolder/styles.css" rel=stylesheet type=text/css> <br />
<br />
... or whatever you've decided to name your CSS file. You'll just have to remember two things - what you've called the style for each section and to add the class="stylename" to each section.<br />
<br />
Clear as mud?
<br /><br />
There is 300+ pages of information (and some of it you may never need), but the World Wide Web Consortium (<!-- m --><a class="postlink" href="http://www.w3.org">http://www.w3.org</a><!-- m -->) has pdf files that you can Download <!--more--> on both HTML coding and CSS. I think both topics have the information on web pages, as well, but I find Download <!--more-->ing the stuff is a bit easier. I have both sections printed out so I can refer back to it. *lol* Usually at times like this, when I'm too lazy to open a second window.<br />
<br />
Just do me a favour? *g* I use a Mac and font sizes below 2 (9px) are almost impossible for me to read, depending on the background. Light text on a dark background tends to get mushy at 9px, too. Nothing too small, please?
<br /><br />
Peg<!--content-->yup :thumbup: <br />
<br />
one correction though, you can't include the color in the shorthand form, it has to be separate, ie:<br />
<br />
h1 { font: bold 14px sans-serif;color:blue; }<br />
<br />
and just a couple of examples of using classes:<br />
<br />
h1.title { font: bold 14px sans-serif;color:blue; }<br />
h1.subtitle { font: bold 12px sans-serif;color:blue; }<br />
<br />
<br />
and then call the styling you wish to apply to a particular h1 tag like so:<br />
<br />
<h1 class="title"><!--content-->Ok, thanks guys. I guess thats it. Peg can you repeat what you asked for me, i didnt get it. Or am i wrong?
)) Not so familiar with english, calling from Greece, u see If you requested somth from me, can you rephrase please ? Thank you very much for one more time <!--content-->Ah. Okay. My apologies.<br /><br />
I'm not sure which question you're referring to, but "Clear as mud" is sort of a backwards way of asking if what I've said makes sense to you. <br />
<br />
The other question I asked was about font sizes. You mentioned that you wanted to make your fonts a specific size and unchangeable, but what can be read on a computer using "Windows" isn't always readable on a Macintosh computer.<br />
<br />
Or did I confuse you right from the start? <br />
<br />
You can put this:<br />
<br />
<style="text/css"><br />
h1 { font: bold 14px sans-serif blue; }<br />
h2 { font: italic 12px sans-serif red; }<br />
p { font: 10px sans-serif black; }<br />
</style><br />
<br />
...in your <head> tag and any time you use <h1>, the text will look like the blue text I showed you. Using <h2> will look like the red text. The regular <p> tags would be in a black, 10 pixel size sans-serif. <br />
<br />
That's one way of adding CSS to your page.<br />
<br />
The other way is to make a list of the styles you want to use and save it as a .css file. You can use Notepad for things like that. In the <head> tag, you would add this:<br />
<br />
<link href=http://www.htmlforums.com/archive/index.php/"http://www.mysite.com/myfolder/styles.css" rel=stylesheet type=text/css> <br />
<br />
... with "mysite.com", "myfolder" and "styles.css" being changed to whatever names you use for the address of where you've stored the css file. Those are just names I used to give you an example. <br />
<br />
Does that help you understand?<br />
<br />
Peg<!--content-->Ok Peg, i got it. My english are kinda rusty i guess
Thank you very much explaining that to me for one more time. Greetings from Greece. <!--content-->>> <link href=http://www.htmlforums.com/archive/index.php/"http://www.mysite.com/myfolder/styles.css" rel=stylesheet type=text/css><br /><br />
You also need to "quote" the attribute values otherwise the / in the text/css part will simply be interpreted as being the </head> tag by the browser:<br />
<br />
<link href=http://www.htmlforums.com/archive/index.php/"http://www.mysite.com/myfolder/styles.css" rel="stylesheet" type="text/css"><!--content-->The quotes weren't in there? Hmmm...<br />
<br />
You know, you're right, giz! All I did was copy that link from this page and changed the URL. HTMLforums doesn't have the attributes quoted! <gasp!><br />
<br />
Thanks for pointing that out.<br />
<br />
Peg<!--content-->Yeah, that is a wierd bug with unquoted meta data that includes spaces or / slashes. One that has caught many people out many times (me included).<br />
<br />
<br />
I see that the forum CSS doesn't validate either!<!--content-->