Nehasolanki at 11:10, 9 February 2021

2021-02-09T11:10:17Z

Nancyvarkey at 11:47, 4 February 2021

2021-02-04T11:47:15Z

Nehasolanki at 08:35, 3 February 2021

2021-02-03T08:35:37Z

Pravin1389 at 16:43, 2 February 2021

2021-02-02T16:43:48Z

Nehasolanki: Created page with "'''Title of the script: '''Overview of CSS '''Author:''' Neha Solanki '''Domain Reviewer: '''Ankita Maske, Om Prakash Soni '''Novice Reviewer: '''Madhuri Ganapathi '''Keyw..."

2021-01-27T11:33:10Z

Created page with "'''Title of the script: '''Overview of CSS '''Author:''' Neha Solanki '''Domain Reviewer: '''Ankita Maske, Om Prakash Soni '''Novice Reviewer: '''Madhuri Ganapathi '''Keyw..."

New page

'''Title of the script: '''Overview of CSS

'''Author:''' Neha Solanki

'''Domain Reviewer: '''Ankita Maske, Om Prakash Soni

'''Novice Reviewer: '''Madhuri Ganapathi

'''Keywords: '''CSS, HTML, Web Page, Web Design, Video Tutorial, Spoken Tutorial

{| border="1"
|-
| | '''Visual Cue'''
| | '''Narration'''
|-
| | Slide: Title
| | Hello and welcome to the spoken tutorial on “Overview of '''CSS'''”.
|-
| | Slide: Learning Objectives
| | In this tutorial, we will learn:

* About '''CSS '''and
* The content available in various tutorials in this series

|-
| | Slide: '''CSS'''
| | What is '''CSS'''?

'''CSS''' stands for '''Cascading Style Sheet.'''
|-
| | Slide: '''CSS'''
| |
* It''' '''is a '''style sheet''' language.
* It is used to '''style''' documents written in '''markup''' language like''' HTML''', '''XML '''etc.
* It is an independent file and saved with '''[dot] css (.css)''' extension.

|-
| | Slide: '''CSS'''
| |
* It allows '''developers''' to control how the '''webpage''' should be displayed.
* For e.g color, font, space, etc.
* It is platform independent and hence works on all '''operating systems'''

|-
| | Slide: Prerequisites for using '''CSS'''
| | To work with '''CSS,''' we need-

* A '''text editor '''or a '''WYSIWYG editor''' to
** write our '''CSS '''code and
** understand various '''CSS '''properties
* A '''web browser''' to display the '''formatted''' content.

|-
| | Slide: For recording of '''CSS''' series
| | Throughout this series I will be using:
* '''CSS3'''
* '''HTML5'''
* '''gedit Text Editor'''
* '''Firefox web browser '''and
* '''Ubuntu Linux OS v 18.04'''

|-
| |
| | Now, we will briefly go through some of the individual tutorials in this series.
|-
| | Glimpse of First CSS File

[Video:

00:00 - 00:04

03:35 - 03:43

05:44 - 05:50 ]

| | '''First CSS File '''is the introductory tutorial of the series.

In this tutorial we will learn how to create a '''CSS''' file and the '''syntax''' of '''CSS.'''

We’ll also see how to '''link''' a '''CSS''' file with an '''HTML''' file and see the output on a '''web browser'''.
|-
| | Glimpse of Dimensions and Measuring Units

[Video:

00:00 - 00:04

04:05 - 04:12

07:51 - 07:57 ]
| | '''Dimensions and Measuring Units '''is the next tutorial.

In this, we’ll learn about measuring '''units''' and''' '''width & height properties in '''CSS.'''
|-
| | Glimpse of Box Model

[Video:

00:00 - 00:03

01:27 - 01:36

09:57 - 10:02 ]
| | The next tutorial is '''Box Model''', in which we’ll learn about '''CSS''' '''Box Model '''and its '''layers'''.

We will also learn about the '''Box sizing.'''
|-
| | Glimpse of Background

[Video:

00:00 - 00:03

04:26 - 04:36

05:53 - 05:57 ]
| | Next tutorial is '''Background.'''

In this tutorial we'll learn how to set the''' background '''properties of an '''element '''in''' CSS.'''

Like '''background-color, background-image, background-repeat,''' etc.
|-
| | Glimpse of Text Properties

[Video:

00:00 - 00:04

02:28 - 02:42]
| | After this, comes '''Text Properties.'''

In this tutorial we’ll learn how to '''set''' the '''Text '''properties to '''format''' and '''style''' the '''text''' '''elements.'''

Like '''color, alignment,''' etc.
|-
| | Glimpse of Font properties

[Video:

00:00 - 00:04

10:55 - 11:09 ]
| | Next tutorial is '''Font properties'''.

In this we’ll learn about '''Font properties''' of an '''element '''to '''style''' the '''font''' of the '''text.'''

Like '''font-style, font-size, font-family,''' etc.
|-
| | Glimpse of Display property

[Video:

00:00 - 00:06

03:57 - 04:03]
| | The tutorial named '''Display''' '''property '''is next in the series.

In this we’ll see how to display''' '''an '''element''' in '''CSS.'''
|-
| | Glimpse of Float and Overflow

[Video:

00:00 - 00:04

04:18 - 04:27

11:06 - 11:10 ]
| | Next tutorial is '''Float''' '''and''' '''Overflow.'''

Here, we’ll learn about '''Float''' & '''Clear '''properties of an '''element '''in''' CSS.'''

We’ll also learn '''Overflow '''property.
|-
| | Glimpse of Link

[Video:

00:00 - 00:04

06:11 - 06:25]
| | After this is '''Link.'''

In this, we can '''style links''' by applying different properties to all the four states of '''link.'''
|-
| | Glimpse of List

[Video:

00:00 - 00:04

02:20 - 02:34]
| | Next tutorial is '''List'''.

In this we’ll learn about '''list''' properties to '''style''' and '''format lists.'''

Like''' type, background-color, '''etc
|-
| | Glimpse of Table

[Video - Table: 00:00 - 00:02

Video - Advanced Table Design: 00:00 - 00:04

Video - Advanced Table Design: 03:35 - 03:43 ]
| | '''Table '''and''' Advanced Table Design''' in '''CSS''' are next tutorial in this series.

It will teach us to '''style''' and '''format tables''' using '''CSS''' '''table''' properties.
|-
| | Glimpse of Forms

[Video:

00:00 - 00:04

11:49 - 12:03 ]
| | Next tutorial is '''Forms'''.

In this we’ll learn to '''style''' and '''format forms '''using various''' CSS properties.'''

Like '''border''', '''background-color, padding, '''etc.
|-
| | Glimpse of Counters

[Video:

00:00 - 00:06

06:45 - 06:58
| | The tutorial named '''Counters '''is next in the series.

With the help of this tutorial, we will learn to number '''elements''' automatically in a '''webpage.'''
|-
| | Glimpse of Multi-column Layout

[Video:

00:00 - 00:06

4:04 - 4:17

| | Next tutorial is '''Multi-column Layout.'''

In this tutorial, learners can create '''Multi-column Layouts '''of their''' webpages.'''
|-
| | Glimpse of Web layout

[Video:

00:00-00:05

7:35 - 07:49
| | The last tutorial is '''Web layout.'''

In this, learners will be able to design and structure '''web pages '''with proper '''web layout.'''
|-
| | Only narration
| | With this we have come to the end of this tutorial.

Let us summarize.
|-
| | Slide: Summary
| | In this tutorial, we have learnt:

* About '''CSS''' and
* The tutorials covered in this series

|-
| | Slide: About Spoken Tutorial project
| | The video at the following link summarises the Spoken Tutorial project.

Please download and watch it.
|-
| | Slide: Spoken Tutorial Workshops
| | The Spoken Tutorial Project team conducts workshops and gives certificates.

For more details, please write to us.
|-
| | Slide:

Answers for THIS Spoken Tutorial
| | Do you have questions in THIS Spoken Tutorial?

Please visit this site.

Choose the minute and second where you have the question

Explain your question briefly

The Spoken Tutorial project will ensure an answer

You will have to register to ask questions
|-
| | Slide:

Forum for specific questions:

| | The Spoken Tutorial forum is for specific questions on this tutorial.

Please do not post unrelated and general questions on them.

This will help reduce the clutter.

With less clutter, we can use these discussions as instructional material.
|-
| | Slide: Acknowledgement
| | Spoken Tutorial project is funded by Ministry of Education (MoE), Govt. of India.
|-
| | Slide: Thanks
| | This is Neha Solanki from IIT Bombay.

Thank you for watching.
|-
|}

@@ Line 206: / Line 206: @@
 Video - Advanced Table Design: 03:35 - 03:43 ]
-|  | '''Table '''and''' Advanced Table Design''' in '''CSS''' are next tutorial in this series.
+|  | '''Table '''and''' Advanced Table Design''' in '''CSS''' are the next tutorials in this series.
-They will teach us to '''style''' and '''format tables''' using '''CSS''' '''table''' properties.
+They will teach us to '''style''' and '''format tables''' using '''CSS table''' properties.
 |-
 |  | Glimpse of Forms

← Older revision		Revision as of 08:35, 3 February 2021
Line 7:		Line 7:
	'''Novice Reviewer: '''Madhuri Ganapathi		'''Novice Reviewer: '''Madhuri Ganapathi

−	'''Keywords: '''CSS, HTML, Web Page, Web Design, Video Tutorial, Spoken Tutorial	+	'''Keywords: '''CSS, HTML, Web Page, Web Design, Video Tutorial, Spoken Tutorial, Cascading Style Sheet, Overview of CSS, Markup Language, Web Layout

@@ Line 35: / Line 35: @@
 * It''' '''is a '''style sheet''' language.
 * It is used to '''style''' documents written in '''markup''' language like''' HTML''', '''XML '''etc.
-* It is an independent file and saved with '''[dot] css (.css)''' extension.
+* It is an independent file and saved with '''.css''' extension.
 |-

CSS/C2/Overview-of-CSS/English - Revision history

Nehasolanki at 11:10, 9 February 2021

Nancyvarkey at 11:47, 4 February 2021

Nehasolanki at 08:35, 3 February 2021

Pravin1389 at 16:43, 2 February 2021

Nehasolanki: Created page with "'''Title of the script: '''Overview of CSS '''Author:''' Neha Solanki '''Domain Reviewer: '''Ankita Maske, Om Prakash Soni '''Novice Reviewer: '''Madhuri Ganapathi '''Keyw..."