Course: Developing with CSS3, Sass and Less

$269.00
$325.49 incl. vat

duration: 13 hours |

Language: English (US) |

access duration: 90 days |

Details

In this CSS3 training course you will learn the functions of CSS3 and the extension to Sass and Less. In the course you start with development of styles and styles in various page elements. You will also learn to work with CSS3 animations for the development of attractive websites. At the end of the course you will learn the advanced functions of CSS3 and Sass and Less.

Result

After completing this course you are familiar with the possibilities of CSS3, Sass and Less.

Prerequisites

There is no specific knowledge required.

Target audience

Web Developer

Content

Developing with CSS3, Sass and Less

13 hours

Creating Styles with CSS3 and Styling Text

  • start the course
  • introduce CSS3 and demonstrate how styles can be applied to content
  • describe user agent stylesheets and override them with a CSS Reset
  • demonstrate how to use a rule set to apply a CSS style
  • describe how CSS styles are inherited and cascaded
  • describe how to implement inline CSS styles and discuss their drawbacks
  • implement internal CSS styles
  • reference external CSS style sheets
  • describe basic CSS selectors including the universal, type and id, and class selectors
  • group CSS selectors using child and sibling combinators
  • use CSS attribute selectors to apply styles based one or more of an element's attributes
  • describe CSS pseudo-classes, reasons for their use, benefits and drawbacks, and use pseudo-classes to apply styles
  • describe CSS pseudo-elements, reasons for their use, benefits and drawbacks, and use pseudo-elements to apply styles
  • modify the specificity of a CSS selector
  • use the CSS3 font face rule to apply a web font face
  • use CSS properties to style text
  • use CSS properties such as direction, text-align, text-indent, text-spacing, and word-spacing to position text
  • use CSS text decoration (including level 3 shorthand)
  • use CSS pseudo selectors to style the first letter or line of a paragraph
  • use CSS to style lists
  • use CSS to create custom bulleted lists
  • practice styling text with CSS3

Styling Page Elements using CSS3

  • start the course
  • use CSS to add a border to an element
  • use CSS to add rounded borders to an element
  • use CSS to add blurred edges to an element
  • use CSS to add elliptical corners to an element
  • use CSS to add a drop shadow to an element
  • contrast display and visibility in CSS and use these features
  • use CSS to manipulate color
  • contrast and use CSS opacity or RGBA settings to make an element transparent
  • use CSS to set a background image or color for a page or other element
  • use CSS to apply linear gradients to an element
  • use CSS to apply radial gradients to an element
  • use CSS3 to create gradient text
  • configuring spans with CSS
  • style divs with CSS
  • use basic CSS to draw shapes such as triangles
  • use CSS to change the mouse cursor
  • use CSS to style tables
  • use CSS to apply cell and table borders and to remove white spaces between cells when borders are applied
  • use CSS to specify alternate table row colors
  • use CSS to change a row color when hovered over
  • use CSS properties to format spreadsheet data in tabular format
  • use CSS to display calendars
  • use CSS to style different elements on a html page

Navigation Elements and Animations with CSS3

  • start the course
  • use CSS to style links
  • use CSS to style a list to generate a vertical and horizontal nav bar and display descriptive information
  • use CSS to style nested lists for multilevel navigation
  • configure tabbed navigation using CSS
  • use lists and CSS to create flyout menus
  • use CSS to configure drop-down menus
  • use CSS to style a site map
  • use CSS to apply basic rollover effects to navigation options
  • use CSS to apply rollover images with an image sprite in navigation elements
  • use 2-D transforms of CSS to manipulate elements
  • use 3-D transforms of CSS to manipulate elements
  • use CSS to apply transitions to elements
  • use simple CSS keyframe animations
  • use CSS to apply basic animations to elements
  • apply advanced CSS animation techniques
  • practice creating an animated menu using CSS3

Forms, Positioning, and Layout with CSS3

  • start the course
  • use CSS to style a form
  • use CSS to style Submit buttons
  • insert images in form fields using CSS
  • use CSS to highlight fields when they gain focus
  • use CSS to style form fields according to the validity of their input
  • use CSS to group related fields in a form
  • use CSS to style a range slider on a form
  • use CSS to style a short form as a paragraph with inline fields
  • use CSS to modify form input
  • contrast how block and inline elements display
  • use CSS to implement static and fixed positioning of elements
  • contrast fixed and relative positioning and use CSS to implement relative positioning of elements
  • specify the stacking order with z-index
  • contrast the CSS margin and padding properties
  • use CSS to wrap text around an element
  • use CSS to overlap text on an image
  • use CSS to implement floating elements in your layout
  • use the CSS clear property to improve presentation of other elements after floated elements
  • overlap divs using CSS3
  • use CSS margin auto value to center a layout horizontally and auto value, absolute value and declared height for vertical centering
  • use CSS techniques to create a thumbnails gallery
  • use CSS to create a column layout
  • use CSS box model to create a layout
  • use the CSS box-sizing property
  • practice working with layouts using CSS3

Advanced Options, Responsive Web Design, and Management with CSS3

  • start the course
  • use the CSS3 FlexBox for layout
  • outline the support for CSS3 grid and use it for layout
  • outline the support for CSS3 regions and use them for layout
  • outline the support for CSS3 exclusions and use them for layout
  • outline support for and implement the CSS3 Shapes specification
  • outline support for and implement the CSS3 Filters specification
  • outline support for and implement CSS3 masking
  • outline support for and implement CSS3 clipping and blending
  • use CSS media queries to tailor content for specific devices
  • use CSS to display content correctly on multiple screen sizes
  • use Modernizr to detect CSS3 feature support
  • use CSS to configure responsive images
  • use CSS to resize elements dynamically
  • use CSS3 to generate content
  • access an element's CSS styles with JavaScript
  • change an element's CSS styles with JavaScript
  • access CSS style sheets with JavaScript
  • add a CSS style sheet with JavaScript
  • remove a CSS style with JavaScript
  • enable or disable a CSS style sheet with JavaScript
  • manipulate CSS with jQuery
  • implement advanced experimental CSS3 features and a responsive web design

Extending CSS3 with Sass and Less

  • start the course
  • outline the features of Sass and how to install and use it, outline Sass syntax and create a Sass stylesheet
  • outline the features of SassScript - variables, data types, operations, and use the interactive shell to work with SassScript
  • work with nested CSS rules and reference parent selectors using Sass
  • work with nested CSS properties in Sass
  • use the @import rule in Sass, use partials and nested @imports
  • use nested @media queries
  • use the @extend directive in Sass
  • use the @extend directive for multiple and chained extends
  • use control directives in Sass
  • use the @at-root directive in Sass
  • use the @warn and @debug directives in Sass
  • use @mixin in Sass
  • work with functions in Sass
  • use Sass to extend CSS3
  • describe Less, and how it can be used; install and use Less
  • work with variables in Less
  • work with the Extend pseudo-class in Less
  • work with mixins in Less
  • pass rulesets to mixins in Less
  • use recursive mixins to create loop structures in Less
  • work with mixin guards and CSS guards in Less
  • work with import directives in Less
  • use & to reference parent selectors and to generate selectors in a list
  • use Less to extend CSS3

Course options

We offer several optional training products to enhance your learning experience. If you are planning to use our training course in preperation for an official exam then whe highly recommend using these optional training products to ensure an optimal learning experience. Sometimes there is only a practice exam or/and practice lab available.

Optional practice exam (trial exam)

To supplement this training course you may add a special practice exam. This practice exam comprises a number of trial exams which are very similar to the real exam, both in terms of form and content. This is the ultimate way to test whether you are ready for the exam. 

Optional practice lab

To supplement this training course you may add a special practice lab. You perform the tasks on real hardware and/or software applicable to your Lab. The labs are fully hosted in our cloud. The only thing you need to use our practice labs is a web browser. In the LiveLab environment you will find exercises which you can start immediatelyThe lab enviromentconsist of complete networks containing for example, clients, servers,etc. This is the ultimate way to gain extensive hands-on experience. 

WHY_ICTTRAININGEN

Via ons opleidingsconcept bespaar je tot 80% op trainingen

Start met leren wanneer je wilt. Je bepaalt zelf het gewenste tempo

Spar met medecursisten en profileer je als autoriteit in je vakgebied.

Ontvang na succesvolle afronding van je cursus het officiële certificaat van deelname van Icttrainingen.nl

Krijg inzicht in uitgebreide voortgangsinformatie van jezelf of je medewerkers

Kennis opdoen met interactieve e-learning en uitgebreide praktijkopdrachten door gecertificeerde docenten

Orderproces

Once we have processed your order and payment, we will give you access to your courses. If you still have any questions about our ordering process, please refer to the button below.

read more about the order process

What is included?

Certificate of participation Yes
Monitor Progress Yes
Award Winning E-learning Yes
Mobile ready Yes
Sharing knowledge Unlimited access to our IT professionals community
Study advice Our consultants are here for you to advice about your study career and options
Study materials Certified teachers with in depth knowledge about the subject.
Service World's best service

Platform

Na bestelling van je training krijg je toegang tot ons innovatieve leerplatform. Hier vind je al je gekochte (of gevolgde) trainingen, kan je eventueel cursisten aanmaken en krijg je toegang tot uitgebreide voortgangsinformatie.

Life Long Learning

Follow multiple courses? Read more about our Life Long Learning concept

read more

Contact us

Need training advise? Contact us!


contact