CSS

Bootstrap is open source and most popular front-end framework for developing responsive, mobile first projects on the web. It's hosted, developed, and maintained on GitHub.

Bootstrap have responsive grids and many components to build a responsive website quickly. Boostrap has much reusable components built to provide iconography, dropdowns, input groups, tootip, navigation, alerts, and much more. By default Boostrap has awesome custom jQuery plugins and it's very easy include all, or one by one.

The DIV movement of getting away from table-based design taught us that tables should be used only when you're presenting a table of data on your website, yet no CSS selector/rule was created to allow us to shade alternate rows a different color.

tr:nth-child(odd)   { background-color:#eee; }
tr:nth-child(even) { background-color:#fff; }

CSS3 introduced a new property background-size that enables you to change the size of background images. That means you can stretch your image horizontally, vertically, or both. You can resize it any way you wish.

The DOCTYPE declaration, which should be the first item to appear in the source mark-up of any web page, is an instruction to the web browser that identifies the version of the mark-up language in which the page is written. It refers to a known Document Type Definition, or DTD for short. The DTD sets out the rules and grammar for that flavour of mark-up, enabling the browser to render the content accordingly.

HTML 5

SASS is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It's translated to well-formatted, standard CSS using the command line tool or a web-framework plugin

First install ruby before installing SASS. SASS is built upon Ruby. If you are working on a MAC, chances are, you already have Ruby installed. If you may to install Ruby in Windows, use this Ruby Installer.

1) Install Ruby from http://rubyinstaller.org/

Making a triangle with CSS is a great skill to have available to you, as it gives you one more way to call attention to an element on the screen. And let's face it, So let's take a look at how to get it done. Creating triangle with pure CSS can be a fun and exploratory process. Creating CSS triangles falls into that group as well. Even though that support for pure CSS triangles goes back to IE7, It's only with the introduction of CSS3 that we can really let it shine.

Web developers can define a media type such as screen or print, and specify the look of the content by specifying conditions such as width, height, or orientation. A media query combines a media type and a condition to specify how web content will appear on a particular receiving device.

The HTML5 specification has added quite a few interesting and useful tags for structuring your markup. For a majority of everyday uses, these tags will replace many of our typical div entries from our code. more browsers are getting compatible with it and with the iPhone choosing this as it’s main multimedia language.

HTML5 has many new syntactical features, which include the <video>, <audio>, and <canvas> elements, as well as the integration of SVG content. Due to these new elements, it will be very easy to integrate multimedia and graphical content to web without using flash and third party plugins. There are also another new elements like <section>, <article>, <header> and <nav> which enrich the semantic value of the document.

When a floated element is within a container box, that element does not automatically force the container’s height adjust to the floated element. When an element is floated, its parent no longer contains it because the float is removed from the flow. You can use 2 methods to fix clearfix & overflow: hidden

Example: