学习HTML5+CSS3的第二天

今天第二天学习Html5+css3

今天根据书上一共写了两个小实例

第1个实例关于音频播放文件

 1 <!DOCTYPE HTML>
 2 <html>
 3 <body>
 4 <video tideh="320" height="240" contorls="controls">
 5 <source src="/i/movie.ogg" type="video/ogg">
 6 <source src="/i/movie.mp4" type="video/ogg">
 7  hellow word！
 8 </video>
 9 </body>
10 </html>

firefox预览

IE预览

没有加<meta charset="UTF-8">这句表名编码方式，然后出现乱码

第二个实例

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4 <meta charset="UTF-8">
 5 <style type="text/css">
 6 body
 7 { 8 font-size:70%;
 9 font-family:verdana,helvetica,arial,sans-serif;
10 }
11
12 </style>
13 <script type="text/javascript">
14 funcation cnvs_getCoordinates(e)
15 {
16 x=e.clientX;
17 y=e.clientY;
18 document.getElementBtId("xycoordinates").innerHTML="Coordinates:("+x+","+y+")";
19 }
20 funcation cnvs_clearCoordinates()
21 {
22 document.getElementById("xycoordinates").innerHTML="";
23 }
24 </script>
25 </head>
26 <body style="margin:0px;">
27 <p>
28 把鼠标悬停在下面的矩形可以看到坐标：
29 </p>
30 <div id="coordiv" style="float:left;width:199px;height:99px;border:1px solid #c3c3c3"
31 onmousemove="cnvs_getCoordinates(event)"
32 onmouseout="cnvs_clearCoordinates()"></div>
33 <br/>
34 <br/>
35 <br/>
36 <div id="xycoordinates"></div>
37 </body>
38 </html>

firefox预览无效果

转载于:https://www.cnblogs.com/FFXJDD/p/4334632.html

学习HTML5+CSS3的第二天相关推荐

学习HTML5+CSS3的第一天
昨天在京东上买了本书HTML5+CSS3从入门到精通今天开始我的第一天学习开始我的第一个HTML5页面 1 <!DOCTYPE html> 2 <html> 3 <h ...
学习HTML5+CSS3
目录一,HTML5学习概述 1,认识HTML5 概述发展历程 HTML5和HTML4的区别 2,HTML5 的语法与结构 HTML5 标签 HTML5 标签属性 HTML5 文档注释 HTML5 ...
菜鸟学习HTML5+CSS3（一）
主要内容: 1.新的文档类型声明(DTD) 2.新增的HTML5标签 3.删除的HTML标签 4.重新定义的HTML标签一.新的文档类型声明(DTD) HTML 5的DTD声明为:<!d ...
第一章前端开发——HTML5/CSS3
第一章前端开发学习--HTML5/CSS3 一.初识HTML 二.HTML5/CSS3基础三.页面组件四.页面布局五.CSS3新增功能一.初识HTML 什么是HTML(what): HTML ...
小米商城（HTML5+CSS3版）
正在学习HTML5+CSS3的小伙伴们如果想练手的话,可以先照着小米商城的网站敲.因为还没有学到JS,下面代码只实现了部分功能: index:html <!DOCTYPE html> &l ...
HTML5+CSS3盒布局
最近正在学习HTML5+CSS3,记录下备忘 1.第一种盒模型 <!DOCTYPE> <html> <head> <meta http-equiv=" ...
HTML5+CSS3网页模板
HTML5已经得到众多网页设计者的推崇,国际W3C标准组织及全球许多著名互联网公司也首推新的HTML5脚本,再加CSS3的推出,越来越多的人开始学习使用HTML5+CSS3来设计网页. 最好模板特此推 ...
前端HTML5+CSS3学习笔记
HTML5+CSS3学习笔记 ==CSS第一天== 一.css简介二.css语法规范三.css代码风格四.css选择器的作用五.css基础选择器 1.标签选择器: 2.类选择器 3.多类名选择 ...
HTML5+CSS3的学习(一)
HTML5+CSS3的学习(一) 2018版李立超html+css基础 103集教程,哔哩哔哩链接:https://www.bilibili.com/video/BV1sW411T78k?spm_id ...

学习HTML5+CSS3的第二天

学习HTML5+CSS3的第二天相关推荐

最新文章

热门文章