Saturday, April 14, 2012

Telling the difference between CSS and HTML.

  I'll tell the truth- I didn't know what was what for the longest time, though I knew what various elements did! Once I realized the difference and how to write it in each one- CSS and HTML- it was easier to understand and opened up a whole new world of learning.

   I think this is very important to learn and will help you gain a deeper understanding and also be a basis for future posts.

Here's a short analogy to explain in a quick way what the difference is:
   HTML and CSS are both key parts in a website or webpage. They both work together. HTML is your structure; it is the foundation, the walls, the roof. It's the essence of a house. CSS could be likened as the windows, roofing, doors, flooring, walling, siding, etc.

We'll go over HTML first.

 HTML
    HTML stands for Hyper Text Mark-up Language. To give you a simple definition- it's the structure. It's your sidebar, header, etc.
   You can usually tell HTML by it having these cute little < > things. It has an opening tag and an ending tag.  However- on the ending tag it has a "/" with it. For example, the term "b" (makes bold) in HTML would be written as this:
<b>your text here</b> 

Here's another example. ("i"- the element italic)

<i>your text here</i>

It's very easy to get the hang of and I'll be doing another post on various commonly-used elements.

CSS
  CSS stands for Cascading Style Sheets. It shows how to display HTML. It's your style! It defines your text fonts, colors, backgrounds, etc. for your webpage.

CSS is uncomplicated to write. In fact, CSS was invented because HTML was too extensive to write for larger websites! It's very easy to understand.

For example- the element "bold" would be written as this:

font-weight:bold;

And the element "italic" would be written as this.

font-weight:italic;

Later, we'll be posting about other elements, but right now we want to show you  the difference between CSS and HTML.

(see also: Widening in Minima, Letter Spacing, and an in-depth study of margins and paddings to view various CSS elements and see how they are written.) 



3 comments:

  1. Thanks for this brief over view, Ashlyn! I'm looking forward to learning more about both. :)

    ReplyDelete
  2. Thanks for this post! I knew it, but it was a good little overview for me. Every little thing I pick up here and there helps.

    ReplyDelete
  3. goodness. okay you pretty much read my mind. I was going to comment and ask what is CSS and how does it differ from HTML, but you beat me to it! Thanks so much, I finally understand. :)

    ReplyDelete