Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
CSS - Web Development Skills
Rating: 3.9 out of 5(37 ratings)
3,085 students

CSS - Web Development Skills

Learn Web Development Essentials
Last updated 9/2021
English
English [Auto],

What you'll learn

  • CSS For Begginers
  • CSS Syntax and Types
  • Background, Styling Fonts and Link Styling
  • CSS Borders and Outline
  • CSS Display, Margin, Padding and CSS Positioning
  • Floating and Aligning

Course content

1 section18 lectures55m total length
  • Introduction to CSS2:12

    Explore the introduction to CSS and how external stylesheets separate presentation from content, enabling consistent styles across a site by editing one file.

  • CSS Syntax2:03

    Define CSS syntax with a selector and declarations inside curly braces, set properties to values with semicolons, and use comments like /* … */; recognize internal and external styles.

  • Types4:16

    Explore the three approaches to styling web pages: inline, internal, and external stylesheets, demonstrating how to apply color and font-size and how to link an external CSS file.

  • Id and Class4:08

    Learn to use id selectors to style a single element with a hash, and class selectors to style many elements with a shared class, including color and font-size changes.

  • Backgroung3:05

    Learn how to apply CSS background properties, including background-image from assets, background-repeat options, background-color with hex or rgb values, and background-position to place images in elements like body and paragraph.

  • Styling Text3:35

    Learn how to style text in CSS by applying color, text-align, text-decoration, text-transform, and text-indent, demonstrated on headings and paragraphs with hex color codes and centered alignment.

  • Styling Fonts2:53

    Explore how to style fonts in CSS using font-family, font-size, font-style, and font-weight, with examples of italic, oblique, bold, and precise pixel values.

  • Link Styling3:58

    Learn to style links with css across states like unvisited, visited, hover, and active, using color, background-color, and font size to create dynamic link visuals.

  • CSS Borders3:28

    Explore how to apply CSS borders to elements using border-style, border-width, and border-color, including setting per-side values for top, right, bottom, and left.

  • Styling Table3:39

    Master how to style Pebble tables by applying table, header, and data properties with selectors, setting borders, backgrounds, text colors, and alignment, and adjusting height and width for responsive layouts.

  • List3:52

    Learn how to style ordered and unordered lists with CSS, using list-style-type values like circle, square, lower alpha, and roman numerals, and optional list-style-image.

  • CSS Outline2:10

    Learn to use CSS outline to surround elements without changing their size, compare it with borders, and apply width, style, and color with values like thin, medium, thick, and dotted.

  • Margin2:22

    Master how the css margin property creates space around elements with independent top, right, bottom, and left margins and a shorthand form, and apply margins to a heading and paragraph.

  • Padding3:01

    Master CSS padding by learning how the space between element content and its border works, including independent top, right, bottom, and left values and the shorthand property, with practical examples.

  • CSS Display2:31

    Explore how CSS display and visibility properties control element rendering and layout, comparing visibility: hidden with display: none and showing how each affects space on the page.

  • CSS Positioning3:42

    Learn how css positioning controls element layout by using static, fixed, relative, and absolute methods, and apply top, right, bottom, and left to position elements.

  • Floating1:57

    Learn how to use CSS float to push an element left or right so surrounding text wraps around it; see an image floated to the right beside a paragraph.

  • Aligning2:12

    Learn to align text and center elements in CSS using text-align and margin properties, centering a paragraph with text-align center or margins auto at 50% width and pink background.

Requirements

  • There's no pre-requisite at all.

Description

If HTML is our body then CSS is cloths. Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language.

HTML and CSS are the two most important languages for a new web developer to learn. They are also the easiest. If you’ve always wanted to build webpages, but were intimidated by the code, this course will help you learn your languages quickly and easily.

CSS is designed to enable the separation of presentation and content, including layout, colors, and fonts. This separation can improve content accessibility, provide more flexibility and control in the specification of presentation characteristics, enable multiple web pages to share formatting by specifying the relevant CSS in a separate .css file which reduces complexity and repetition in the structural content as well as enabling the .css file to be cached to improve the page load speed between the pages that share the file and its formatting.

CSS has a simple syntax and uses a number of English keywords to specify the names of various style properties.

A style sheet consists of a list of rules. Each rule or rule-set consists of one or more selectors, and a declaration block.

Before CSS, nearly all presentational attributes of HTML documents were contained within the HTML markup. All font colors, background styles, element alignments, borders and sizes had to be explicitly described, often repeatedly, within the HTML. CSS lets authors move much of that information to another file, the style sheet, resulting in considerably simpler HTML.

For example, headings (h1 elements), sub-headings (h2), sub-sub-headings (h3), etc., are defined structurally using HTML. In print and on the screen, choice of font, size, color and emphasis for these elements is presentational.

Who this course is for:

  • Everyone who wants to learn to use CSS