[Guide] How to add CSS to your webpage.

Discussion in 'Archives' started by Rawr, Aug 6, 2008.

Sign in to Post
Thread Tools

Thread Tools

  • Thread ID:
[Guide] How to add CSS to your webpage.
  1. Unread #1 - Aug 6, 2008 at 11:03 PM
  2. Rawr
    Joined:
    Jul 18, 2008
    Posts:
    2,442
    Referrals:
    10
    Sythe Gold:
    13
    Pokémon Trainer

    Rawr Addict.
    Retired Sectional Moderator $100 USD Donor

    [Guide] How to add CSS to your webpage.
    If you're building a website, or have already built one but haven't used CSS in it, you should do so! It saves a lot of space and time when making a multiple based website.

    Requirements -
    - Website building knowledge.
    - Able to know how to copy and paste.

    Advantages of using CSS for your website -
    - Time saving - You don't have to continually add your Style to every Template, with this it's just one line of code linking to your CSS sheet.
    - Space savor - In your Templates; you won't have to have as much code.
    - Easier - I just find this easier to do.
    - Organized - Having CSS doesn't make your work so 'Crowded', it gives you space to put your other code in your templates.

    Step 1 - Creating your CSS

    CSS is short for Cascading Style Sheet, meaning you can use one CSS file for multiple templates for your website. This not only saves time and effort, but makes your template much cleaner.

    In your Main folder create a new notepad document called "Index.CSS" and Save it for now; still leave this open for later.

    [​IMG]

    Step 2 - Adding the code to your CSS

    Okay, now open up your Main Template and copy all of your code inbetween the <Style> tags and paste it the Index.CSS sheet.

    Save your Index.CSS now, and delete the code from your Main Template you just Copy and Pasted; this includes your <Style> takes as well.

    Step 3 - Linking your CSS to your Template(s)

    Copy and Paste the following code into your Templates in between the <Head></Head> Tags. It doesn't really matter where you place this line of code in between it.

    Code -
    Code:
    <link href="index.css" rel="stylesheet" type="text/css">
    What this line of code means...
    - The (link href="index.css") is telling the template when it runs to link to this css file as a resource for its styles.
    - The (rel="stylesheet") is telling the template what this is; in other words a stylesheet.
    - The (type="text/css") is telling the template that it's a a text CSS file.

    Note: You can create and add more then one CSS sheets to a template.

    Step 4 -

    Save, and test your website. It most likely will work, because this is what I use for my website.

    Hope you like!

    "This Guide on How to add CSS to your website. is © of Rawr Im Phat. Any ripping of this guide will result into a Report, and most likely a BAN."
     
    Share
  3. Unread #2 - Aug 6, 2008 at 11:08 PM
  4. The Dark
    Joined:
    Jan 21, 2007
    Posts:
    1,601
    Referrals:
    0
    Sythe Gold:
    0

    The Dark Guru
    Banned

    [Guide] How to add CSS to your webpage.
    Very basic guide, but a key to a good web developer. Consider writing the advantages on using CSS and expand the guide. Adding some pictures and proof reading it all will help. Not bad.
     
    Share
  5. Unread #3 - Aug 6, 2008 at 11:19 PM
  6. Rawr
    Joined:
    Jul 18, 2008
    Posts:
    2,442
    Referrals:
    10
    Sythe Gold:
    13
    Pokémon Trainer

    Rawr Addict.
    Retired Sectional Moderator $100 USD Donor

    [Guide] How to add CSS to your webpage.
    Okay, thanks.
     
    Share
  7. Unread #4 - Aug 7, 2008 at 9:22 AM
  8. Rawr
    Joined:
    Jul 18, 2008
    Posts:
    2,442
    Referrals:
    10
    Sythe Gold:
    13
    Pokémon Trainer

    Rawr Addict.
    Retired Sectional Moderator $100 USD Donor

    [Guide] How to add CSS to your webpage.
    Added Advantages and more wording in the guide. I don't know where pictures would be helpful, anyone know?
     
    Share
  9. Unread #5 - Aug 7, 2008 at 12:46 PM
  10. The Dark
    Joined:
    Jan 21, 2007
    Posts:
    1,601
    Referrals:
    0
    Sythe Gold:
    0

    The Dark Guru
    Banned

    [Guide] How to add CSS to your webpage.
    Just a pretty web page at the the end that uses CSS. Or a picture of how jumbled the HTML code can look when CSS is not used.
     
    Share
  11. Unread #6 - Aug 7, 2008 at 2:51 PM
  12. Dark boy42
    Joined:
    Aug 26, 2007
    Posts:
    973
    Referrals:
    0
    Sythe Gold:
    0

    Dark boy42 Apprentice
    Banned

    [Guide] How to add CSS to your webpage.
    I kind of misunderstood the title lol (web based CS:S?) lol... great guide nonetheless.
     
    Share
  13. Unread #7 - Aug 7, 2008 at 3:24 PM
  14. Rawr
    Joined:
    Jul 18, 2008
    Posts:
    2,442
    Referrals:
    10
    Sythe Gold:
    13
    Pokémon Trainer

    Rawr Addict.
    Retired Sectional Moderator $100 USD Donor

    [Guide] How to add CSS to your webpage.
    Lol, sorry for the misunderstanding. Thanks for the comment though! :laugh:
     
    Share
  15. Unread #8 - Aug 7, 2008 at 3:30 PM
  16. Xaranx
    Joined:
    Feb 1, 2008
    Posts:
    181
    Referrals:
    0
    Sythe Gold:
    0

    Xaranx Active Member
    Banned

    [Guide] How to add CSS to your webpage.
    Great guide 8/10.
     
    Share
  17. Unread #9 - Aug 7, 2008 at 4:12 PM
  18. orlando_jordan
    Joined:
    Jun 28, 2008
    Posts:
    1,310
    Referrals:
    1
    Sythe Gold:
    0

    orlando_jordan Guru
    Banned

    [Guide] How to add CSS to your webpage.
    8 out of8 needs more work
     
    Share
  19. Unread #10 - Aug 7, 2008 at 5:43 PM
  20. SuF
    Joined:
    Jan 21, 2007
    Posts:
    14,211
    Referrals:
    28
    Sythe Gold:
    1,234
    Discord Unique ID:
    203283096668340224
    <3 n4n0 Two Factor Authentication User Community Participant Spam Forum Participant Sythe's 10th Anniversary

    SuF Legend
    Pirate Retired Global Moderator

    [Guide] How to add CSS to your webpage.
    Very basic, and it only expains how to have an external style sheet, which is basic.... o_O
     
    Share
  21. Unread #11 - Aug 7, 2008 at 6:52 PM
  22. Rawr
    Joined:
    Jul 18, 2008
    Posts:
    2,442
    Referrals:
    10
    Sythe Gold:
    13
    Pokémon Trainer

    Rawr Addict.
    Retired Sectional Moderator $100 USD Donor

    [Guide] How to add CSS to your webpage.
    SuF, the whole point is to have an external style sheet. This is a major space savor in the website world. Yet, some people still put there style in their templates because they don't know how to have or add an External Style Sheet. Which is why I made this guide.
     
    Share
  23. Unread #12 - Aug 7, 2008 at 7:00 PM
  24. SuF
    Joined:
    Jan 21, 2007
    Posts:
    14,211
    Referrals:
    28
    Sythe Gold:
    1,234
    Discord Unique ID:
    203283096668340224
    <3 n4n0 Two Factor Authentication User Community Participant Spam Forum Participant Sythe's 10th Anniversary

    SuF Legend
    Pirate Retired Global Moderator

    [Guide] How to add CSS to your webpage.
    Ok.. But its still basic... And Style stuff within your HTML code is still CSS... D:
     
    Share
< Selling lvl 77 rune pure - 81 str | Lvl 79 Cmb|76 WC|59 Mage|Almost 2m GP!!! >

Users viewing this thread
1 guest


 
 
Adblock breaks this site