Web Authoring Task 8– Create the following Style Sheet:

Slides:



Advertisements
Similar presentations
Working with Web Tables
Advertisements

HTML and CSS. HTML Hyper Text Markup Language Tells browser how to display text and images.
Web Pages Week 10 This week: CSS Next week: CSS – Part 2.
CSS Styling CSS Box Model & CS110: Computer Science and the Internet.
1 Cascading Style Sheets Continued Different kinds of selectors in a style sheet –Simple- Pseudo-Class –Contextual- Pseudo-Element –Class Image Styles.
Cascading Style Sheets
Chapter 6 More CSS Basics Key Concepts Copyright © 2013 Terry Ann Morris, Ed.D 1.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 6 Key Concepts 1 Copyright © Terry Felke-Morris.
Presenter: James Huang Date: Sept. 26,  Introduction  Basics  Lists  Links  Forms  CSS 2.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 6 Key Concepts 1 Copyright © Terry Felke-Morris.
Adding styles. Three alternatives HIT151 Web 'n' Net Web Page Basics /*stylesheet*/ h1,h2,h3 { font-family: verdana, arial, 'sans serif'; } p,table,li.
Slide 1 CMPS 211 Internet Programming Spring 2008 Dynamic Effects with Styles Chapter 12 2/6/08.
Very quick intro HTML and CSS. Sample html A Web Title.
Cascading Style Sheets. CSS stands for Cascading Style Sheets and is a simple styling language which allows attaching style to HTML elements. CSS is a.
Web Development & Design Foundations with XHTML Chapter 7 Key Concepts.
Cascading Style Sheets By: Valerie Kuna. What are Cascading Style Sheets? Cascading Style Sheets (CSS) are a standard for specifying the presentation.
CSS cont. October 5, Unit 4. Padding We can add borders around the elements of our pages To increase the space between the content and the border, use.
Session 4: CSS Positioning Fall 2006 LIS Web Team.
Web Development & Design Foundations with XHTML Chapter 7 Key Concepts.
1 Web Developer & Design Foundations with XHTML Chapter 9 Key Concepts.
End User Computing An Introduction to CSS Sujana Jyothi Research Lab1, Callan Building, Department of Computer Science
Advance CSS (Menu and Layout) Miftahul Huda. CSS Navigation MENU It's truly remarkable what can be achieved through CSS, especially with navigation menus.
CSS BASICS. CSS Rules Components of a CSS Rule  Selector: Part of the rule that targets an element to be styled  Declaration: Two or more parts: a.
Building a Website: Cascading Style Sheets (CSS) Fall 2013.
Navigation Bars Level 2 Extended Certificate Unit B12 Doing Business Online.
Recognizing the Benefits of Using CSS 1. The Evolution of CSS CSS was developed to standardize display information CSS was slow to be supported by browsers.
CSS(Cascading Style Sheets )
1 Dreamweaver CS5 intermediate class by Cookie Setton Build a CSS website WITHOUT TABLES Just when you thought you were starting to understand HTML coding,
กระบวนวิชา CSS. What is CSS? CSS stands for Cascading Style Sheets Styles define how to display HTML elements Styles were added to HTML 4.0 to.
Unit 20 - Client Side Customisation of Web Pages
Web Design with Cascading Style Sheet Lan Vu. Overview Introduction to CSS Designing CSS Using Visual Studio to create CSS Using template for web design.
4.01 Cascading Style Sheets
Chapter 12 Cascading Style Sheets: Part II The Web Warrior Guide to Web Design Technologies.
 This presentation introduces the following: › 3 types of CSS › CSS syntax › CSS comments › CSS and color › The box model.
CSS Class 2 -Add margins to elements on a page. -Set width and height of elements. - CSS shorthand properties for box model. -Style links. -Style tables.
Paper 3 Unit 15 – Web Authoring Software Choices Graphics Exporting Graphics Creating CSS RGB Colour CSS – Body, Table and TD Border Collapse Tables -
Web Authoring Task 8– Create the following Style Sheet: 1.Create a new CSS called Tiger.CSS Style Sheet Body Horizontal Tile using the Tiger.JPG H1 Browsers.
WebD Introduction to CSS By Manik Rastogi.
CSS.
Create a new stylesheet called Hotel Style
Open the Nissan.html page in a suitable application and create the table shown below between Table 3 and 4. Set the appropriate sizes for each cell. A.
The Box Model in CSS Web Design – Sec 4-8
4.01 Cascading Style Sheets
( Cascading style sheet )
The Box Model in CSS Web Design – Sec 4-8
CSS Layouts: Grouping Elements
Creating Your Own Webpage
Fix the CSS syntax errors below
CSS Rule Selector Declaration Block Value Attribute Name body {
Web Authoring (Ski Resort Task)
Cascading Style Sheets
The Box Model in CSS Web Design – Sec 4-8
Web Authoring Task 1– Create Style Sheet H1 H2 P LI OL UL Table Body
Introduction to Web Page Design
Web Authoring Task 1– Create Style Sheet List – LI { Table Body
Chapter 6 More CSS Basics Key Concepts
Style Sheet Create a new CSS called Cameras.CSS TD Web Authoring
Table CSS Create a new CSS called tablestyle.CSS Green Background
Basics of Web Design Chapter 6 More CSS Basics Key Concepts
The Internet 10/13/11 The Box Model
Web Authoring Task 1– Create Style Sheet H1 H2 P LI Table Body
Basics of Web Design Chapter 6 More CSS Basics Key Concepts
Web Authoring Task 1– Create Style Sheet H1 H2 H3 P LI Table Body
For the World Wide Web Styling Tables with CSS
Basics of Web Design Chapter 6 More CSS Basics Key Concepts
The Internet 10/6/11 Cascading Style Sheets
How to use the CSS box model for spacing, borders, and backgrounds
Training & Development
4.01 Cascading Style Sheets
Presentation transcript:

Web Authoring Task 8– Create the following Style Sheet: Create a new CSS called Tiger.CSS Style Sheet Body Horizontal Tile using the Tiger.JPG H1 Browsers Default Serif Font, Centre & 22PX H2 Browsers Default Sans- Serif Font, Left & 16PX H3 Browsers Default Sans- Serif Font, Centre & 18PX P Browsers Default Sans- Serif Font, Fully Justified & 11PX LI Arial, 14PX OL Decimal UL Square Table Width: 550 & Height: 400 Padding: Top 10 PX & Bottom 5PX Margin: Right & Left 5PX Internal gridline width 1.5 PX External gridline width 2.5 PX All Collapsed All Solid Line

Web Authoring Task 8– Create the following Style Sheet: 2. Apply Color Attributes Style Sheet Colour Components Style Attribute Red Green Blue Body Yellow H1 Full Red No Green No Blue H2 Black H3 No Red Full Blue P Dark Red 50% Green OL Dark Blue UL 50% Red Table External Border Internal border Dark Green Background Light Grey 3. Create New Tiger HTML Page and make the following tables: Table A Table B

Web Authoring Task 8– Create the following Style Sheet: 4. Add the Following Content to Table A and apply appropriate styles: Placed Named Anchor at top of the page. Tiger <H1> The tiger is the largest cat species. <P> Tiger populations <H2> Line Space Ordered List India 2226 Malaysia 500 Bangladesh 440 Indonesia 325 China 45 Wikipedia Link http://en.wikipedia.org/wiki/Tiger - open in new window Email Us <P> (email link to WWF@hotmail.com)

Web Authoring Task 8– Create the following Style Sheet: 4. Add the Following Content to Table B and apply appropriate styles: Tiger <H1> WWF Link http://www.worldwildlife.org/species/tiger Species <H2> Line Space Unordered List Bengal tiger Indochinese tiger  Siberian tiger South China tiger  Malayan tiger Tigers once ranged widely across Asia, from Turkey in the west to the eastern coast of Russia. <P> Contact US <P> (email link to WWF@hotmail.com with a subject line Tiger awareness) Click here to return to the top of the page – Make Click Here the link to the anchor