Learn CSS3 - For Beginners

What you will learn

  • Styling Websites using different CSS properties.
  • How to set colours, background colours, adding background images.
  • Changing font sizes, font family and other related things.
  • You will learn how to add border and border radius to html elements.
  • You will learn about adding shadows to text, images and other html elements.
  • You will learn about the most popular layout properties.
  • You will about flexbox and properties related to it to make beautiful layouts.
  • Grid system which is two-dimensional layout property to make layouts.
  • You will also learn how to make responsive websites using Media Queries.

Course Outline


After completing course on CSS you will be able to style your website to make it look good. HTML is just used to make Skelton and defining content on the website. If you want to make your website, look good you will have to learn CSS in order to style your website. You can make layout of website using things like flexbox and grid, which are the two most popular css properties to make layout of a website. You will also learn about media queries which you can use to make your website responsive so that it looks better on small size devices.


CSS stands for Cascading Style Sheet. It is a styling language which is used to style your website. By using CSS you can create look and feel of a website. It is the most popular technology in the market to style websites. After learning CSS you can move on the CSS frameworks like Bootstrap or tailwind css.  You can also learn CSS Pre-processors like SASS or Less which comes up with more features on top of simple CSS Properties.



Before starting this course, you should have a working knowledge of Following: 

  • Basic Knowledge of HTML

This training is compatible with Windows 7, Windows 8, Windows 8.1, Windows 10, and MAC operating system.


You are hereby advised to visit www.virtualacademy.pk and get yourself certified in CSS Beginners to advance course, furthermore you'll have to meet the following criteria for earning this particular Registered Certification.

  • You will have to complete all 52 lessons through Virtual Academy Online Learning Management System at www.virtualacademy.pk.
  • Every lesson has 3 to 5 quizzes, which you must have to pass with 70% marks. 
  • You need to submit your project/assignments on time.
  • After completion of Virtual Academy offered CSS Basic to Advanced Training lessons via www.virtualacademy.pk Online Learning Management System there will be final exam which comprises of 50 to 100 questions.

After having assessment of your account with www.virtualacademy.pk whether you meet all the above terms and conditions, then we will dispatch your Certificate/Diploma at your given address.

Course Contents 

  • Introduction to CSS
  • Ways to implement CSS 
  • How to add CSS in HTML
  • Basic Selectors in CSS
  • Color and background-color in CSS
  • Borders in CSS
  • Outline in CSS 
  • Margin in CSS 
  • Padding in CSS
  • Height and Width in CSS
  • Box-sizing in CSS 
  • Overflow in CSS
  • Border-radius in CSS
  • Box-shadow in CSS
  • Font-sizes in CSS
  • Font-family in CSS 
  • How to add google fonts in CSS
  • Font-weight in CSS
  • Font-style in CSS
  • Line-height in css 
  • Text-formatting in CSS
  • Text-align
  • Text-transform
  • Word-spacing
  • Letter-spacing
  • Text-decoration in CSS
  • Text-shadow in CSS
  • List style in CSS
  • Background image in CSS
  • Background size in CSS
  • Linear-gradient in CSS
  • How to add gradient in CSS
  • Display property in CSS
  • Position in CSS
  • Z-index in CSS
  • What is Position in CSS
  • What is z-index in CSS
  • Cursor in CSS
  • How to change cursor in CSS
  • Float in CSS
  • What is float in CSS
  • Clear in CSS
  • Media Query in CSS
  • How to use media query in CSS
  • Making responsive website using Media Query
  • What is CSS variable
  • Filter property in CSS
  • User select in CSS
  • How to stop user copying text from website.
  • Pseudo Elements in CSS
  • Before and after in CSS
  • How to add font awesome icons 
  • What is Flexbox in CSS
  • Flex-wrap and flex-flow in CSS
  • Justify-content in CSS flexbox
  • Flexbox justify-content 
  • Align-items in CSS flexbox
  • Align-content in CSS flexbox
  • Align-self in CSS flexbox
  • Flex-grow in CSS flexbox
  • Flex-shrink in CSS flexbox
  • Flex-basis in CSS flexbox
  • Transition in CSS
  • Transform in CSS
  • Animation in CSS
  • What is grid system in CSS
  • Grid-column and rows
  • Grid-gap in CSS
  • Item Position in CSS Grid
  • Item spanning in CSS grid
  • Grid template area in CSS grid

Final Exam and Certification


  • Arslan Asif
    05 February 2024

    Excellent platform...

  • Muhammad Asif Saleem
    05 February 2024

    Such an efforts...

  • Muhammad Asim Yasin
    05 February 2024

    Very effective...

  • Muhammad Asim Yasin
    05 February 2024

    Mashallah Sir, carry on...

  • Umair Ansari
    06 February 2024


  • Muhammad shafiq
    23 June 2024

    Thank you for making these tutorials... Its going to help me pass my final exams as I missed a lot of classes due to personal reasons... Appreciate it and your personality is just so welcoming which makes it so much easier...

Leave a Comment