You are viewing a single comment's thread from:
RE: CSS for multiple HTML pages, one HTML page change
In your css file, add some classes, like
.bold { font-weight: bold; } .italic { font-style: italic; }
And then in your HTML, use the classes
<p class="bold">This is bold</p>
Good luck!
Thanks Kenny, as always.
My only question now though is: where do I add these classes in the css? In the body{} or somewhere further down the page? Or can these classes simply go anywhere?
You can put your css in a separate text file. Then that file is typically put in a folder called css which is in the same folder where the HTML is. Then add a line to the
<head>section of your HTML file to let it know where to find the css stlyes, like this:<link rel="stylesheet" type="text/css" href="css/style.css">which should work if your css is in a file called style.css
OR you could just put the styles in a
<style>tag in the<head>tag of your HTML file, like<style> .red { color: red; } </style>It might be better to put all your styles for all your HTML pages into one css file because then you can reuse some of the styles on different pages.
I have one external css file, in the same folder as the htm pages. I know how to link them together. However, what I don't know how to do, is how to change ONE html file, while using the same css file for ALL pages.
I simply don't know where to insert tags such as font weight or font style (normal, italics...).
How do I manage to change one single page without messing up the other four pages?
Again, I would appreciate anybody's help!
You can set up one external css file with all the style definitions for all the classes you can then use on any element of any HTML file.
Once you have defined styles in your css file for things like, for example, heading, menu, footer - then you can do things like
<div class="heading">A Heading</div><div class="footer"><The footer</div>Now if you want to have different styles for different headings on different html pages, then you could create a style of heading1, heading2, etc and use a different class on a different page to make it look different.
Your first html page might use an element with class heading1 while your second html page might use the one called heading2. Then you could change the definition of either of those classes without affecting the other.