›
›

Bài giảng Lập trình Web - Chapter 1: Introduction to HTML (Cont) - Nguyễn Hữu Hiếu

Download
Chapter 1  
Introduction to HTML (cont)  
Lectured by:  
Nguyễn Hữu Hiếu  
New Doctype  
◼ <!DOCTYPE html>  
◼ Works now in all browsers for “standards mode” start  
using it!  
◼ https://www.w3schools.com/tags/tag_doctype.asp  
THE EVOLUTION OF HTML  
HTML 4  
1997  
XHTML  
2000  
HTML5  
Work In Progress  
Had some  
presentational  
elements  
Written in XML  
Can be used today  
Presentational  
elements removed  
◼ - Recent versions:  
◼ - HTML 4.0 – 1997  
◼ - HTML 4.01 - 1999 - A cleanup of 4.0  
◼ - XHTML 1.0 - 2000  
◼
- Just 4.01 defined using XML, instead of SGML  
◼ - XHTML 1.1 – 2001  
◼
- Modularized 1.0, and drops frames  
◼ - W3C worked on XHTML 2.0; WHAT worked on a new  
version of HTML  
◼ - In 2009, XHTML 2.0 was stopped; W3C took over  
development of HTML5  
Content Elements  
<header>  
<nav>  
<article>  
<aside>  
<section>  
<footer>  
<summary>  
<details>  
Audio and Video  
◼ Native Audio Element  
<audio>  
<source src="music.oga" type="audio/ogg">  
<source src="music.mp3" type="audio/mpeg">  
</audio>  
◼ Native Video Element  
<video src="video.ogv" controls poster="poster.jpg" width="320" height="240">  
<a href="video.ogv">Download movie</a>  
</video>  
Audio and Video  
◼ Making your own video controls  
<video src="video.ogg" id="video"></video>  
<script>  
var video = document.getElementById("video");  
</script>  
<p>  
<button onclick="video.play();">Play</button>  
<button onclick="video.pause();">Pause</button>  
<button onclick="video.currentTime = 0;">Rewind</button>  
</p>  
Canvas - 2d Drawing  
function draw() {  
var ctx = document.getElementById('canvas').getContext('2d');  
var img = new Image();  
img.onload = function(){  
ctx.drawImage(img,0,0);  
ctx.beginPath();  
ctx.moveTo(30,96);  
ctx.lineTo(70,66);  
ctx.lineTo(103,76);  
ctx.lineTo(170,15);  
ctx.stroke();  
}
img.src = 'images/backdrop.png';  
}
https://developer.mozilla.org/en/Canvas_tutorial  
New Form Elements  
◼ New Input Types  
tel, search, url, email, datetime, date, month, week,  
time, datetime-local, number, range, color  
◼ New Elements  
<datalist>  
<meter>  
<progress>  
<output>  
Iframes  
<iframe width="450" height="350"  
src="http://maps.google.co.uk/maps?  
q=moma+new+york&amp;output=embed"  
frameborder="0"  
scrolling="0">  
</iframe>  
INFORMATION ABOUT YOUR PAGES  
<head>  
<title>Essay</title>  
<meta name="description"  
content="An essay on installation art" />  
<meta name="keywords"  
content="essay,installation art" />  
<meta http-equiv=”author”  
content="Jon Duckett" />  
<meta charset = ″utf-8″ />  
</head>  
Tài Liệu Tham Khảo  
◼ [1] Unix Network Programming, Vol. 1, Third Edition, The  
Sockets Networking API, W. Richard Stevens, Bill Fenner,  
Andrew M. Rudoff, Addison Wesley, 2003  
Trường Đại Học Bách Khoa TP.HCM  
Khoa Khoa Học và Kỹ Thuật Máy Tính  
© 2017  
Lập Trình Web  
13  
ppt 13 trang myanh 23580 Free
Download
Bạn đang xem tài liệu "Bài giảng Lập trình Web - Chapter 1: Introduction to HTML (Cont) - Nguyễn Hữu Hiếu", để tải tài liệu gốc về máy hãy click vào nút Download ở trên

File đính kèm:

  • pptbai_giang_lap_trinh_web_chapter_1_introduction_to_html_cont.ppt