TeachUrselfOrDieAFool: HTML and CSS

A while ago I was adjusting the blog's CSS to colorize code (mainly C# for now) snippets and I made a post as a test. And someone asked in a comment what CSS was. So, this is a brief introduction about HTML and CSS and some useful links at the end of the post.

HTML (Hyper Text Markup Language)

HTML is a markup language used for writing webpages. It consists of nested tags to describe the structure of text-based information.

HTML syntax is pretty simple. HTML consists of tags. A tag is some text surrounded by angle brackets like the tag <head>. Each tag has an end tag like </head>

Here is a Hello World HTML page. Copy-paste the code in notepad and save the file as "Hello.html" and make sure the extension is .html or .htm but not .txt

<html>
 <head>
 <title>My first HTML page</title>
 </head>
 <body>
 Hello, world!
 </body>
</html>

CSS (Cascading Style Sheets)

In the previous Hello World example. You see the and surrounding "world!". This tag mean the text is bold. Other tags like , ... and attributes are used to format the text in the browser. But hard coding formatting and styles into HTML is hard and not customizable.

CSS is a stylesheet language to describe the presentation of markup language documents. Instead of hard coding embedded styles or tags in HTML you can define a styles for the page and/or link to external .css files.

In the previous HTML code you can set the background color of the body of the document like this.

<body style="background-color: Red; font-size: large">
Hello, world!
</body>

Or, you can define write the previous page as.

<html>
 <head>
 <title>My first HTML page</title>
 <style type="text/css">
 body {
 background-color: Red;
 font-size: large
 }
 </style>
 </head>
 <body>
 Hello, world!
 </body>
</html>

http://www.w3schools.com/html/default.asp
http://www.w3schools.com/Css/default.asp
http://www.codeproject.com/KB/HTML/htmlbeginner.aspx
http://www.codeproject.com/KB/HTML/cssbeginner.aspx