滚动框元素
style.top style.left offsetWidth offsetHeight offsetTop offsetLeft scrollTop scrollLeft
<html>
<head>
<style>
#test{
width:200px;
height:200px;
border:1px solid red;
overflow:hidden;
}
</style>
</head>
<body>
<div id="test">
<div id="test1">
111111111111111111111<br>
222222222222222222222<br>
333333333333333333333<br>
444444444444444444444<br>
555555555555555555555<br>
111111111111111111111<br>
222222222222222222222<br>
333333333333333333333<br>
444444444444444444444<br>
555555555555555555555<br>
111111111111111111111<br>
222222222222222222222<br>
333333333333333333333<br>
444444444444444444444<br>
555555555555555555555<br>
<br>
</div>
<div id="test2">
</div>
</div>
<script>
var test=document.getElementById("test");
var test1=document.getElementById("test1");
var test2=document.getElementById("test2");
test2.innerHTML=test.innerHTML;
function move(){
if (test1.offsetHeight-test.scrollTop<=0){
test.scrollTop-=test1.offsetHeight;
}
test.scrollTop++;
}
setInterval("move()",30);
</script>
</body>
</html>
HTML5
html5拥有新的语义，图形及多媒体元素
html5是跨平台的，被设计在不同类型的硬件之上运行
html5的属性语法
Empty <input type="text" value="John Doe" disabled> Unquoted <input type="text" value=John Doe> Double-quoted <input type="text" value="John Doe"> Single-quoted <input type="text" value='John Doe'>
html5 新特性
HTML5 的一些最有趣的新特性：
- 新的语义元素，比如 <header>, <footer>, <article>, and <section>。
- 新的表单控件，比如数字、日期、时间、日历和滑块。
- 强大的图像支持（借由 <canvas> 和 <svg>）
- 强大的多媒体支持（借由 <video> 和 <audio>）
- 强大的新 API，比如用本地存储取代 cookie。
html5元素定义为块级元素
html5定义八个新的语义html元素。所有都是块级元素
html5中<video>标签的属性
autoplay autoplay 如果出现该属性，则视频在就绪后马上播放。
controls controls 如果出现该属性，则向用户显示控件，比如播放按钮。
height pixels 设置视频播放器的高度。
loop loop 如果出现该属性，则当媒介文件完成播放后再次开始播放。
preload preload 如果出现该属性，则视频在页面加载时进行加载，并预备播放。
如果使用 "autoplay"，则忽略该属性。
src url 要播放的视频的 URL。
width pixels 设置视频播放器的宽度。
添加视频例子：
<html>
<body>
<video width="800" height="320" controls="controls">
<source src="/E:/练习题/movie.mp4"type="video/mp4">
Your browser does not support the video tag.
</video>
</body>
</html>