<!DOCTYPE HTML>
<html>
<body>
<canvas id="arcCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>
<canvas id="lineCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>
<canvas id="grdCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>
<canvas id="imageCanvas" width="80" height="175" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>
<script type="text/javascript">
var c=document.getElementById("arcCanvas");
var ccxt=c.getContext("2d");
cxt.fillStyle="#FF0000";
cxt.beginPath();
cxt.arc(70,18,15,0,Math.PI*2,true);
cxt.closePath();
cxt.fill();
</script>
<script type="text/javascript">
var c=document.getElementById("lineCanvas");
var ccxt=c.getContext("2d");
cxt.moveTo(10,10);
cxt.lineTo(150,50);
cxt.lineTo(10,50);
cxt.stroke();
</script>
<script type="text/javascript">
var c=document.getElementById("grdCanvas");
var ccxt=c.getContext("2d");
var grd=cxt.createLinearGradient(0,0,175,50);
grd.addColorStop(0,"#FF0000");
grd.addColorStop(1,"#00FF00");
cxt.fillStyle=grd;
cxt.fillRect(0,0,175,50);
</script>
<script type="text/javascript">
var c=document.getElementById("imageCanvas");
var ccxt=c.getContext("2d");
var img=new Image()
img.src="flower.jpg"
cxt.drawImage(img,0,0);
</script>
<br>
<br>
<br>localStorage
<br>
<script type="text/javascript">
localStorage.lastname="Smith";
document.write(localStorage.lastname);
</script>
<br>
<br>
<script type="text/javascript">
if (localStorage.pagecount)
{
localStorage.pagecount=Number(localStorage.pagecount) +1;
}
else
{
localStorage.pagecount=1;
}
document.write("Visits "+ localStorage.pagecount + " time(s).");
</script>
<form action="/example/html5/demo_form.asp" method="get">
E-mail: <input type="email" name="user_email" /><br />
Homepage: <input type="url" name="user_url" /><br />
Points: <input type="number" name="points" min="1" max="10" /><br />
Points: <input type="range" name="points" min="1" max="10" /><br />
Date: <input type="date" name="user_date" /><br />
Month: <input type="month" name="user_date" /><br />
Week: <input type="week" name="user_date" /><br />
Time: <input type="time" name="user_date" /><br />
Date and time: <input type="datetime" name="user_date" /><br />
Date and time: <input type="datetime-local" name="user_date" /><br />
Webpage: <input type="url" list="url_list" name="link" />
<datalist id="url_list">
<option label="W3School" value="http://www.w3school.com.cn" />
<option label="Google" value="http://www.google.com" />
<option label="Microsoft" value="http://www.microsoft.com" />
</datalist>
<input type="submit" />
</form>
</body>
</html>
分享到：
相关推荐
作为HTML5初学者，了解并掌握其基本概念和特性至关重要。 首先，HTML5的主要目标是简化开发过程，提高网页的可访问性和互操作性。它在HTML4的基础上进行了大量的改进和扩展，引入了新的元素、属性和API，以适应现代...
Web前端HTML5 CSS3初学者零基础入门全套学习笔记 Web前端HTML5 CSS3初学者零基础入门全套学习笔记 Web前端HTML5 CSS3初学者零基础入门全套学习笔记 Web前端HTML5 CSS3初学者零基础入门...
在探讨HTML初学者入门教程之前，我们首先需要理解HTML是什么。HTML，全称为超文本标记语言（Hypertext Markup Language），是一种用来创建网页的标准标记语言。HTML文件是包含文本内容和标记（tags）的特殊文本文件...
对于初学者来说，选择一个合适的HTML框架能够极大地提高学习效率和开发体验。"安然静态园"是一个可能的例子，它可能是为初学者设计的一个教学框架，旨在简化HTML的学习过程。 HTML（超文本标记语言）是网页内容的...
HTML（HyperText Markup Language）是用于创建网页的标准标记语言，对于初学者来...总之，作为HTML初学者，充分利用提供的学习工具和资源，结合实践操作，逐步掌握HTML基础知识，将为未来的Web开发之路打下坚实的基础。
在"html初学者制作网页举例"这个主题中，我们可以探讨以下几个重要的HTML知识点： 1. **HTML基本结构**：每个HTML文档都由`<!DOCTYPE>`声明、`<html>`元素、`<head>`元素和`<body>`元素组成。`<!DOCTYPE>`定义文档...
- **《HTML5初学者宝典》**：这是一套适合HTML5初学者的教程，内容涵盖了HTML5的基本语法、新特性介绍以及实际操作案例，非常适合初学者快速上手。 - **HTML5视频教程**：51CTO提供了多套视频教程，通过观看视频...
初学者可以通过学习HTML来理解网页的基本构造，并创建自己的网页。在"HTML简单页面初学者看"这个主题中，我们可以深入探讨以下几个重要的HTML知识点： 1. HTML基本结构：每个HTML页面都有一个标准的结构，包括`<!...
最终项目Coursera HTML5 初学者的最终项目这个项目包含我为 Coursera HTMLL 5 创建的 HTML 网页，供密歇根大学的初学者提供。 这包含标签，包括头部、正文、页脚以及进展功能和非数字列表。
它是网站内容的结构化表示，而CSS（Cascading ...总之，HTML初学者指南第二版将引导你走过HTML的基本概念和实践，使你具备创建简单网页的能力。随着对HTML的深入理解和实践，你将能够构建更复杂、更具交互性的网站。
HTML（HyperText Markup Language）是构建网页的基础语言，它允许我们用结构化的标记来组织网页内容，让..."HTML入门教材"对初学者来说是一个理想的起点，通过深入学习和实践，你将能够创建出具有个人特色的网页。
本书《sams teach yourself html5 mobile application development in 24 hours》是一本专为HTML5初学者编写的移动应用开发教程，旨在帮助初学者在24小时内掌握HTML5技术开发移动应用的基本知识和技能。通过这本书，...
在这个“html初学者课件ppt5”中，主要讲解了如何通过HTML来实现页面版式控制和添加多媒体效果。 首先，课程目标明确指出要学习页面版式控制标记，如注释、分段、换行、水平线等，以及如何插入背景音乐和多媒体文件...
【标题】"100款基本CSS+html网页（初学者学习使用）"是一个资源集合，专门为CSS和HTML初学者设计，旨在提供丰富的实例供学习和实践。这些网页设计涵盖了各种样式和应用场景，有助于新手逐步掌握这两门语言的基础知识...
初学者需要学会阅读和理解HTML和CSS文件，以及可能存在的JavaScript文件。 6. 台初教育：这可能是一个特定的教育项目或案例，涉及到为学校或教育机构创建网页。在这种情况下，网页可能需要包含课程信息、教师介绍、...
HTML（HyperText Markup Language）和CSS（Cascading Style Sheets）是网页设计的基础，对于初学者来说，掌握这两项技术是构建网页的第一步。本教程是专为零基础的初学者设计的，通过图文并茂的方式，使得学习过程...
html5讲义教程，适合初学者，建议好好学习