Assignment 3 Your going to modify your last Best Movies page and Recipe page Your going to modify your last Best Movies page and Recipe page You will need.

Slides:



Advertisements
Similar presentations
The Web Wizards Guide to HTML Chapter Six Tables.
Advertisements

Use Tables for Layout Control Day 7. You will learn to: Understand Tables Create a Simple Table Modify Your Tables Appearance Create Page Layouts with.
Copyright © 2004 ProsoftTraining, All Rights Reserved. Lesson 6: HTML Tables.
Internet Basics & Way Beyond!
Tutorial 4: Designing a Web Page with Tables
1 HTML Markup language – coded text is converted into formatted text by a web browser. Big chart on pg. 16—39. Tags usually come in pairs like – data Some.
CIS101 Introduction to Computing Week 07. Agenda Your questions Resume project Review Project Two HTML Project Three This week online Next class.
XP 1 New Perspectives on Creating Web Pages with HTML Tutorial 4: Designing a Web Page with Tables.
ETT 229 Fall 2004 Web Design Basics II. Agenda 11:00-11:05 – Quiz 14 11:05-11:50 – Web Design Lecture 11:50-12:15 – Web Design Practice 2.
Creating a Web Page with Tables. Objectives Create a text table with preformatted text Create the basic structure of a graphical table Organize table.
Introducing Web Tables
XP Creating Web Pages with HTML Using Tables. XP Objectives Create a text table Create a table using the,, and tags Create table headers and captions.
Using HTML Tables.
ETT 429 Spring 2007 Web Design I.
HTML. Creating a Table Attributes: border: indicates the border type of the table Value: 0 (no border), 1, 2, etc. cols: indicates the number of columns.
Images and Tables. Displaying Image Attributes: SRC= " mypic.gif " – Name of the picture file SRC= " pic/mygif.jpg " – Name of file found in pic directory.
INTRODUCTION TO WEB DEVELOPMENT AND HTML Lecture 06: Tables - Spring 2011.
HTML Tables and Forms Creating Web Pages with HTML CIS 133 Web Programming Concepts 1.
Chapter 5 Working with Tables. Agenda Add a Table Assign a Table Border Adjust Cell Padding and Spacing Adjust Cell Width and Height Add Column Labels.
XP 1 Tutorial 4 Designing a Web Page with Tables.
1 The Structure of a Web Table beginning of the table structure first row of three in the table end of the table structure table cells You do not need.
Creating Tables in a Web Site Using an External Style Sheet
CHAPTER 11 Tables. How Are Tables Used Data Display  Very tidy and very useful Better Text Alignment  Putting text in tables allows you to format indents.
XHTML Tables. Tables create little boxes in which you can place things to keep them organized. The little boxes are called table cells. Tables are created.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
HTML, Third Edition--Illustrated Introductory 1 HTML, Third Edition Illustrated Introductory Unit F Working with Tables.
Creating Tables in a Web Site
INTRODUCTORY Tutorial 7 Creating Tables. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Discern the difference between data tables and.
Internet Skills An Introduction to HTML Alan Noble Room 504 Tel: (44562 internal)
Web Technologies Website Development Trade & Industrial Education
CITY UNIVERSITY / Vysoká Škola Manažmentu.:IS Information Systems :. © Martina Cesalova, 2005 MS FRONTPAGE 4 1. Create a folder on L/BSBA/IS330/website.
1 3/7/05CS120 The Information Era Chapter 4 Basic Web Page Construction TOPICS: More on tables and images.
Website Development with Dreamweaver
1 CSC 121 Computers and Scientific Thinking David Reed Creighton University HTML and Web Pages.
CIS234A Lecture 9 Instructor Greg D’Andrea. Working with Table's Column Groups We've formatted the content of the table columns by modifying the attributes.
15.2 More Basic HTML. More Basic HTML Add spacing (single & double space) Save Refresh Add horizontal rule Add comments Add styles Add headings Add features.
>> Introduction to HTML: Tables. HTML is used to give websites structure 5 Basic Tags Element = Start-Tag+Content+End-Tag Heading Tags [h1-h6] Paragraph.
Lesson 2 Adding more content to your web page. Thanks to Richard Hudnutt, Luella HS.
Getting Started with HTML Please use speaker notes for additional information!
CPT 123 Internet Skills Class Notes Publishing to the Web Session B.
Designing a Web Page with Tables. A text table: contains only text, evenly spaced on the Web page in rows and columns uses only standard word processing.
TABLES 1. In this chapter you will learn that tables have many uses in HTML. Objectives: Upon completing this section, you should be able to: 1. Insert.
HTML— More Tags, Formatting, and Lists. Formatting Tags  Bold  Italics  Underline  Big text  Small text  Subscript (H 2 O)  Superscript (10 3 )
CIS234A- Lecture 7 Instructor Greg D’Andrea. Tables A table can be displayed on a Web page either in a text or graphical format. A text table: – contains.
Basic Table Elements. 2 Objectives Define table elements Describe the steps used to plan, design, and code a table Create a borderless table with text.
HTML ( HYPER TEXT MARK UP LANGUAGE ). What is HTML HTML describes the content and format of web pages using tags. Ex. Title Tag: A title It’s the job.
Basic Design Tips for Web Pages. Alignment Left, right, center Choose one alignment and use it on the entire page Align form elements, table elements,
CS-3432 Electronic Commerce Lecture – 7 Sikandar Shujah Toor
CIS234A Lecture 8 Instructor Greg D’Andrea. Review Text Table contains only text, evenly spaced on the Web page in rows and columns uses only standard.
Unit 4 Create and Use Tables. TITLE CORNELL NOTES TOPIC: NOTES: Name: Date: 09/08/2009 Period : Summary: Reasons for using tables Unit 4 Page 1 Display.
HTML Tables The HTML table model allows authors to arrange data - text, preformatted text, images, links, forms, form fields, other tables, etc. - into.
HTML CS 105. Page Structure HTML elements control the details of how a page gets displayed. Every HTML document has the following basic structure: … …
Introduction to Technology. Parts of MSWord Screen Title Bar Quick Access Toolbar Button Ribbon Status Bar (views and zoom)
REEM ALMOTIRI Information Technology Department Majmaah University.
1 3/30/05CS120 The Information Era CS120 The Information Era Chapter 4 – More HTML Specifics TOPICS: Frames Problem Review, Nested Frames.
Web111a_chapt04.ppt HTM: Section 4 Tables Table Types Text table elements Easy to use Use fixed-font text (font family monospace) Andale Mono Courier Monaco.
Tutorial 5: Tables Session OBJECTIVES Create a table Insert a table summary Insert a table caption Add rows and cells Merge Cells inside a Table.
HTML Tags BTT1O. HTML  Documents written in hypertext markup language can be interpreted by all web browsers.  This language lets the web page developer.
Introduction to Programming the WWW I CMSC Winter 2003 Lecture 5.
1 R3 R1 R5 R4 R6 R2 B B A A Looking at the Code Under the View menu Select Source.
1 Mansoor Ahmed Bughio. 2 HTML TABLES With HTML you can create tables. Examples Tables This example demonstrates how to create tables in an HTML document.
CIS101 Introduction to Computing Week 07 Spring 2004.
CNIT 131 HTML5 - Tables.
Making Templates Accessible
LAB Work 02 MBA 61062: E-Commerce
New PowerPoint Template
Computers and Scientific Thinking David Reed, Creighton University
Using HTML Tables SWBAT: - create tables using HTML
New PowerPoint Template
Creating Tables in a Web Site
Presentation transcript:

Assignment 3 Your going to modify your last Best Movies page and Recipe page Your going to modify your last Best Movies page and Recipe page You will need to use align attribute to get the text to appear as shown You will need to use align attribute to get the text to appear as shown Vertical alignment of the text relative to the image is accomplished with elements Vertical alignment of the text relative to the image is accomplished with elements Add the small logos shown Add the small logos shown Try to recreate the files as near as possible to the format shown Try to recreate the files as near as possible to the format shown You must use the moon and stars image You must use the moon and stars image

Tips Use the dropper in HTML-Kit Use the dropper in HTML-Kit Match the background of the first row as close as possible to the background color of the stars and moon image Match the background of the first row as close as possible to the background color of the stars and moon image If you were using font colors in either file, adjust them for readability (easiest is to remove colors) If you were using font colors in either file, adjust them for readability (easiest is to remove colors) You should have only one element in the body... You should have only one element in the body... Note – all images are public domain, downloaded from Public Domain Clip Art: whatever nothing between body and table tags all content inside and formatted by the table

A single table, background color is very light gray, which matches page background color. No borders or padding, so lines don’t show. First row color matches the new image of moon with stars. Text is centered and spans two columns. Genre titles centered. The optional comments are left aligned. Last row spans four columns (left aligned text). All images are centered small versions My Choices for Best Movies Ever link to recipesmall logo genre images optional comments small moon and stars h1 heading New Best Movies Page

New Popcorn Recipe Page My Choices for Best Movies Ever A single table, background color is white, which matches page background color. No borders or padding, so lines don’t show. First row color matches image (selected in previous assignment). Text is centered. Everything else is left aligned in one big cell that spans three columns. All images are centered small versions the recipe image and links

Screen Shots no line break here extra soace caused by lengthy comment everything in here is in one big table cell