Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Unit 20 Creating of Cascading Style Sheets (CSS)

Features of CSS
by

Ayodele Betiku

on 19 April 2016

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of Unit 20 Creating of Cascading Style Sheets (CSS)

Development of CSS
Problems that
Deals with CSS
0
+
-
=
9
8
7
1
2
3
4
5
6
c
References:
1. http://www.yourhtmlsource.com/stylesheets/introduction.html
2.
http://www.daaq.net/old/css/index.php?=css+history&parent=using+css
3.
http://www.w3schools.com/cssref/default.asp
What is CSS?
History of CSS
Mini Plenary
Assignment 4
Class Task
Ways to Implement CSS Commands
Introduction:
HTML was designed to focus on the content
without taking the aesthetics into account. To make things special and more interesting to the eye, CSS is the answer.
C.S.S
ascading
tyle
heets
Launching of Different Versions of CSS
The World Wide Web Consortium team led by Bert Bos and Hakon Lie developed CSS.
It is developed to create a styling language that could be integrated with HTML and XHTML to complement its structuring capabilities with styling rules
Technology did not exist to make use of CSS.
CSS was not implemented as a standard until after computer monitors allowed for full multimedia display.
New set of standards standard as a pulling back in line of markup languages with the original conception of the standards.
CSS 1
it was released in 1996.
it includes basic styling functions such as font, color, and background images.
most current browsers fully support CSS1
CSS 2
it came out in 1998.
it allows for positioning of elements on the page for page layout, provides support for downloadable fonts, and allows pages to be formatted for printing.
no one fully supports CSS2.
CSS 3
it is still in development, but will add support for additional presentation media to the mix, such as aural (audio) styling.
it will also involve a restructuring of CSS into modules that support different styling elements.
most of what is going on in the development of CSS3 will not affect the way in which you use CSS to format documents for display on a computer screen.
External

Style Sheet
What is an External Style Sheet?
It is the usage of one CSS file for all your pages.
Example of an External Style Sheet:
Internal Style Sheet
What is an Internal Style Sheet? aka (Header Css)
It is the integrate CSS commands into the head part of your HTML.
Example of an Internal Style Sheet:
Inline Style
What is an Inline Style?
It is the usage of style attribute to implement a CSS command directly to an HTML element.
Example of an Inline Style
How do we use this property?
This property sets all the background properties in one declaration
It sets all the border properties in one declaration
How do we use this property?
This property sets the height of an element.
How do we use this property?
This property sets all font properties in one declaration.
How do we use this property?
How do we use this property?
This property sets all the properties for a list in one declaration.
How do we use this property?
This property sets all margin properties in one declaration.
How do we use this property?
This property sets all padding properties in one declaration.
How do we use this property?
It specifies the bottom position of a positioned element.
How do we use this property?
It specifies whether or not a box should float.
How do we use this property?
This property specifies the left position of a positioned element.
How do we use this property?
It species the type of positioning method used for an element (static relative, absolute or fixed).
How do we use this property?
This property specifies the right position of a positioned element.
How do we use this property?
This property specifies the top position of a positioned element.
How do we use this property?
This property sets the color of text.
How do we use this property?
This property specifies the horizontal alignment of text.
How do we use this property?
This property specifies the decoration added to text.
Benefits of CSS
Pages may download up to 50% faster
Less code will be typed, thus making your pages shorter and neater.
Consistency of design for the whole page under the same style sheet.
Visual revisions to be made for the whole page is easier.
Main Plenary
1. Write some notes for your teacher that provide a detailed description of each of the three different ways of implementing CSS. Explain why each method would be used and how the three methods inter-relate.
Lesson Objectives
Lesson Outcomes
To know:
that there are three ways to implement CSS into a webpage. Inline, Header and External CSS

To understand:
the ways that each of the three implementations of CSS Inline, Header and External CSS are used

To be able to:
c
reate a set of written notes to help the teacher to explain the different implementations of CSS (M1)
I can explain the 3 methods used to implement CSS into webpages Inline, Header and External (M1)

I can explain the advantages and drawbacks of not using each of the features that I mention in my notes guide (M1)

I have written a set of class notes that explaining the different implementations of CSS (M1)
Location: rmshared/WRL/lbts6/L3 Diploma/Unit 20/Assigment 1/m1 written notes task
Assignment 3
P6 Assignment Task
Assignment 2
Assignment 1
Full transcript