Adding an Inline Style Sheet Page without Inline Style Sheet Page with Inline Style Sheet.

Slides:

Advertisements

Similar presentations

Microsoft Expression Web-Illustrated Unit K: Working with Behaviors.

Advertisements

HTML Concepts and Techniques Fourth Edition Project 2 Creating and Editing a Web Page.

Project 8 Creating Style Sheets.

Creating and Editing a Web Page Using Inline Styles

Using Advanced Cascading Style Sheets

Chapter 8 Creating Style Sheets.

Cascading Style Sheets Understanding styles. The term cascading describe the capability of a local style to override a general style. CSS applies style.

Chapter 5 Creating an Image Map

Creating and Editing a Web Page

Creating a Form on a Web Page

Creating a Form with Selection Menus The SELECT control creates a selection menu This control only allows the visitor to choose pre-defined choices There.

Microsoft Expression Web-Illustrated Unit L: Using Code Tools.

Starting BBEdit (Notepad) and Opening an HTML File Open the Public Folder Start Notepad or BBEdit Click File on the menu bar, and then click Open In the.

Microsoft Office 2007 PowerPoint Web Feature Creating Web Pages Using PowerPoint.

Office 2003 Introductory Concepts and Techniques M i c r o s o f t PowerPoint Web Feature Creating a Presentation on the Web Using PowerPoint.

Chapter 7 Using Advanced Cascading Style Sheets HTML5 & CSS 7 th Edition.

Office 2003 Introductory Concepts and Techniques M i c r o s o f t Word Project 2 Creating a Research Paper.

Office 2003 Introductory Concepts and Techniques M i c r o s o f t Word Web Feature Creating Web Pages Using Word.

Saving a Word Document as a Web Page

Office 2003 Introductory Concepts and Techniques M i c r o s o f t Word Web Feature Creating Web Pages Using Word.

Creating Tables in a Web Site Using an External Style Sheet HTML5 & CSS 7 th Edition.

Office 2003 Advanced Concepts and Techniques M i c r o s o f t Outlook Project 2 Scheduling Management and Instant Messaging Using Outlook.

Creating Tables in a Web Site.  Define table elements  Describe the steps used to plan, design, and code a table  Create a borderless table to organize.

Microsoft Office 2007 Word Integration Feature Linking an Excel Worksheet and Chart to a Word Document.

HTML Concepts and Techniques Fourth Edition Project 3 Creating Web Pages with Links, Images, and Formatted Text.

HTML Comprehensive Concepts and Techniques Third Edition Project 3 Creating Web Pages with Links, Images, and Formatted Text.

Dreamweaver CS4 Concepts and Techniques Chapter 5 Templates and Style Sheets.

HTML Concepts and Techniques Fourth Edition Project 8 Creating Style Sheets.

HTML Concepts and Techniques Fourth Edition Project 8 Creating Style Sheets.

Creating Tables in a Web Site

HTML Comprehensive Concepts and Techniques Second Edition Project 3 Creating Tables in a Web Site.

HTML, XHTML, and CSS Chapter 12 Creating and Using XML Documents.

Microsoft Office 2007 PowerPoint Web Feature Creating Web Pages Using PowerPoint.

Creating and Editing a Web Page using HTML IMED1316.

Creating and Editing a Web Page Project 2. Project Objectives Project 2: Creating and Editing a Web Page 2 Identify elements of a Web page Start Notepad.

Project 5 Templates and Style Sheets Dreamweaver MX 2004 Concepts and Techniques.

HTML, Third Edition--Illustrated Brief 1 HTML, Third Edition Illustrated Brief Unit D Adding Graphics and Multimedia.

Office 2003 Advanced Concepts and Techniques M i c r o s o f t Excel Integration Feature Object Linking and Embedding (OLE) and Web Discussions.

HTML Concepts and Techniques Fourth Edition Project 6 Using Frames in a Web Site.

HTML, XHTML, and CSS Chapter 8 Adding Multimedia Content to Web Pages.

Writing a JavaScript User-Defined Function  A function is JavaScript code written to perform certain tasks repeatedly  Built-in functions.

HTML Concepts and Techniques Fourth Edition Project 7 Creating a Form on a Web Page.

HTML Concepts and Techniques Fourth Edition Project 12 Creating and Using XML Documents.

Creating a Form on a Web Page

1 Creating a Second Web Page This section shows you how to create the Huntington Beach Web site.

Chapter 1 Creating a Dreamweaver Web Page and Local Site

1 Introduction  Extensible Markup Language (XML) –Uses tags to describe the structure of a document –Simplifies the process of sharing information –Extensible.

1 Creating the Header Page The header frame always displays on the AHS Web site The image (screagle.gif) that will go in the header is contained on the.

HTML Comprehensive Concepts and Techniques Third Edition 2 nd Project Creating and Editing a Web Page.

HTML Concepts and Techniques Fourth Edition Project 5 Creating an Image Map.

Using Frames in a Web Site Project 6. Project Objectives Project 6: Using Frames in a Web Site 2 Define terms related to frames Describe the steps used.

HTML Concepts and Techniques Fifth Edition Chapter 4 Creating Tables in a Web Site.

HTML Concepts and Techniques Fifth Edition Chapter 3 Creating Web Pages with Links, Images, and Formatted Text.

1 After completing this lesson, you will be able to: Get around the Internet with your browser. Connect to the Internet. Print Web pages. Save Web pages.

Creating and Editing a Web Page

Creating and Editing a Web Page Using Inline Styles

1 Creating a Menu Bar on a Secondary Web Page  It is important for visitors to be able to move easily from one page to another  You will create a menu.

HTML-I Basic HTML Elements. HTML (Hyper Text Markup Language) HTML is a document layout and hyperlink- specification language. i.e. a language used to.

1 Your Web Page title body of Web page main heading H2 heading bulleted list paragraph.

Creating Web Pages with Links, Images, and Embedded Style Sheets

Microsoft Expression Web - Illustrated Unit A: Getting Started With Microsoft Expression Web.

Chapter 7 Creating Templates, Importing Data, and Working with SmartArt, Images, and Screen Shots Microsoft Excel 2013.

Microsoft Expression Web-Illustrated Unit G: Designing Site Navigation.

Project 8 Creating Style Sheets.

Creating Tables in a Web Site Using an External Style Sheet

Using Frames in a Web Site

Creating Web Pages with Links, Images, and Formatted Text

Creating Tables in a Web Site

Project 5 Creating an Image Map.

Presentation transcript:

Adding an Inline Style Sheet Page without Inline Style Sheet Page with Inline Style Sheet

Adding an Inline Style Sheet If necessary, click the Notepad button on the taskbar or BBEdit on the dock to display the file, welcome.htm Click immediately to the right of the P in the tag on line 24. Press the SPACEBAR and then type STYLE=“font-style: italic; font-size: 8pt” as the code

Adding an Inline Style Sheet Click File on the menu bar and then click Save As. Type welcome.htm in the File name text box. Click the Save button in the Save As dialog box

Viewing and Printing Framed Web Pages Click the browser button on the taskbar Click the Community Hospital logo in the upper-left corner of the Web page Click File on the menu bar and then click Print When the Print dialog box displays, click As laid out on the screen and then click the OK button

Viewing and Printing Framed Web Pages One at a time, click the remaining links, Services, Calendar, Staff, and Contact, and repeat the last two steps

Viewing and Printing HTML Files If necessary, click the browser button on the taskbar. Click the Home link in the menu frame to display the Web page, welcome.htm, in the right frame Right-click anywhere on the Welcome page except on a link Click View Source on the shortcut menu

Viewing and Printing HTML Files Once the file, welcome.htm, is opened in Notepad, click File on the menu bar and then click Print Click the remaining links (Services, Calendar, Staff, and Contact) and repeat the last three steps

Closing Notepad and Closing Your Browser Click the Close button on the Notepad title bar Click the Close button on the browser title bar

Working with Classes in Style Sheets Using classes, you can selectively apply styles to HTML tags within a page You can only define classes in embedded or external style sheets Defining styles is a two-step process  Mark the elements in your HTML code that belong to the class by adding the tag, CLASS=classname  Define a specific style for that class

Working with Classes in Style Sheets

HTML Code with Classes Defined

Resulting Web Page

Summary Describe the three different types of cascading style sheets Add an embedded style sheet to a Web page that changes the link styles Add an external style sheet that changes the background, link styles, paragraph text, and table styles

Summary Use the tag to insert a link to an external style sheet Add an inline style sheet to a Web page that changes the text style Understand how to define style classes

What You Should Know

Project 7 Complete Please go to scsite.com/html2e/exs.htm to prepare for the exam on Projects 6 & 7