HTML Paragraphs Paragraphs are defined with the tag. Example This is a paragraph This is another paragraph.

Slides:



Advertisements
Similar presentations
Introduction to Web Design Lecture number:. Todays Aim: Introduction to Web-designing and how its done. Modelling websites in HTML.
Advertisements

Farhan Nisar University of Peshawar
HyperText Markup Language (HTML). Introduction to HTML Hyper Text Markup Language HTML Example The structure of an HTML document Agenda.
Internet Services and Web Authoring (CSET 226) Lecture # 5 HyperText Markup Language (HTML) 1.
HTML: HyperText Markup Language Hello World Welcome to the world!
MR.Mohammed Sharaf al Shareef
XHTML and CSS Overview. Hypertext Markup Language A set of markup tags and associated syntax rules Unlike a programming language, you cannot describe.
XHTML and CSS Overview. Hypertext Markup Language A set of markup tags and associated syntax rules Unlike a programming language, you cannot describe.
HTML Code. What we will cover Basic HTML Body Font Images Hyperlinks Tables Frames.
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
Week 1 8/10/2015iSTTS, Agenda Introduction to HTML Creating and publishing a Web page Validating a document Main HTML elements Block-level HTML.
HTML 2. What is an HTML File? HTML stands for Hyper Text Markup Language An HTML file must have an htm or html file extension  With newer software it.
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.
INTRODUCTION TO WEB DEVELOPMENT AND HTML Lecture 06: Tables - Spring 2011.
Web Page Creation Part II ST: Introduction to Web Interface Design Prof. Angela Guercio.
Computer Sciences Department
HTML Tags. Objectives Know the commonly used HTML tags Create a simple webpage using the HTML tags that will be discussed.
XHTML1 Tables N100 Creating a Simple Web Page. XHTML2 Creating Basic Tables Tables are collections of rows and columns that you use to organize and display.
Review 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,
Bayu Priyambadha, S.Kom. for long documents, you can even have links to other locations in that same document  … where ident is a variable for identifying.
CpSc 462/662: Database Management Systems (DBMS) (TEXNH Approach) HTML Basics James Wang.
CS105 Introduction to Computer Concepts HTML
Chapter 2: The Client Side: HTML CIS 275—Web Application Development for Business I.
_ HTML, XHTML & CSS Sami Niemelä | Module 1: Introduction to digital media: Day 02.
Learning HTML. HTML Attributes HTML elements can have attributes Attributes provide additional information about an element Class – specifies a class.
ACM 511 HTML Week -1 ACM 511 Course Notes. Books ACM 511 Course Notes.
Understanding HTML Code
 HTML stands for Hyper Text Mark-up Language. The coding language used to create documents for the World Wide Web  HTML is composed of tags. HTML tags.
HTML history, Tags, Element. HTML: HyperText Markup Language Hello World Welcome to the world!
CIS67 Foundations for Creating Web Pages Professor Al Fichera Reference for CIS127 and CIS 137.
1 CSC 121 Computers and Scientific Thinking David Reed Creighton University HTML and Web Pages.
1 eVenzia Technologies Learning HTML, XHTML & CSS Chapter 2.
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.
1 HTML محمد احمدی نیا 2 Of 43 What is HTML?  HTML stands for Hyper Text Markup Language  HTML is not a programming language, it.
>> 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.
CHAPTER 1 HTML & HTML5 I อ. ยืนยง กันทะเนตร คณะเทคโนโลยีสารสนเทศและการสื่อสาร มหาวิทยาลัยพะเยา 1.
HTML: Tables & Frames Internet Technology1. HTML: Tables Table tags ► surround the entire table ► header row (text is boldfaced) ► surround each row ►
CS105 INTRODUCTION TO COMPUTER CONCEPTS HTML Instructor: Cuong (Charlie) Pham.
Web Design and Development for Business Lecture 3 Hyper Text Markup Language (HTML)
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.
Ali Alshowaish. What is HTML? HTML stands for Hyper Text Markup Language Specifically created to make World Wide Web pages Web authoring software language.
Introduction to HTML Xiangming Mu 9/23/ Learning Objectives Understand basic HTML tags and their attributes Learn to create a simple HTML page.
Computer Science 101 Lists and Tables. Lists Unordered lists - use a bullet Ordered lists - use a number, Roman numeral, or letter.
HTML Basics Computers. What is an HTML file? *HTML is a format that tells a computer how to display a web page. The documents themselves are plain text.
CSE 409 – Advanced Internet Technology 1 DISCUSSION OF BASIC HTML TAGS.
HTML (Hyper Text Markup Language) Lecture II. Review Writing HTML files for web pages – efficient compact – fundamental. Text files with htm extension.
1 CSC317/318 INTERNET PROGRAMING / DYNAMIC WEB APPLICATION DEVELOPMENT Siti Nurbaya Ismail Faculty of Computer Science & Mathematics, Universiti Teknologi.
WEEK -1 ACM 262 ACM 262 Course Notes. HTML What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML.
HTML CS 105. Page Structure HTML elements control the details of how a page gets displayed. Every HTML document has the following basic structure: … …
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.
REEM ALMOTIRI Information Technology Department Majmaah University.
Department of Computer Science, Florida State University CGS 3066: Web Programming and Design Spring
Department of Computer Science, Florida State University CGS 3066: Web Programming and Design Spring
1999, COMPUTER SCIENCE, BUU Introduction to HTML Seree Chinodom
©SoftMoore ConsultingSlide 1 Introduction to HTML: Block-Level Elements.
INT222 – Internet Fundamentals
Chapter 1: Intro to HTML Section 1: HTML Structure Presentation Section 2: Layout of an HTML File Section 3: Working with Lists & Tables Section 4: HTML.
This is a test Webpage Wow, I’m writing my first webpage.
Hyper Text Markup Language.  My First Heading My first paragraph. Example Explained The DOCTYPE declaration defines the document type The text between.
HTML for web designing short course. What is an HTML File? HTML stands for Hyper Text Markup Language An HTML file must have an htm or html file extension.
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.
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.
HTML Help book. HTML HTML is the programming language used to make web pages for the Internet. HTML stands for Hyper Text Markup Language. HTML is made.
HTML Paragraphs Paragraphs are defined with the tag. Example This is a paragraph This is another paragraph.
HTML: HyperText Markup Language
>> HTML: Tables.
Computers and Scientific Thinking David Reed, Creighton University
Web Design and Development
Lesson 5: HTML Tables.
Presentation transcript:

HTML Paragraphs Paragraphs are defined with the tag. Example This is a paragraph This is another paragraph

HTML Headings HTML headings are defined with the to tags. Example This is a heading This is a heading This is a heading

HTML Links HTML links are defined with the tag. Example This is a link

HTML Images HTML images are defined with the tag. Example

HTML Elements HTML documents are defined by HTML elements. An HTML element is everything from the start tag to the end tag: Start tag * Element content End tag * This is a paragraph This is a link * The start tag is often called the opening tag. The end tag is often called the closing tag.

HTML Attributes HTML elements can have attributes Attributes provide additional information about an element Attributes are always specified in the start tag Attributes come in name/value pairs like: name="value" Example This is a link

Most HTML elements

HTML Comments Example

HTML Tag Reference

The element is an empty HTML element. It has no end tag. or In XHTML, XML, elements with no end tag (closing tag) are not allowed. Even if works in all browsers, writing instead works better in XHTML and XML applications.

You cannot be sure how HTML will be displayed. Large or small screens, and resized windows will create different results. With HTML, you cannot change the output by adding extra spaces or extra lines in your HTML code. The browser will remove extra spaces and extra lines when the page is displayed. Any number of lines count as one line, and any number of spaces count as one space.

HTML Text Formatting

HTML Text Formatting Tags

HTML "Computer Output" Tags

HTML Citations, Quotations, and Definition Tags

HTML Tag

HTML Tags

HTML Tag

Horizontal line <hr size="18" width="60%" align="center" color="green"

Horizontal line thanks for visiting us thanks for visiting us thanks for visiting us thanks for visiting us

The HTML Tag Should NOT be Used The tag is deprecated in HTML 4, and removed from HTML5. The World Wide Web Consortium (W3C) has removed the tag from its recommendations. In HTML 4, style sheets (CSS) should be used to define the layout and display properties for many HTML elements.

Styling HTML with CSS

CSS is used to style HTML elements

HTML Style Example - Font, Color and Size

HTML Style Example - Text Alignment

Deprecated ” مستنكر “Tags and Attributes

HTML Links - The target Attribute

HTML Links

HTML Images

How to align an image within the text.

How to let an image float to the left or right of a paragraph.

How to use an image as a link.

How to create an image map, with clickable regions. Each of the regions is a hyperlink

HTML Image Tags

this is marquee <img height="100" width ="100" src="C:\Documents and Settings\dr.Yas\My Documents\My Pictures\logo.jpg" alt=" المجمعة " this is the first paragraph this is a picture with paragraph

links Untitled yahoo google pic get text file send me

Untitled < <a morning&body=please help" title="help message"> send me

Side menues Untitled centered heading is used for digital listing is used for points listing is used for notations and margins Coffee Black hot drink Milk White cold drink

Untitled computer subjects introduction to computers application of computers internet programming

Untitled computer subjects introduction to computers application of computers internet programming

Untitled computer subjects introduction to computers application of computers internet programming

Untitled computer subjects introduction to computers application of computers internet programming

computer subjects <dl style="background-color: #66ccff;" style="color: #666666;" onmouseover="javascript:alert('it is different color');"> introduction to computers application of computers internet programming

Untitled computer subjects introduction to computers application of computers internet programming introduction to computers it is discription application of computers internet programming introduction to computers application of computers internet programming

computer subjects introduction to computers application of computers internet programming computer subjects introduction to computers application of computers internet programming computer subjects introduction to computers application of computers internet programming

Untitled HTML Hyper text markup language JS Java Script language

Tables Untitled line 1 row 1 line 1 row 2 line 2 row 1 ine 2 row 2

Untitled <table border="8" bgcolor="#00ffff" cellpadding="8" style="color: #6699ff;" style="background-color: #ffff33;"> the table name line 1 row 1 line 1 row 2 line 2 row 1 ine 2 row 2

<! Colspan تستخدم لدمج عدة اعمدة "column span"¡ " border تستخدم لوضع فاصل بين الخلايا <! Cellpadding من اجل ضبط الفراغات فى الجدول <! Cellspacing من اجل تحديد المسافة بين الحد و محتوى الخلية <bgcolor لإعطاء لون للصف او الخلية Link to heading 1 <img src=" C:\Documents and Settings\Dr. Yaser\ My Documents\My Pictures\aqsa.jpg "> <img src=" C:\Documents and Settings\Dr. Yaser\ My Documents\My Pictures\aqsa.jpg "> <img src=" C:\Documents and Settings\Dr. Yaser\ My Documents\My Pictures\aqsa.jpg "> <img src=" C:\Documents and Settings\Dr. Yaser\ My Documents\My Pictures\aqsa.jpg ">

Header 1 Header 2 row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2

With a normal border: First Row Second Row With a thick border: First Row Second Row With a very thick border: First Row Second Row

Iframe In line frame

iframe An iframe is used to display a web page within a web page.

Iframe attributes

Some older browsers don't support iframes. If they don't, the iframe will not be visible.

Some older browsers don't support iframes. If they don't, the iframe will not be visible. <iframe title="YouTube video player" class="youtube-player" type="text/html" width="640" height="390" src=" xhJYh3I"frameborder="0" allowFullScreen> <iframe title="YouTube video player" class="youtube-player" type="text/html" width="640" height="390" src=" xhJYh3I"frameborder="0" allowFullScreen>

To embed windows media To embed flash

To embed audio as background in your web page 1- upload your audio, 2- get upload link