Web Authoring Task 1– Create Style Sheet H1 H2 P LI OL UL Table Body

Slides:



Advertisements
Similar presentations
HTML and CSS. HTML Hyper Text Markup Language Tells browser how to display text and images.
Advertisements

Web Engineering 1 Ishaq Khan Shinwari MCS City University Peshawar.
1 Cascading Style Sheets Continued Different kinds of selectors in a style sheet –Simple- Pseudo-Class –Contextual- Pseudo-Element –Class Image Styles.
/k/k 1212 Cascading Style Sheets Part one Marko Boon
INTRODUCTION TO HYPERTEXT MARKUP LANGUAGE 1. Outline  Introduction  Markup Languages  Editing HTML  Common Tags  Headers  Text Styling  Linking.
Adding styles. Three alternatives HIT151 Web 'n' Net Web Page Basics /*stylesheet*/ h1,h2,h3 { font-family: verdana, arial, 'sans serif'; } p,table,li.
Very quick intro HTML and CSS. Sample html A Web Title.
Cascading Style Sheets (CSS): Pixel-Level Control with HTML Ease
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.
Cascading Style Sheets By: Valerie Kuna. What are Cascading Style Sheets? Cascading Style Sheets (CSS) are a standard for specifying the presentation.
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
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.
Cascading Style Sheet CSS CS1520 Ali Alanjawi. 2 TA Information Ali Alanjawi Homepage: Office:
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 )
Web Pages and Style Sheets Bert Wachsmuth. HTML versus XHTML XHTML is a stricter version of HTML: HTML + stricter rules = XHTML. XHTML Rule violations:
Part 3 Introduction to CSS. CSS Text Text Styles h1 {color: green} // rgb(0,255,0), #00ff00 h2{letter-spacing: 0.5cm} // 2px h3 {text-align: right} //
กระบวนวิชา 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
CSS normally control the html elements. Three Ways to Insert CSS There are three ways of inserting a style sheet: External style sheet Internal style.
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.
Cascading Style Sheet (CSS) Instructor: Dr. Fang (Daisy) Tang
Creating Tables in a Web Site Using an External Style Sheet HTML5 & CSS 7 th Edition.
HTML. Goals How to use the Komodo editor HTML coding and testing Basic HTML tags List and Images Tables and Links At least 2 pages and navigation
TUTORIAL 8: Enhancing a Web Site with Advanced CSS
CS105 Introduction to Computer Concepts HTML
Principles of Web Design 6 th Edition Chapter 4 – Cascading Style Sheets.
Learning HTML. HTML Attributes HTML elements can have attributes Attributes provide additional information about an element Class – specifies a class.
1 What is CSS?  CSS stands for Cascading Style Sheets  Styles define how to display HTML elements  Styles are normally stored in Style Sheets  Styles.
 This presentation introduces the following: › 3 types of CSS › CSS syntax › CSS comments › CSS and color › The box model.
CHAPTER 1 HTML & HTML5 I อ. ยืนยง กันทะเนตร คณะเทคโนโลยีสารสนเทศและการสื่อสาร มหาวิทยาลัยพะเยา 1.
CSS My favourite ICT lesson By Federico Boschi Cascading Style Sheets.
CS105 INTRODUCTION TO COMPUTER CONCEPTS HTML Instructor: Cuong (Charlie) Pham.
CSS Cascading Style Sheets. CSS Advantages Greater typography and page layout control Style is separate from structure Styles can be stored in a separate.
 Use the think diagram … ISP Server.
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.
1 HTML. 2 Full forms WWW – world Wide Web HTTP – Hyper Text Transfer Protocol HTML – Hyper Text Markup Language.
WebD Introduction to CSS By Manik Rastogi.
CSS.
Create a new stylesheet called Hotel Style
Chapter 17: Document Production (Word)
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.
CSS: Cascading Style Sheets
4.01 Cascading Style Sheets
( Cascading style sheet )
Semester - Review.
Unit 3 - Review.
Creating Your Own Webpage
Web Authoring (Ski Resort Task)
Introduction to Web programming
Cascading Style Sheet (CSS)
COMPUTING FUNDAMENTALS
MS-Access (database) how to create blank data base.
Web Authoring Task 1– Create Style Sheet List – LI { Table Body
Web Authoring Task 8– Create the following Style Sheet:
Style Sheet Create a new CSS called Cameras.CSS TD Web Authoring
Introduction to Web programming
Table CSS Create a new CSS called tablestyle.CSS Green Background
The Internet 10/13/11 The Box Model
Web Authoring Task 1– Create Style Sheet H1 H2 P LI Table Body
CSS Style Sheets: Intro
Web Authoring Task 1– Create Style Sheet H1 H2 H3 P LI Table Body
What are Cascading Stylesheets (CSS)?
Training & Development
Johan Ng and Muhammad Hazzry
4.01 Cascading Style Sheets
Presentation transcript:

Web Authoring Task 1– Create Style Sheet H1 H2 P LI OL UL Table Body Write your own CSS for common styles like: h1, h2, h3, P, li – Save style sheet as “Style5” Attach the style sheet and apply the text styles.   Colour H1 Full Red San-Serif, 22, bold, italic, center H2 50 % Red (No green or blue components) San-Serif, 16, bold, italic, Left P Dark shade of Blue San-Serif, 12, bold, Justify LI Black serif, 12, left OL Decimal UL Square Disc Table Set background colour to Yellow Set external border to Blue (width 2) Collapse Border Set internal border colour to Red (width 2), Set cell padding to 3 All solid Borders Body Set the Bground.jpg (tiled) image as your background Set your name as a comment

Web Authoring Task 2 – Create Table Cell A -H1 Cell B - Image Create a new html file called Apps.htm and attach the stylesheet. Create the table shown below Table Settings: Height: 600Px Width: 500PX Insert the following text and images into the cells: Cell A: Apps Cell B: Insert Facebook.jpg image Cell C: Insert Whatsapp.jpg image Cell D:  A mobile app is a computer program designed to run on smartphones, tablet computers and other mobile devices. Cell E: Links, Link 1 - http://www.windowsphone.com/en-us/store/top-free-apps, Link 2 - https://www.apple.com/itunes/charts/paid-apps/ Cell F: Best Selling Apps – Five Nights At, Mine Craft, Goblin Sword Hyperlinks to open on a blank window Cell A -H1 Cell B - Image Cell E – Title as H2 Links – li (unordered list) Cell C - Image Cell F – Title as H2 Chart – li (ordered List) Cell D -H1