Introduction to HTML 4.0 Getting Started – Links, Images, Font, and List Teacher: Mr. Ho.

Slides:



Advertisements
Similar presentations
HTML Basic Lecture What is HTML? HTML (Hyper Text Markup Language) is a a standard markup language used for creating and publishing documents on.
Advertisements

Introduction to Web Design Lecture number:. Todays Aim: Introduction to Web-designing and how its done. Modelling websites in HTML.
Learning HTML. > Title of page This is my first homepage. Tells Browser This is an HTML page Basic Tags Tells Browser End of HTML page Header information.
Designing Websites Using HTML and FrontPage A Typical Webpage View Source A webpage is a text file containing instructions to tell a computer how the.
HTML Lesson 4 Hyper Text Markup Language. Assignment Part 3  Save your last html file as “FirstName3.htm”  Set the title as “FirstName LastName Third.
LIST- HYPERLINK- IMAGES
HTML Programming last updated 9/12/05 at 1:30pm HyperText Markup Language Reference: – HTML BasicsHTML Basics An HTML program is a set of paired tags that.
Introduction to HTML II Shih-Heng Chin. Preface Structure of a HTML File Elements used frequently Tables.
Including images in Web pages Skills: use the tag IT concepts: none This work is licensed under a Creative Commons Attribution-Noncommercial- Share Alike.
Phil Campbell (LSBU) Session 2 Other Common Tags IMG Finding images Tables Anchor Tags Web layouts Tables Exercise Summary of attributes.
Lecture 13. A Very Brief Introduction to HTML and XHTML, part II Instructor: Jie Yang Department of Computer Science University of Massachusetts Lowell.
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.
Lesson 6. Links in HTML Computer Science Welcome to Virtual University in Pakistanhttp://
HTML Tags. Objectives Know the commonly used HTML tags Create a simple webpage using the HTML tags that will be discussed.
HTML basics exercises.
Should have seen something like this last week What does do? stands for table row and starts a new row in the table.
4 HTML Basics Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and.
WEB DESIGN USING DREAMWEAVER. The World Wide Web –A Web site is a group of related files organized around a common topic –A Web page is a single file.
ACM 511 HTML Week -1 ACM 511 Course Notes. Books ACM 511 Course Notes.
1 Essential HTML coding By Fadi Safieddine (Week 2)
Informatics Computer School CS114 Web Publishing HTML Lesson 2.
Images (1) Three most popular formats – Graphics Interchange Format (GIF) – Joint Photographic Experts Group (JPEG) – Portable Network Graphics (PNG) –
Images in HTML PowerPoint How images are used in HTML.
Lists, Images, Tables and Links. Lists Unordered List The first item The second item The third item The fourth item Ordered List 1.The first item 2.The.
Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and attributes Create.
Web Design ATBs. ATB #1 List headings and size ATB #2 Define HTML.
Linking web pages Wah Yan College (Hong Kong) Mr. Li C.P.
What is Markup and Markup Languages? What is HTML? A Basic HTML Document Basic HTML Tags Tag Attributes and Text Formatting Tags Insert Hyperlinks Add.
Enhancing Your Web Site—Adding Links Web Page **YOU MUST HAVE COMPLETED THE 1ST 3 WEB PAGES BEFORE YOU CAN DO THIS ONE. **YOU SHOULD HAVE COMPLETED THE.
CREATING WEB PAGES Using…More HTML code! My First \ Web Page.
Introduction to HTML Xiangming Mu 9/23/ Learning Objectives Understand basic HTML tags and their attributes Learn to create a simple HTML page.
HTML (Hypertext Markup Language) Recap: HTML essential tags:,,, Text Formatting:,,,,,,. Font manipulation:
HTML. Adding Background Color The bgcolor attribute lets you change the background color of the Web page. Located in the body tag See common Web Page.
4 HTML Basics Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and.
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 (Hyper Text Markup Language) Lecture II. Review Writing HTML files for web pages – efficient compact – fundamental. Text files with htm extension.
Adding Images to Your Web Page Web Design Section 5-7 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development.
HTML Basics. HTML Coding HTML Hypertext markup language The code used to create web pages.
HTML CS 105. Page Structure HTML elements control the details of how a page gets displayed. Every HTML document has the following basic structure: … …
1 Creating the Home Page. 2 Creating a Table Table attributes  Two rows and two columns  No border  Left-aligned Change the vertical alignment of the.
Creating a Web Page Presented by: Bernadette G. Bautista Manuel I. Santos MNHS April 29, 2011.
REEM ALMOTIRI Information Technology Department Majmaah University.
Links and Images. Links HTML uses a hyperlink to link to another document on the Web A hyperlink can be either text or a picture Links are created with.
Your HTML website creating your first html file. Creating an HTML FIle Open note pad from accessories, programs. Write code. Save and view. In 3 Steps.
Using Text Edit. Create Folders to Organize a Site  Identify the location where you are storing your Web sites. Ask your teacher for help if needed.
Agenda 2/9/05 Art for New Media Quick Write/Sketch Last Day for basic HTML –Relative links (how to go inside a folder and back up a folder) –Changing link.
1 HTML. 2 Full forms WWW – world Wide Web HTTP – Hyper Text Transfer Protocol HTML – Hyper Text Markup Language.
Chapter 4 HTML Tags. HTML is written in something called tags. Tags come in pairs, an opening one and a closing one. The first pair of tags we'll write.
Revision Webpage design HTML.   FACE  Attributes  Marquee  Define the following terms.
1 R3 R1 R5 R4 R6 R2 B B A A Looking at the Code Under the View menu Select Source.
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.
Web Site Design Unit 11.3A: Web programming. Tags and Elements O h1 O p O h6 O li O Ol O Ul O Strong O Bold O Emphasis O Sub O Sup O How many standard.
Getting Started – Basic Page Structure
HTML Basics.
HTML basics
Section 4.1 Section 4.2 Format HTML tags Identify HTML guidelines
Images in HTML PowerPoint How images are used in HTML
Getting Started – Table 2
<TAG> <html> <head>
HTML Images CS 1150 Spring 2017.
COMPUTING FUNDAMENTALS
Basic HTML and Embed Codes
Websites lesson 5.
HTML Links.
HTML Images CS 1150 Fall 2016.
Pertemuan 1b
Lesson 4: Hyperlinks.
Introduction to HTML.
Pertemuan 1 Desain web Pertemuan 1
Images in HTML PowerPoint How images are used in HTML
Presentation transcript:

Introduction to HTML 4.0 Getting Started – Links, Images, Font, and List Teacher: Mr. Ho

Link Tag: … Link Tag: … … create a hyperlink so that you can go from one web page to another If you want to link to a Google web page, you can do the following: Google Make sure that … are between and Make sure to include

Attributes of … Attributes of … Besides the href attribute, there are more attributes of …. Check this out at

Image Tag: Image Tag: creates an image in an HTML file There is no end tag for To create an image in your HTML page, do this: Make sure that is between and Note: happyFace.gif must be in the same folder as your HTML page.

Image Tag: Image Tag: You can create a link on your image. To do this: There are more attributes of beside src: ◦ height ◦ width ◦ border

Font Tag: … Font Tag: … … set the font face, font size, and font colour of the text between the opening and closing tags. As you can guess, the attributes of … are: ◦ face ◦ size ◦ color

Font Tag: … Font Tag: … Example: Testing the Font Make sure that … are between and To figure out the attribute value for the font face, go to Microsoft Word.

List: Unordered List Unordered list looks like this: Example of Unordered List: Coffee Tea Milk To create this in HTML, you do: Example of Unordered List: Coffee Tea Milk

List: Ordered List Ordered list looks like this: Example of Unordered List: 1.Coffee 2.Tea 3.Milk To create this in HTML, you do: Example of Unordered List: Coffee Tea Milk

Questions & Answers Do you have any questions so far? If you do, please ask now.