1 R3 R1 R5 R4 R6 R2 B B A A 140.57 100. 2 Looking at the Code Under the View menu Select Source.

Slides:



Advertisements
Similar presentations
Using HTML Tables Presenting Information & Layout Control.
Advertisements

Tables Learn to create and enhance TABLES using a variety of attributes and formats.
Copyright © 2004 ProsoftTraining, All Rights Reserved. Lesson 6: HTML Tables.
1 Lesson 5. 2 R3 R1 R5 R4 R6 R2 B B A A
Tutorial 4: Designing a Web Page with Tables
CIS101 Introduction to Computing Week 07. Agenda Your questions Resume project Review Project Two HTML Project Three This week online Next class.
Introducing Web Tables
HTML TABLES Cyndi Hageman. Tables   Attributes Name or id – used to identify the table Border = set this to determine if there is a border and the size.
 2008 Pearson Education, Inc. All rights reserved. 1 Introduction to HTML.
Introduction to HTML II Shih-Heng Chin. Preface Structure of a HTML File Elements used frequently Tables.
Using HTML Tables.
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
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.
HTML Essentials Tables and Table Tags. Overview Use of Tables goes beyond tabulating data Frequently used to format Web pages / control layout Especially.
Introduction to Computing Lecture 6 Introduction to HTML (Web Development Lecture 1)
Lesson 6. Links in HTML Computer Science Welcome to Virtual University in Pakistanhttp://
Tables in HTML Basharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan. 1.
1 HTML/CSS Tutorial. 2 Definitions WWW -- a software infrastructure layered on top of the Internet HTTP -- HyperText Transport Protocol, layered on top.
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.
CS105 Introduction to Computer Concepts HTML
Creating Tables in a Web Site
HTML Comprehensive Concepts and Techniques Second Edition Project 3 Creating Tables in a Web Site.
CITY UNIVERSITY / Vysoká Škola Manažmentu.:MG Information Systems :. © Martina Cesalova, 2005 MS FRONTPAGE 1 1.Open FrontPage – View -> Page 2.Open.
HTML Revisited. Learning Goals for Today 1.To develop your personal Web page 2.To upload your Web page to UMT’s Web server so that it becomes visible.
225 City Avenue, Suite 106 Bala Cynwyd, PA , phone , fax presents… HTML Lists, Tables and Forms v2.0.
Dr. Nuha El-KhaliliInternet Programming ( ) HTML Hyper Text Markup Language The language of web pages Maintained by the W3C
Understanding HTML Code
1 3/7/05CS120 The Information Era Chapter 4 Basic Web Page Construction TOPICS: More on tables and images.
1 CSC 121 Computers and Scientific Thinking David Reed Creighton University HTML and Web Pages.
1 eVenzia Technologies Learning HTML, XHTML & CSS Chapter 2.
>> 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.
CPT 123 Internet Skills Class Notes Publishing to the Web Session B.
Just Enough HTML How to Create Basic HTML Documents.
CS105 INTRODUCTION TO COMPUTER CONCEPTS HTML Instructor: Cuong (Charlie) Pham.
CS101 Introduction to Computing Lecture 9 Introduction to HTML (Web Development Lecture 2)
Introduction to HTML. What is HTML?  Hyper Text Markup Language  A markup language designed for the creation of web pages and other information viewable.
XHTML 1.1  Derived from Standard Generalized Markup Language (SGML) of ISO  XHTML concerned primary with content rather than presentation and style 
XHTML1-1 Extensible HyperText Markup Language (XHTML) Part 2 Xingquan (Hill) Zhu
Introduction HTML (Hypertext Markup Language) is used to create document on the World Wide Web. HTML is not a programming language, it is a markup language.
CPSC 203 Introduction to Computers Lab 33 By Jie Gao.
Introducing Web Tables. Tables for tabulating items  Better looking  More flexibility  More efficient to explain information than plain text.
A table is a rectangular arrangement of rows and columns on your screen A table is used to organize data into rows and columns and also increasingly.
ECA 228 Internet/Intranet Design I Tables. ECA 228 Internet/Intranet Design I Basic HTML Tables Created as a way to present rows and clumns of data.
CS-3432 Electronic Commerce Lecture – 7 Sikandar Shujah Toor
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(Hyper Text Markup Language) ByNaveen. Introduction HTML or Hyper Text Markup Language is the standard markup language Its used to create the web.
HTML Concepts and Techniques Fifth Edition Chapter 4 Creating Tables in a Web Site.
CSE 409 – Advanced Internet Technology 1 DISCUSSION OF BASIC HTML TAGS.
Basic HTML.
What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is not a programming language, it is a markup.
20-753: Fundamentals of Web Programming 1 Lecture 6: Advanced HTML Fundamentals of Web Programming Lecture 6: Advanced HTML.
Introduction to Web Authoring Ellen Cushman /wra210.htm Class mtg. #2.
Doing TABLES Creating Tables in HTML. Start creating the table by using the Table container tag.
1999, COMPUTER SCIENCE, BUU Introduction to HTML Seree Chinodom
©SoftMoore ConsultingSlide 1 Introduction to HTML: Block-Level Elements.
Introduction to Hypertext Markup Language James H. Harrison, Jr., M.D., Ph.D. Center for Biomedical Informatics University of Pittsburgh Medical Center.
1 HTML. 2 Full forms WWW – world Wide Web HTTP – Hyper Text Transfer Protocol HTML – Hyper Text Markup Language.
HTML AN INTRODUCTION TO WEB PAGE PROGRAMMING. INTRODUCTION TO HTML With HTML you can create your own Web site. HTML stands for Hyper Text Markup Language.
Week-11 (Lecture-1) Introduction to HTML programming: A web based markup language for web. Ex.
Introduction to Web Authoring Bill Hart-Davidson AIM: billhd30 Session 2
CIS101 Introduction to Computing Week 07 Spring 2004.
LAB Work 02 MBA 61062: E-Commerce
Using HTML Tables SWBAT: - create tables using HTML
Web Design and Development
Creating Tables in a Web Site
Introduction to HTML.
Site Development Foundations Lesson 6
Presentation transcript:

1 R3 R1 R5 R4 R6 R2 B B A A

2 Looking at the Code Under the View menu Select Source

3 A Simple HTML document My first page A simple page with just this sentence

4

5 Text Formatting Paragraph and Education provides a better understanding of life – e-commerce You can also use Left or Right Line break Education provides a better understanding of life

6 More Text Formatting Bold and Italics and Underlined and BIG and small and

7 Font Font face internet Font size from 1 to 7 and Font color e-commerce internet and e- commerce

8 Example Code This is my main title Here is the first paragraph. This is some bold text This text is in the Arial font.

9

10

11 Item1 Item2 Item3 Item1 Item2 Item3

12 Image example

13 On Sale Cassettes

14

15 Links in HTML Computer Science Welcome to Virtual University in Pakistanhttp://

16 Mailto Link address

17 Changing Colors in a Page ‘bgcolor’ refers to a six digit code based on hexadecimal numbers, e,g, #00FF00 (Green) _ _ _ _ _ _ Red Green Blue –‘filename’ refers to the image file name in.gif or.jpg etc. format

18

19 Computer Science Welcome to Virtual University inhttp:// Pakistan

20 Title and Meta Tags Introduction to e-commerce Page goes here

21

22 Basic tags Tables use following basic tag: – (table row tag) and are used to create/add a row (table data tag) and are used to divide a row into number of columns to create cells (table header tag) and labels each column as a heading Caption of the table

23 A basic 2 row, 2 column table Cell1 Cell2 Cell3 Cell4 Cell 1Cell 2 Cell 3Cell 4

24 A slightly different table Cell1 Cell2 Cell3 Cell 1 Cell 2Cell 3

25 Try coding… Try to code the following table design: Cell 1 Cell 2 Cell 3

26

27 Example - COLSPAN Example - COLSPAN Spanning the text This line is extended to two columns This does not First Column Second Column Third Column

28

29

30 Example - ROWSPAN Spanning Text Example - ROWSPAN This line is stretched to two rows First Row Second Row This does not Third Row

31 Table tag attributes –Border - –Width - –Height - –Cellpadding - –Cellspacing - –Color - or

32 Attributes for tag –Width - –Align - –Valign-

33

34 Example - Margin A Page with a Left-Hand Margin This section contains the contents of your web page.

35 Forms A form is a web page populated with text boxes, drop- down lists and commands buttons to get information from the user - and Types –Submit/Reset button –Text boxes –Text area –Check boxes –Radio buttons –Lists

36

37 Example -Submit Submit Button An example of Submit button:

38

39 Example – Text Box & Text Area Text Area Example Today's Burning Question First Name: Last Name: Today's Burning Question : How to make Pakistan a developed country? Please enter your answer in the text area below: