Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 7 of 7
  1. #1
    Junior Member spasm attack's Avatar
    Join Date
    Aug 2006
    Location
    Colorado
    Posts
    15
    Member #
    13735
    Hi, I'm in the processess of learning HTML and Java and all that jazz, and I learned about CSS from a book. It said you can do stuff like make a certain background color, font, text color, etc... I was wondering if you can do stuff like make a navigation bar off to the left and have a title with graphics appear on every page with CSS. I looked at the source codes for a couple of websites with what I wanted, but it seems that they used tables. The main reason I'm asking this is to find out if i need to make another trip to the library, because I saw a couple complete books on CSS, but my book covered it in only a dozen pages :alien: . I haven't looked at any HTML creating programs yet, if this is not possible with CSS, do these programs have an interface helps you keep track of tables? I would definately leave a tag or two open if I tried to write one of those suckers manually irate: .
    "There is no spoone" -The Matricks

  2.  

  3. #2
    Senior Member Shani's Avatar
    Join Date
    Nov 2004
    Posts
    1,140
    Member #
    8171
    Wow! That's a huge question...

    CSS is an extremely versatile tool. However some big-huge sites forego the CSS because it takes a little more savvy to make it work cross platform/browser, and they're lazy.

    Benefits
    CSS based layouts result in a smaller file size, meaning a web site can load faster.

    If the client doesn't like the color, or something in the layout, it's a very straightforward fix to ONE file, the .css, instead of a whole LOT of html tables!

    Basics
    When I was introduced to CSS (Okay, I'll date myself... CSS1), we used it primarily for formatting texts: declaring a font, changing the color, making it bold, underlined, or NOT.

    Beginner
    My next formal step with CSS was to use it in conjunction with a "container table" to position the elements within certain areas. In other words... the table had three columns & three rows: The top row was colspan=3 and became the header. All the header elements had to be positioned using CSS (the main nav, the secondary nav, the super nav, logo, etc.) and same applies to the "body" (with the left, middle & right columns) and the "footer."

    Intermediate
    We'll now exit my formal education and get into the part where I learn stuff...

    Background images, hidden text fields, rollovers using color fields, rollovers using images (that automatically pre-load!), positioning, margins & padding, z-index (overlaps), IE hacks...

    Some of these, in fact, do not work w/ HTML alone.

    div vs. span (block vs. inline); class vs. ID vs. element; nesting styles, parents vs. children (oh, cascading!), pseudo classes.

    I could go on for a while, I mean I didn't even get advanced in this post! Advanced is really just putting it all together into a cohesive unit, you're not there yet

    But to get back to your questions... the answers are yes. You can position something on the left of the page; you can have a title bar (if it doesn't change you may want to look into an include, which is a code thing, not a style thing.) You can say, put my title in white on a black background with five pixels in every direction, using 20px fonts and a green border, ten pixels from the top and twenty pixels from the left. And it will do just that!
    Shani

    I have an eye for detail like you'd never believe.

  4. #3
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,723
    Member #
    5580
    Liked
    718 times
    Spasm ...

    The link below is a site where each author uses the same exact HTML
    webpage (the HTML content) .... but each author has created their
    own CSS (Cascade Style Sheet) and their own graphics.

    So, with the same HTML page, you get totally different "look and feel"
    websites. That's the power of CSS.

    http://www.csszengarden.com


  5. #4
    Junior Member spasm attack's Avatar
    Join Date
    Aug 2006
    Location
    Colorado
    Posts
    15
    Member #
    13735
    Hmm... so it looks like I got some more learning to do . I've just been skimming through this book I have about basic HTML. It seems that CSS is definately worth learning, as it could save me time and energy further down the road. So just to be clear, I could create a *.css file that surrounds my page with the works: title bars, banners, navigation bars, search forms, copyright stuff and anything else I can think of and have all my *.html pages reference the external style sheet, and then have my HTML code as simple as
    Code:
     
    <html>
    <head>
     <title>A really cool title</title>
     <link rel="stylesheet" type="text/css" href="mystyle.css">
    </head>
    <body>
     <p>Hey, this is my webpage.  I can put more stuff here if I wanted to, but I don't.</p>
    </body>
    </html>
    and then all that stuff will appear around the body without any more code? I realize that older computers/software and users with slow connections (err wait, will it make it load quicker or slower?), but the type of websites and content I'm interested in making wouldn't be usable by slow and outdated computers anyway.
    Any books or online tutorials you would recommend? I'm considering signing up for a web design class or something at school. This is a lot more complicated than I expected... someone told me that HTML was pretty simple, but they didn't tell me about all this other stuff. I'm planning on sticking with it though!

    That csszengarden is pretty cool.

    Also, should I use XHTML? I hear it's the next big language... If I should, should I learn HTML first and then switch, or just start with XHTML? Thanks for your help by the way.
    "There is no spoone" -The Matricks

  6. #5
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    No, you're confusing CSS with server-side includes. CSS introduces a separation between structure/content and style/layout. The idea is that all your CSS file has is the structure and content (including menus and titles and such), but you use the CSS files to make that content look however you like.

    Server-side includes, on the other hand, let you include content from other places. These are two complementary technologies.

    Concerning good ways to learn CSS, look around, there have been a half dozen threads opened on that subject just in the last month or two :-)

  7. #6
    Senior Member audiofreak9's Avatar
    Join Date
    Apr 2005
    Location
    NJ
    Posts
    339
    Member #
    9584
    Here is a post I did back in June.

  8. #7
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,723
    Member #
    5580
    Liked
    718 times
    Spasm,
    The same explanation, in a different way ...

    Say you have 20 pages. You want them all to have the same "look".

    So, you create one .css file and define how the body, divs, etc. will look.

    Each page uses the same .css file ... so, if you want to change the banner,
    or footer, or background in a section, you only need to change your .css file.

    Every one of your 20 pages will automatically change, because they use that
    same .css file. You will not need to edit every one of your 20 pages.

    ========================

    Using "includes", such as PHP Include is a different topic. If your pages all
    have the extension ".php", you can create one .php file that has, for example,
    your navigation menu. Then, each of your 20 pages can "include" that navigation
    file where you want your menu to appear. If you need to add another link to
    your navigation, you only need to change ONE file .. you will not need to edit
    every one of your 20 pages. This makes changes easy and quick.

    =======================

    So, CSS (Cascade Style Sheets) affects the way your site "looks", and the layouts,
    PHP includes affect the actual content of your pages.



Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 03:09 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com