HTML 5 and CSS 3 - tricks and workarounds

HTML 5 and CSS 3 explanation coupled with awesome code examples that are readable and easy to understand
3.6 (9 ratings) Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
2,002 students enrolled
$19
$80
76% off
Take This Course
  • Lectures 113
  • Length 5.5 hours
  • Skill Level All Levels
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 2/2016 English

Course Description

If you're searching for a truly valuable course that will impact you with the full knowledge you need to create stunningly displayed websites that will show you are an expert in what you are doing, look no further...

We have designed and recorded this special Tutorial class on HMTL 5 and CSS 3 to ease your worries as it’s the best front end development tutorial you can get in when it comes to real and quick results!

This course will teach you the all the parts of front end development, page linking, and as well as page improvement as the course covers every aspect of HTML5 and CSS 3.

The good thing about this course is you don’t need any previous experience on any of these programming languages because we have prepared video tutorial that covers every aspect of these technologies coupled with awesome code examples that are readable and easy to understand alongside with a very interesting real life code examples analysis on every point instructor will explain.

We will go together through typical problems which any front end developers face with by analyzing real world code examples and will fix those issues in the code together.

Eventually you’ll save a lot of time and will be able to avoid a number of headaches related to finding of appropriate solution for a huge number of daily tasks you’ll face with as front end developers.

Apparently, this is the only course with the option to learn with a mentor, comprehensive materials having code examples and illustrations on every bit of the code of the course. So you guys should be ready to learn effectively using all our tutorial materials as it will cut across all the aspect of HTML 5 and CSS 3.

Happy Learning guys!

What are the requirements?

  • Notepad++ or any other IDE

What am I going to get from this course?

  • Implement modern HTML5 and CSS3 websites
  • Quickly understand code
  • Avoid common mistakes developers have and find elegant solutions quickly

What is the target audience?

  • Beginners who want to learn how to build responsive and beautiful websites and do it professionally
  • Students who have prior HTML5 and CSS3 experience but who struggle to build a professionally looking websites
  • Anyone who wants to expand their skills in HTML5 and CSS3

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

Section 1: Introduction
Intoduction
Preview
00:45
Section 2: What is New in HTML5?
New HTML 5 Elements and API's
Preview
03:51
Elements Removed and Adding New Elements
Preview
02:32
The Complete Shiv Solution
Preview
01:25
Section 3: HTML Layouts
HTML Layout with Div and HTML Layout with Table
Preview
05:38
Website Layout Using HTML5
02:41
Section 4: HTML 5 Semantic
HTML 5 Section and Article
01:38
Header and Footer
01:59
Nav and Aside Element
02:37
Figure and FIgureCaption Elements
01:41
Section 5: Migration to HTML5
Migrating to HTML5 and Changes in Head
01:25
Changing CSS and Body Elements
04:10
Difference between Article, Section, and Div
01:55
Section 6: CSS3 Introduction
Whats New in CSS3 and Border-radius Property
05:49
Border Radius Each Corner
02:50
Including Cross-browser compatibility
02:45
Using border-radius and border-collapse
03:14
CSS3 Filter Blue and Brightness
02:33
Contrast and Drop-Shadow
03:06
Grayscale and Hue Rotation
01:45
Saturate and Multiple Filters
02:21
Using blur background
03:46
How to use cross-browser blurring
02:20
BorderImage Property and Different Slice Values
04:00
BorderImage Outset and Repeat
01:52
Using border image
01:43
Problems using border images
02:54
Multiple Backgrounds and Background Size
05:07
Full Size Background Image and BackgroundOrigin Property
04:32
Background-Clip Property
02:21
How to center a background image
01:45
Adding background image to div using css
02:25
RGBA and HSL Colors
06:36
HSLA and Opacity
02:47
Using button background opacity and text opacity together
02:45
How to give a transparent background to text or image
02:19
LInear Gradients with Angles
05:30
Multiple Color Stops and Transparency
04:00
Radial Gradients and Shape Gradients
04:03
Using a Different Size Keywords
01:38
CSS3 gradient background
03:21
Linear gradient working as background of page
02:21
Text Shadow and Multiple Shadows
02:14
BoxShadow Property and Cards
03:51
Using shadow CSS feature on images
01:26
Styling boxes with shadow effect
02:18
Section 7: CSS3 Text and Web Fonts
Text Overflow and Word Wrapping
04:41
Word Breaking
01:56
Text-overflow property
01:30
Difference between word-break:break-all and word-wrap:break-word
01:45
Font-face Rule and Using the font you want
03:01
Using Bold Text
01:14
Specifying correct folder name for font-face
01:28
Using much less code for implemention a variation of fonts
01:35
Section 8: CSS3 2D and 3D Transforms
Transformations Translate and Rotate
03:07
Scale and Skew Method
02:15
SkewY and Skew Method
01:32
Matrix Method
02:53
2D transforms - how syntax works
01:51
Correct work with transform scale method
01:30
3D Transformations RotateX and RotateY
02:39
Rotate Z
00:53
Work with SVG
01:50
CSS3 3D Transform and IE11
02:04
Section 9: CSS3 Transitions
CSS3 Transitions and Changing Several Property Values
02:54
Speed Curve Transition and Transition Delay
04:55
Transition and Transformation
01:56
Logo with animation
04:48
Adding transition effects to images
03:40
Section 10: CSS3 Animations and images
Keyframes Rule and Animation Delay
04:45
Animation Iteration and Direction
01:35
Animation Timing and Shorthand Property
07:15
how CSS3 Animation works
02:06
How to play reverse keyframe animation for hover off
03:01
Rounded Images and Thumbnails
03:01
Responsive Images and Image Text
02:43
Polaroid Images
02:30
Elegant work work image width and height
01:51
Text on top of the image - typical problem you may get
01:26
Section 11: CSS Buttons and Pagination
Button Styling and Animations
04:45
CSS3 Button Colors and Sizes
06:19
Rounded Buttons and Colored Button Borders
05:37
Hoverable and Shadowed Buttons
13:44
Adding hover effets to button
02:39
CSS Button Value Styling
02:28
Simple Pagination with Active and Hoverable Effects
03:34
Rounded Active&Hoverable Buttons, Bordered Pagination
02:13
Space Between Links and Pagination Size
01:54
Problem with animated pagination using CSS3
02:07

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

IT Solutions, E-learning academy

ITsolutions helps organisations who need to train large numbers of people quickly and cost effectively. The company does this by offering a complete learning tutorials on different programming languages and IT areas.



ITsolution is unique because it encourages its customers to share not just their ideas but also the resources they create in one of the world’s biggest and most active online learning communities. All of this has helped ITsolution customers save nearly $10,000,000.

Ready to start learning?
Take This Course