Results 1 to 2 of 2

Thread: [CSS Article] - Basic Css Information

  1. #1
    StephenM is offline Net Builder
    Join Date
    Jul 2010
    Posts
    189
    Thanks
    0
    Thanked 0 Times in 0 Posts
    CSS is short for cascading style sheets, and is rapidly approaching the 3rd version of code. CSS make it easier for web designers to change elements across entire sites globally, rather than individual code pages at a time. This can save tremendous amounts of time for everyone involved in the development process. For example previously if you wanted a bold paragraph in size 15px fonts, with red letters you'd have to do some code like this



    <pre class='prettyprint lang-html'><font size="15px"><font color="red">This is bold red font</font></font>

    This is regular font

    <font size="15px"><font color="red">This is bold red font again</font></font>

    </pre>



    You can see all the HTML that is needed to generate a simple color and size change, is more than the actual content. This lead to huge page sizes with little content, and created bottle necks and loads of wasted bandwidth. The solution was CSS. By being able to define styles to classes, ID&#39;s, selectors, and HTML tags themselves, designers are able to roll out changes faster, more efficiently and with less code. For example in CSS to get a red, size 15, bold font it would take slightly more programming in to CSS, but less HTML:



    <pre class='prettyprint'>
    .bigredfont {
    font-size: 15px;
    color: red
    font-weight: strong;
    }
    </pre>



    Then assign the class to a paragraph for example:



    <pre class='prettyprint lang-html'>
    <p class="bigredfont">This is the bold big red font</p>
    </pre>



    The real magic comes in if you wanted to change the big red font from red to gree, and reduce it to 11px. By simply changing a few lines of CSS we don&#39;t have to update any .html files. Imagine this on a large scale now if you have 5000 instances of the big red font, that all need changed to the small green font!



    <pre class='prettyprint'>
    .bigredfont {
    font-size: 11px;
    color: green;
    }
    </pre> actually editing the HTML, the output would become:



    <pre class='prettyprint lang-html'>
    <p class="bigredfont">This is the bold big red font that we changed to the small green font!!</p>
    </pre>



    As you can imagine this is a huge time saver for all webmaster and designers. CSS is used to power thousands of sites, and is nearing the release of CSS3 which will introduce new features and abilities. Try out some other basic CSS abilities like bold font, italic font, colors, sizes, layouts and more in your spare time and you&#39;ll be thankful you did next time you build a site.

  2. #2
    Avian is offline Unknown Net Builder
    Join Date
    Aug 2010
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Nice article. I&#39;m barely surviving when trying to skin vBulletin, this helps a lot.

Similar Threads

  1. newbie looking for information
    By beargy in forum Introduction Forum
    Replies: 1
    Last Post: 19 December, 2010, 06:49 AM
  2. Replies: 2
    Last Post: 25 October, 2009, 06:14 AM
  3. Brief information about keyword density ???
    By ahmedgg in forum Keyword Research
    Replies: 5
    Last Post: 22 August, 2009, 08:09 AM
  4. Please give me any first hand information
    By dini patel in forum Promoting
    Replies: 0
    Last Post: 20 June, 2009, 16:42 PM

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •