HTML Tutorial Fan Zhang. About me Fan Zhang ROOM6150 OFFICE HOUR(TBD)

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 HTML
3.02D HTML Overview 3.02 Develop webpages.
HTML Basics 1450 Technology Seminar Copyright 2003, Matthew Hottell.
1 Programming the Web: HTML Basics Computing Capilano College.
HTML Introduction CS 1020 – Lego Robot Design. Building Websites HTML (HyperText Markup Language)  The dominate language of the internet  Describes.
1 Lesson 5. 2 R3 R1 R5 R4 R6 R2 B B A A
CSS Cascading Style Sheets. Objectives Using Inline Styles Working with Selectors Using Embedded Styles Using an External Style Sheet Applying a Style.
CS 1150 – Lab #16A & 16B – HTML TA – Sanjaya Wijeratne – Web Page -
Build Your Own Webpage Code Academy.
HTML Creating Web pages. HTML Hyper Text Markup Language Not programming, but a markup language using tags to format text in Web browsers.
HTML Creating Web pages. HTML Hyper Text Markup Language Not programming, but a markup language using tags to format text in Web browsers.
HTML FORMATTING. CONTENTS HTML Formatting Formatting Example Formatting Example Output Summary Exercise.
Introduction to HTML academy.zariba.com 1. Lecture Content 1.What is HTML? 2.The HTML Tag 3.Most popular HTML tags 2.
HTML Tags. Objectives Know the commonly used HTML tags Create a simple webpage using the HTML tags that will be discussed.
MORE HTML REMEMBER TO SEARCH W3 SCHOOLS FOR MORE INFO.
Define html document byusing Example : Title of the document The content of the document......
Headings, Paragraphs, Formatting, Links, Head, CSS, Images
_ HTML, XHTML & CSS Sami Niemelä | Module 1: Introduction to digital media: Day 02.
Continuing HTML. Hyperlinks There are two types of hyperlinks, one that keeps the viewer within the webpage, the other that takes the viewer outside to.
HTML HTML stands for "Hyper Text Mark-up Language“. Technically, HTML is not a programming language, but rather a markup language. Used to create web pages.
Programming in HTML.  Programming Language  Used to design/create web pages  Hyper Text Markup Language  Markup Language  Series of Markup tags 
ACM 511 HTML Week -1 ACM 511 Course Notes. Books ACM 511 Course Notes.
1 Essential HTML coding By Fadi Safieddine (Week 2)
Wikispaces Tutorial Adapted from a slideshow by: Jennifer Carrier Dorman
HTML Introduction to HTML Tags. HTML Document My first HTML document Hello world!
HTML history, Tags, Element. HTML: HyperText Markup Language Hello World Welcome to the world!
Using Html Basics, Text and Links. Objectives  Develop a web page using HTML codes according to specifications and verify that it works prior to submitting.
McGraw-Hill/Irwin Copyright © 2013 by The McGraw-Hill Companies, Inc. All rights reserved. Extended Learning Module F Building a Web Page with HTML.
DHTML AND JAVASCRIPT Genetic Computer School LESSON 2 HTML TAGS G H E F.
CSCI 1101 Intro to Computers
Introduction to HTML. HTML Hyper Text Markup Language Page Title My First Heading My first paragraph. Page Title My First Heading My first paragraph.
HTML Basic I IST2101. Keep In Mind Programming can be time consuming. Plan ahead!
Programming in HTML.  Programming Language  Used to design/create web pages  Hyper Text Markup Language  Markup Language  Series of Markup tags 
HTML (continued). Assignment 3 Creating a web page with:  Images  Hyperlinks to some websites  Hyperlinks to your  Information about a company,
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.
Open Dreamweaver Start All programs Adobe design and web premium Adobe Dreamweaver.
HTML Hyper Text Markup Language. What is an HTML File?  HTML stands for Hyper Text Markup Language  An HTML file is a text file containing small markup.
All you ever needed to know…and more!. H.T.M.L. HyperText Mark-up Language Web’s programming language All web browsers Set of instructions Written with.
Hypertext Mark-Up Language Web Page Creation HTML.
HTML Basic IST2101. Keep In Mind Programming can be time consuming. Plan ahead!
INTRODUCTORY Tutorial 1 Using HTML Tags to Create Web Pages.
HTML. Hypertext Markup Language Lesson Objectives 1. We will be able to understand the need for HTML and where it is used 2. We will be edit HTML to.
CREATING WEB PAGES Using…More HTML code! My First \ Web Page.
Ali Alshowaish. What is HTML? HTML stands for Hyper Text Markup Language Specifically created to make World Wide Web pages Web authoring software language.
CPT 499 Internet Skills for Educators Session Ten Class Notes.
HTML file format  Lesson Objective: Understanding HTML and how it is used to create web pages.  Learning Outcome:  Create a HTML page by interpreting.
Wikispaces in Education Tutorial Fatema Kashoob Nawal ALKathiri
HTML for ISD Brown Bag Presentation Session 2 What we will cover:  Basics of HTML  How to make your first page  Links  Text formatting.
HTML. Hyper Text Markup Language Markup your text document The markup is the tag Hyper text means you can jump from place to place.
INTRODUCTION TO HTML ENGL 307 March 28 th, Hyper Text Markup Language What is HTML?
HTML BASIC IST 210: Organization of Data IST210 1.
HTML HYPER TEXT MARKUP LANGUAGE. INTRODUCTION Normal text” surrounded by bracketed tags that tell browsers how to display web pages Pages end with “.htm”
Web Technology (NCS-504) Prepared By Mr. Abhishek Kesharwani Assistant Professor,UCER Naini,Allahabad.
CS 100 Introduction to Web Page Construction and HTML.
HyperText Markup Language (HTML) Developing a Web Page.
HTML. HTML: What is it? – HTML stands for Hyper Text Markup Language – An HTML file is a text file containing small markup tags – The markup tags tell.
HTML. INDEX Introduction to HTML Creating Web Pages Commands And Tags Web Page.
HTML ELEMENTS THE SUPER BASICS. OPENING AND CLOSING If a tag is opened Then the tag must be closed.
HTML. Hyper Text Markup Language Markup your text document The markup is the tag Hyper text means you can jump from place to place Programming language.
Week-11 (Lecture-1) Introduction to HTML programming: A web based markup language for web. Ex.
HTML Basic IST 210: Organization of Data IST2101.
Lesson 5. XHTML Tags, Attributes and Structure XHTML Basic Structure head and body titles Paragraph headings comments Document Presentation Manipulating.
Tag Basics.
WEBSITE DESIGN Chp 1
(HTML tags can be referred from
An Introduction to HTML Pages
2 Hours Minutes Seconds Insert Text Here.
Adding Text and links to your classes in PowerSchool
CGS 3066: Web Programming and Design Fall 2019
Presentation transcript:

HTML Tutorial Fan Zhang

About me Fan Zhang ROOM6150 OFFICE HOUR(TBD)

Works we will do in class Materials that cannot be covered in class Information related to assignments

HTML Tutorial First version: HTML Tags(1989, Tim Berners Lee) Latest: HTML5(2011) Best resource for learning HTML: – asp

Writing HTML is Easy! Step1: Know the tags Step2: Write the tags – Keep the tags matched Step3: Save it as HTML

Basic Example Basic Tags required: Hello World!

Let’s cook it a little bit… Adding Headings: Fan says Hello World!

Paragraphs Fan says Hello World! Hello World! For comparison Hello World!

Adding a break Fan says Hello World! Hello World! For comparison Hello World!

Adding more breaks Fan says Hello World! Hello World! For comparison Hello World!

More text formatting This text is bold This text is strong This text is emphasized This text is italic This text is small This is subscript and superscript

Hyperlinks Fan says Hello World! Click here! For comparison Hello World!

Insert an Image Fan says Hello World! Click here! <img src=" alt="W3Schools.com" > For comparison Hello World!

Image link Fan says Hello World! <img src=" alt=“Click here" > For comparison Hello World!

Table Basic Tags: – Head: – Row: – Column:

Tables sample a b c

Tables Cell that spans two columns: Name Telephone Bill Gates

List An Unordered List: Coffee Tea Milk Ordered List: Coffee Tea Milk

Nested List A nested List: Coffee Tea Black tea Green tea Milk

Table and list This is a paragraph This is another paragraph This cell contains a table: A B C D This cell contains a list apples bananas pineapples HELLO

Form Username: Password:

Learn more from W3School! ples.asp

Thank you!