CSS Tutorials

Cascading Style Sheets or CSS, as it is informally known, is the premier developer’s tool for designing high-end websites. CSS language works with HTML to define the contents of a website with ease and flexibility in a straightforward process. Adjusting layouts and style sheets are manipulated with CSS. CSS saves programmer / designer’s time and energy in adjusting changes to the development of a website by placing the code directly into the HTML document head, and/or in a separate sheet for simple website alteration.

CSS has the additional benefit of reducing the file size of HTML documents, ridding the overall website of presentation attributes and image spacing in order to provide faster site navigation. CSS provides the programmer with secure style sheets that can be linked to a single document, ensuring correct presentation on different media including browsers, handheld devices, projectors and printers.

Tutorials and training related to CSS programming language are provided with full information on CSS Syntax, CSS Background, Working with Text and Fonts, creating Elements and Element Displays, Pseudo Classes, Media Styles, Borders, Margin, Padding, Dimensions and Colors. Sample code is supplied for the experienced or beginner developer to learn everything there is to know to create and design a dynamic, successful and professional-looking website.

1. Getting Started with CSS

   Getting Started with CSS In this tutorial you will learn about Cascading Style Sheets CSS Introduction to CSS What you should already know History What is CSS CSS saves a lot of work and time CSS reduces the file size of HTML documents and CSS can be designed for different media What you should already know The tutorial assumes that

2. CSS Syntax

   CSS Syntax In this tutorial you will learn about Cascading Style Sheets CSS Syntax Rule set Combining selectors The class selector The id selector and Comments Rule set A rule or rule set tells the browser how to render an element the rule set consists of the following The selector represents the HTML element to be affected by

3. CSS External and Internal style Sheets

   CSS External and Internal style Sheets In this tutorial you will learn about Cascading Style Sheets CSS Applying CSS External style sheets Internal styles Inline styles and Multiple style sheets There are different types for specifying styles to be used with HTML documents they can be specified in an external CSS file inside the head

4. CSS Background

   CSS Background In this tutorial you will learn about Cascading Style Sheets CSS Background Background Color Background image Repeating background image Background position and Background attachment. Background color To set the background color of an element use the background-color” property. Example body background-color

5. CSS Text

   CSS Text In this tutorial you will learn about Cascading Style Sheets CSS Text Text color Text background color Text direction Text align Text indent Text transform Text decoration Letter spacing and Word spacing. Text color To set the text color use the color” property. Example p color FF0000; h1

6. CSS - Working with Fonts

   CSS Fonts In this tutorial you will learn about Cascading Style Sheets CSS Fonts Font family Font size Font weight Font style and Font variant. Font family To set the font for a specific text use the property font-family” the value can be more than one family separated with a comma the browser will display the text using

7. CSS Borders

   CSS Borders In this tutorial you will learn about Cascading Style Sheets CSS Borders Border width Border style Border color and Using the shortcut Borders in CSS are not just the table borders as in HTML with CSS any HTML element can have borders CSS adds many effects to be applied to these borders. Border width To set the width of a border

8. CSS Margin

   CSS Margin In this tutorial you will learn about Cascading Style Sheets CSS Margin and Using the shortcut. The margin is the space around the element from the four sides the margin attributes enables you to increase or decrease this space; the space can be a negative value which may make elements overlap. Using margins is very easy and straight

9. CSS Padding

   CSS Padding In this tutorial you will learn about Cascading Style Sheets CSS Padding The padding is the space between the element border and the element content from the four sides the padding attributes enables you to increase or decrease this space; unlike spacing padding space values can t be negative. To declare the padding you can use

10. CSS List

    CSS List In this tutorial you will learn about Cascading Style Sheets CSS List List style type List style position List style image and Using the shortcut. List style type To set the list style marker type use the property list-style-type” this property can have on of the following values none circle disc square decimal

11. CSS Dimensions

    CSS Dimensions In this tutorial you will learn about Cascading Style Sheets CSS - Dimensions Line height Width and Height. The dimension properties enable you to increase or decrease the height and width of HTML elements. Line height To set the distance between the lines of an element use the property line-height” the value

12. CSS Elements Display

    CSS Elements Display In this tutorial you will learn about Cascading Style Sheets CSS - Elements Display Float Position Visibility Cursor Vertical align and z-index. The display properties enable you to set the way to display elements and the position of the element relative to another element or to the whole document. Float To set the

13. CSS Pseudo Classes

    CSS Pseudo Classes In this tutorial you will learn about Cascading Style Sheets CSS - Pseudo Classes Link First letter and First line CSS has pre-defined pseudo classes. pseudo class has special syntax the rule starts with the selector then the pseudo class and finally the declaration the selector and the pseudo class are separated with

14. CSS Media Types

    CSS Tutorials Lesson 14 Media Types In this tutorial you will learn about Cascading Style Sheets CSS - Media Styles Internal different media CSS and External CSS files. CSS adds support for different media types you can create many styles and each style defines how the document will be styled when its media type is used. There are

15. Working with CSS Units, Colors and References

    CSS Units Colors and References In this tutorial you will learn about Cascading Style Sheets CSS Units and Colors Percentage Values Colors References - Font and Text Color and Background Layout Classification Positioning and Pseudo-classes. Units and Colors Percentage Percentage values have to be followed by . Values