CSS Training Courses in Dubai

Course Details

CSS training

Course description

This course shows you how to design web pages and create CSS classes from a beginner's level to a more intermediate level. It starts off with basic HTML declarations, properties, values and how to include a CSS style sheet with your HTML code. For those of you who are new to CSS and HTML, we show you step-by-step how to create a CSS file and include it in your HTML code, even if you use a cloud server for your hosting.

We show you how to position your elements, lay out your elements relative to your documents, and style your HTML using predefined CSS values. We introduce you to the common CSS styling that you'll need when you start off designing your pages. If you want to get to know CSS and website design, this course is meant for you, and it can be used by anyone who hasn't even seen one line of CSS code yet. 

Course outline

 

Module 1: CSS2-Introduction

In this module CSS is used to style and lay out web pages — for example, to alter the font, colour, size and spacing of your content, split it into multiple columns, or add animations and other decorative features. This module gets you started on the path to css. v

• Benefits of CSS v
• CSS Versions History v
• CSS Syntax v
• External Style Sheet using v
• Multiple Style Sheets v
• Value Lengths and Percentages

 

Module 2: CSS2-Syntax

In this module, the basic goal of the Cascading Stylesheet (CSS) language is to allow a browser engine to paint elements of the page with specific features, like colors, positioning, or decorations. The CSS syntax reflects this goal and its basic building blocks are v

• CSS Syntax v
• single Style Sheets v
• Multiple Style Sheets v
• Value Lengths and Percentages

 

Module 3: CSS2-Selectors

In this module, CSS selectors define the elements to which a set of CSS rules apply. In this module, you will find how many selectors are there how to use it v

• ID Selectors v
• Class Selectors v
• Grouping Selectors v
• Universal Selector
• Descendant / Child Selectors v
• Attribute Selectors v
• CSS – Pseudo Classes

 

Module 4: CSS2-Color Background Cursor

In this module, CSS Backgrounds and Borders is a module of CSS that lets you style elements backgrounds and borders. Backgrounds can be filled with a color or image, clipped or resized, and otherwise modified. Borders can be decorated with lines or images, and made square or rounded. v

• background-image v
• background-repeat v
• background-position v
• CSS Cursor

 

Module 4: CSS2-Text Fonts

In this module, CSS Fonts that defines font-related properties and how font resources are loaded. It lets you define the style of a font, such as its family, size and weight, line height, and the glyph variants to use when multiple are available for a single character v

• color v
• background-color v
• text-decoration v
• text-align v
• vertical-align v
• text-indent v
• text-transform v
• white-space v
• letter-spacing v
• word-spacing v
• line-height v
• font-family v
• font-size v
• font-style v
• font-variant v
• font-weight

 

Module 5: CSS2-Lists Tables

In this module, lists table that defines how to lay out table data. v

• list-style-type
• list-style-position v
• list-style-image v
• list-style v
• CSS Tables

• border
• width & height
• text-align
• vertical-align
• padding
• Color

 

Module 6: CSS2-Box Model

In this module, CSS box model that defines the rectangular boxes—including their padding and margin—that are generated for elements and laid out according to the visual formatting model. v

• Borders & Outline v
• Margin & Padding v
• Height and width v
• CSS Dimensions

 

Module 7: CSS2-Display Positioning

In this module, the position CSS property specifies how an element is positioned in a document. The top, right, bottom, and left properties determine the final location of positioned elements. v

• CSS Visibility v
• CSS Display v
• CSS Scrollbars v
• CSS Positioning

1. Static Positioning

2. 2. Fixed Positioning

3. 3. Relative Positioning

4. 4. Absolute Positioning v

CSS Layers with Z-Index

 

CSS Floats

In this module, the float CSS property specifies that an element should be placed along the left or right side of its container, allowing text and inline elements to wrap around it. The element is removed from the normal flow of the web page, though remaining a part of the flow (in contrast to absolute positioning). v

• The float Property v
• The clear Property
• The clearfix Hack