Introduction to HTML academy.zariba.com 1
Introduction to HTML academy.zariba.com 1. Lecture Content 1.What is HTML? 2.The HTML Tag 3.Most popular HTML tags 2.
Dec 23, 2015
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
1
Introduction to HTML
academy.zariba.com
2
Lecture Content
1. What is HTML?2. The HTML Tag3. Most popular HTML tags
3
What is HTML?
• HTML – Hyper Text Markup Language
• Describes the document structure and formatting
• You can think of HTML page as a Word document
• An HTML document consists of many tags, which have different attributes – size, color, etc.
4
The HTML Tag
• Tags are the building blocks in an HTML document• Each tag starts with “<” and ends with “>”• There are two types – opening and closing e.g. <body><h1> Bunny Website </h1></body>• There are self-closing tags e.g. <hr/> or <br/>• Attributes are properties of HTML elements. They are used to
set size, color, border, alignment, etc. e.g. <span color=“red”>This is red.</span>• Some attributes are common for every HTML element e.g. id, class, name, style, etc.• Some are specific e.g. <img src=“picture.png”/> , <a href=“somelink”>Click</a>
5
Most Popular HTML tags
<b></b> bold<i></i> italicized<u></u> underlined<sup></sup> Samplesuperscript
<sub></sub> Samplesubscript
<strong></strong> strong<em></em> emphasized<pre></pre> Preformatted text<a></a> hyperlink
<img /> image<br/> new line<h1></h1> heading<p></p> paragraph<div></div> section<span></span> section<ul></ul> unordered list<ol></ol> ordered list<li></li> list item
6
Other HTML tags
<dl></dl> definition list<dt></dt> definition term<dd></dd> definition<table></table> table<tr></tr> table row<td></td> table data<form></form> form<input></input> emphasized
7
Homework
Create a simple Bunny breeds website. The main page should consist of a list with 3 bunny breeds. When clicking on a bunny breed you should be redirected to a new page with the bunny breed as a title, pictures and some information. Try to use different tags.
8
References
9
Zariba Academy
Questions
Related Documents
![[Basic HTML/CSS] 1. html - basic tags](https://static.cupdf.com/doc/110x72/58ce75c41a28abdc578b67db/basic-htmlcss-1-html-basic-tags.jpg)
