 cascade Style Sheets (CSS) is a mark-up language that was first proposed in 1994 by Håkon Wium Lie. CSS works in conjunction with HTML to greatly increase.

Slides:



Advertisements
Similar presentations
Tables Feb. 14, Tables Great way to organize and display information Laid out in columns and rows Think of an excel spreadsheet Defined with tag.
Advertisements

HTML Basics Customizing your site using the basics of HTML.
Intro to HTML. HTML HTML = HyperText Markup Language Used to define the content of a webpage HTML is made up of tags and attributes Content.
HTML popo.
Introduction to HTML & CSS
CSS-Formatting Review Cascading Style Sheets addstyle to your HTML web pages.
Cascading Style Sheets
CSS The basics { }. CSS Cascading Style Sheets - language used to – describe html appearance & formatting Style Sheet - file that describes – how html.
CSS: Separating Design and Content Kevin Campbell Duke University/Grouchyboy.com.
Cascading Style Sheets
HTML Overview - Cascading Style Sheets (CSS). Before We Begin Make a copy of one of your HTML file you have previously created Make a copy of one of your.
Making Things Look Nice: Visual Appearance and CSS CMPT 281.
XP Introducing Cascading Style Sheets With Cascading Style Sheets (CSS), you can create one or more documents that control the appearance of some or all.
16 HTML Tables and Frames Section 16.1 Create a basic table using HTML Define borders Merge cells Align content in tables Section 16.2 Create a frames-based.
Web Workshop: CSS Objectives: - “What is CSS?” - Structure of CSS - How to use CSS in your webpage.
1 Creating Web Pages Part 3. 2 CASCADING STYLE SHEETS (CSS): What exactly are they? Set of rules that define how a web browser should display an HTML.
Working with Cascading Style Sheets. 2 Objectives Introducing Cascading Style Sheets Using Inline Styles Using Embedded Styles Using an External Style.
Basics of HTML.
Cascading Style Sheet. What is CSS? CSS stands for Cascading Style Sheets. CSS are a series of instruction that specify how markup elements should appear.
© 2012 Adobe Systems Incorporated. All Rights Reserved. LEARNING THE LANGUAGE OF THE WEB INTRODUCTION TO HTML AND CSS.
Chapter 11 Cascading Style Sheets: Part I The Web Warrior Guide to Web Design Technologies.
Different ways to implement CSS. There are four different ways to use CSS in your web pages: – Inline CSS – Embedded CSS/Internal CSS – Linked CSS/External.
Cascading style sheets (CSS)
The Characteristics of CSS
Styles with Cascading Style Sheets (CSS) Web Design – Section 4-1 Part or all of this lesson was adapted from the University of Washington’s “Web Design.
INTERNAL CSS Casey Ames Different types of CSS There are three different types of CSS: ◦ External CSS ◦ Internal CSS ◦ Inline CSS In this presentation.
Css. Definition Cascading style sheet (CSS) Cascading Style Sheets (CSS) is a simple mechanism for adding style (e.g. fonts, colors, spacing) to Web documents.
INTRODUCTION TO CSS. OBJECTIVES: D EFINE WHAT CSS IS. K NOW THE HISTORY OF CSS. K NOW THE REASON WHY CSS IS USED. CSS SYNTAX. CSS ID AND CLASS.
CSS CSS is short for C ascading S tyle S heets. It is a new web page layout method that has been added to HTML to give web developers more control over.
HTML CSS JAVASCRIPT. HTML - Stands for Hyper Text Markup Language HTML is a ‘language’ that describes web pages. This language is a collection of codes.
Cascading Style Sheets Part 1. CSS vs HTML HTML: Originally intended to markup structure of a document (,...,,,,,...) CSS Developing technology, CSS1,
CS134 Web Design & Development Cascading Style Sheets (CSS) Mehmud Abliz.
Css. Definition Cascading style sheet (CSS)  It is a simple mechanism for adding style (e.g. fonts, colors, spacing) to Web documents.
Use CSS to Implement a Reusable Design Selecting a Dreamweaver CSS Starter Layout is the easiest way to create a page with a CSS layout You can access.
INTRODUCTION TO CSS. TOPICS TO BE DISCUSSED……….  Introduction Introduction  Features of CSS Features of CSS  Creating Style Sheet Creating Style Sheet.
INT222 - Internet Fundamentals Shi, Yue (Sunny) Office: T2095 SENECA COLLEGE.
LEARN THE QUICK AND EASY WAY! VISUAL QUICKSTART GUIDE HTML and CSS 8th Edition Chapter 8: Working with Style Sheets.
DYNAMIC HTML What is Dynamic HTML: HTML code that allow you to change/ specify the style of your web pages. Example: specify style sheet, object model.
CNIT 132 – Week 4 Cascading Style Sheets. Introducing Cascading Style Sheets Style sheets are files or forms that describe the layout and appearance of.
Cascading Style Sheets
Are You Smarter Than a 5 th Grader? 1,000,000 5th Grade HTML 5th Grade Syntax 4th Grade HTML 4th Grade Syntax 3rd Grade HTML 3rd Grade Syntax 2nd Grade.
CSS Cascading Style Sheets A very brief introduction CSS, Cascading Style Sheets1.
Spiderman ©Marvel Comics Creating Web Pages (part 1)
CSS Hadas Kahsay. Overview  What is CSS  Basic syntax of CSS Rules  How to link CSS style to html documents  Browsers and CSS  Advantages of CSS.
Cascading Style Sheets (CSS) EXPLORING COMPUTER SCIENCE – LESSON 3-5.
Basic Steps to create a Website using HTML5. Hypertext Markup Language.
objectives Learning WEB TECHNOLOGIES. Understanding Salient features of WEB TECHNOLOGIES. Designing of WEB PAGES on your own. Development of WEB APPLICATIONS.
What is CSS? A set of style rules that tell the web browser how to present a web page or document. – In earlier versions of HTML, style characteristics,
1 Cascading Style Sheet (CSS). 2 Cascading Style Sheets (CSS)  a style defines the appearance of a document element. o E.g., font size, font color etc…
CASCADING STYLE SHEET CSS. CSS stands for Cascading Style Sheets Styles define how to display HTML elements Styles were added to HTML 4.0 to solve a problem.
Cascading Style Sheets Using HTML. What are they? A set of style rules that tell the web browser how to present a web page or document. In earlier versions.
CSS Introductions. Objectives To take control of the appearance of a Web site by creating style sheets. To use a style sheet to give all the pages of.
Introduction to CSS: Selectors
Cascading Style Sheets (CSS)
Web Basics: HTML/CSS/JavaScript What are they?
Styles with Cascading Style Sheets (CSS)
INTRODUCTION TO HTML AND CSS
Styles with Cascading Style Sheets (CSS)
Intro to CSS CS 1150 Fall 2016.
Website Design 3
Intro to CSS CS 1150 Spring 2017.
Intro to CSS Mr. Singh.
CSS: Cascading Style Sheets
INTRODUCTION TO HTML AND CSS
Introduction to HTML5.
Web Design and Development
Exercise 9 Skills You create and use styles to create formatting rules that can easily by applied to other pages in the Web site. You can create internal.
Understand basic HTML and CSS terminology, concepts, and basic operations. Objective 3.01.
Presentation transcript:

 cascade Style Sheets (CSS) is a mark-up language that was first proposed in 1994 by Håkon Wium Lie. CSS works in conjunction with HTML to greatly increase the ability of Web designers to control the appearance of Web pages. Håkon Wium Lie  The style sheet is a set of Cascading Style Sheets (CSS) rules that tell the browser how to display the page

 You will be able to position HTML elements, images, and objects exactly where you want them on the page by using CSS rules or rules of CSS which is positioning with style sheets. HTML describes the structure of the document and CSS controls the appearance of the Web page.

 The HTML document is what you code and the Web page is what you see. . When you use CSS rules inside an HTML document, be aware that the various browsers do NOT display the Web page similarly and be sure to test your pages in more that one browser before uploading your pages to the Web server.

 Instead of coding all of the attributes and values of the HTML elements into the web document you will now place one rule for each attribute and value one time into one place -- the style sheet.  You no longer have to use the Blue Title each time you need for specify a font change.

 All of the CSS mark-up coding for an "internal style sheet" occurs between the and tags in the HEAD section of the HTML document  line style: occurs inside HTML tags in the body section of the HTML document. An "external style sheet" is linked to, from within the HEAD section of the HTML document.

 CSS is easy to write and easier than HTML to learn since the selectors of CSS rules already use the names of HTML "tags".  You just mark-up the structures in HTML and let Cascading Style Sheets take care of the appearance.  you will find also makes for smaller size documents that load faster.

 Site maintenance time is cut because you just change the style sheet in one place one time instead of having to hand code a change on every page

 Style rule: a rule that defines the style of the document

 Pseudo class: used in style sheet selector but not in HTML, it allow external information to influence the formatting process.  Simple selectors: defines an element irrespective of its positioning in the document structure.  HTMAL selector : it used the name of HTML element without a bracket.  Class selector : these selector us attribute of HTML element, every element visible has attribute, which is used to assign an adentifier

 ID selector: use the ID attribute of an HTML element. Is also used to apple style to individual element on a web page  Contextual selector: it refers to the context of element

 STYLE element  STYLE attributes  LINK element