Adding CSS to HTML Externally
The second method to adding CSS to HTML is externally. External CSS is ideal when you have a long CSS, which would otherwise create a huge HTML file. Now we use the simple HTML file again.
Now we create a separate CSS file and save it with the extension of .css and saved to the same folder as you HTML document. Now we must link the two files. To do this, we edit the HEAD of HTML to look like this...HTML Code:<HTML> <head> <title>Combining HTML and CSS</title> </head> <body> A simple tutorial on how to combine HTML and CSS to make a better script. </body> </HTML>
Now we have created a external CSS file.HTML Code:<HTML> <head> <title>Combining HTML and CSS</title> <link rel="stylesheet" type="text/css" href="css.css" /> </head> <body> A simple tutorial on how to combine HTML and CSS to make a better script. </body> </HTML>
Likes: 0
Results 1 to 5 of 5
Thread: [TUT] Combining HTML and CSS
Hybrid View
-
20-01-10, 05:49 AM #1Scout
- Join Date
- Jan 2010
- Posts
- 27
- Post Thanks / Like
- Rep Power
- 17
- Reputation
- 19
-
20-01-10, 05:50 AM #2Scout
- Join Date
- Jan 2010
- Posts
- 27
- Post Thanks / Like
- Rep Power
- 17
- Reputation
- 19
CSS Classes and ID
CSS is made of primarily two main types, ID's and Classes. These are the connection between the HTML and CSS. To differentiate between ID's and classes, a period is used before the class name, and a number sign before the ID name. Below are two examples that should be added to the CSS area of your script.
Now, to allow the ID and class properties to work in HTML, we must add...HTML Code:.classname #idname
The codes above are to be added to an HTML element. And example of which is below.HTML Code:class="classname" id="idname"
For more CSS property help, here is a great website to use. Click hereHTML Code:<div class="classname">Text here</div>
I hope this tutorial helps newcomers and users new to HTML and CSS. If you have any questions, Personal Message me, or post a comment.
-
02-06-10, 03:45 PM #3Beginner
- Join Date
- Oct 2009
- Posts
- 1
- Post Thanks / Like
- Rep Power
- 17
- Reputation
- 1
Awesome Tutorial ;D
I wonder if you could make a tutorial about classes, from PSD to HTML and such x)
Thanks on advantage ;D
Reply With Quote
Bookmarks