|
Menu
|
|
|
|
|
|
Course's author:
|
Go to author's Space
|
|
Course stats:
|
|
|
Favorited: |
5 times |
| |
| Helpful?
|
 1
|
|
 0
|
|
| Feedbacks:
|
1
|
Features
 |
Textual content |
 |
Video tutorial |
 |
Exercise |
 |
Source code |
 |
Downloads |
 |
Recommended post |
|
|
|
|
Online course
Cascading Style Sheets (CSS/CSS3)
In this course, we will learn the details of CSS (Cascading Style Sheets). CSS is a style sheet language that describes the presentation of a document written in a markup language like HTML. Using CSS, the designer can manipulate elements such as layout, colors, and fonts. With CSS, the document content is separated from the presentation, which provides a lot of flexibility in future changes and enables multiple pages to share formatting. A style sheet is made of rules, and each rule is made of one or more selectors and a declaration block. CSS is supported in all major browsers. Some of the latest features might not be, but we will point those out as we are covering them. As we progress through the course, we will also experiment with the new features added in CSS3.
|
Introduction
Vídeo
1) Introduction to CSS
Description: In this video, we start the CSS course. This course covers all you need to know about CSS. We will also discuss the new features added in CSS3. The examples will be simple HTML pages plus the CSS feature we are trying to explain. |
[Mark this item as viewed]
|
Styling Elements
Vídeo
5) List Styling
Description: In this video, we will discuss how to style a list. We will create an unordered list and apply the different styles on it. Along the way, we will learn about the difference between display and visibility. |
[Mark this item as viewed]
|
Vídeo
6) Background
Description: In this video, we will discuss how to work with background. We briefly experimented with backgrounds before. But today we will discuss that in detail. We will start by setting the background color for the page and other elements. |
[Mark this item as viewed]
|
Vídeo
7) Working with text
Description: In this video, we will discuss how to use CSS to style text. There are different properties that give us the control that we need. As we have set the background color, we can also set the color of the text. |
[Mark this item as viewed]
|
Vídeo
8) Links and Fonts
Description: In this video, we will continue our discussion of links and fonts. We will have a brief discussion of fonts, specifically variant, weight, and size. Then we will explain a bit more about links. |
[Mark this item as viewed]
|
Vídeo
12) Floating
Description: In this video, we will see how to float the element to the left or right of the page using the float attribute, add some margin and border to highlight the image and keep it a bit away from the text. And finally, we will see how to display a gallery of images using the float attribute.
|
[Mark this item as viewed]
|
Vídeo
13) Creating Menu
Description: In this video, we will learn how to create a menu from what we have learned so far. We will start by creating an unordered list of items that mimic some of the browser menu elements. |
[Mark this item as viewed]
|
Vídeo
15) Pseudo-Elements
Description: In this video, we will start our discussion by talking about pseudo elements. We will create couple of paragraphs, and see how using pseudo elements we can change the style for the first letter in the paragraph, and the first line as well and so on. |
[Mark this item as viewed]
|
Vídeo
18) Transform
Description: In this video, we proceed with the CSS3 discussion by talking about transforms. We will take the Mr Bool image displayed on the page and try to apply the different transforms to it. |
[Mark this item as viewed]
|
Vídeo
19) Animation
Description: In this video, we will talk about another CSS3 feature, which is animation. Today, we will switch to Notepad++ to align our videos with the user’s feedback. |
[Mark this item as viewed]
|
Vídeo
20) Transition
Description: In this video, we will discuss transitions. Transitions are effects that let an element gradually change from one style to another. We start by indicating the property we want to add the effect to, and then the duration of the effect. |
[Mark this item as viewed]
|
Vídeo
21) Tooltip
Description: In this video, we will talk about how we can create a tooltip using CSS. As you know you can use some JavaScript to handle some tooltip features (like adding a delay before showing the tooltip). |
[Mark this item as viewed]
|
Vídeo
22) CSS Tools Part 1
Description: In this video, I will discuss some of the tools that we can use when creating CSS. So far in this course we have covered the different features we can use in CSS and CSS3. |
[Mark this item as viewed]
|
Vídeo
23) CSS Tools Part 2
Description: In this video, I will continue the discussion of some of the tools that we can use when working with CSS. As I indicated in the previous video, these tools help us create CSS elements faster. |
[Mark this item as viewed]
|
Vídeo
25) Combinators
Description: In this video, we will talk about combinators. So the idea is that if I need to change the style of some elements, how can I have access to descendants, direct children and siblings? |
[Mark this item as viewed]
|
Vídeo
26) Tables
Description: In this video, we will talk about applying CSS to tables. As you know tables still play an important role in html pages. In many cases you need to style those tables in a way to bring attention to the user. |
[Mark this item as viewed]
|
Vídeo
32) Columns and Gradients
Description: In this video, we will continue the column discussion and talk more about gradients. In the previous video, we discussed the columns and how we can specify the count, fill, color, style, and gap. |
[Mark this item as viewed]
|
|
