html5-1 网页结构描述

一、总结

一句话总结：注意head中的title，keywords，description，这对seo优化很有帮助

1、如何给某元素动态使用类似onclick方法？

点onclick，然后在onclick中添加事件即可

28 $('div').mouseenter(function(){

2、jquery中如何使用setInterval函数？

和在js中一模一样

31     setInterval(function(){
32         s+=v;
33         $('div').css({'transform':'rotate('+s+'deg)'});
34     },10);

3、jquery中如何设置css？

点css，然后是，大括号，里面键值对，都加引号

33         $('div').css({'transform':'rotate('+s+'deg)'});

4、设置动画的关键字是什么？

transform

33         $('div').css({'transform':'rotate('+s+'deg)'});

5、!doctype html> 是什么？

html5文档声明

二、网页结构描述

 1 文档类型:
 2 <!doctype html>
 3 
 4 网站代码结构:
 5 <html>
 6     <head>
 7         <meta charset="UTF-8">
 8         #设置浏览器的阅读编码
 9 
10         <title>云知梦-太原PHP培训|山西PHP培训</title>
11         #设置网站首页的标题
12 
13         <meta name="keywords" content="山西PHP培训,太原PHP培训,山西PHP开发>
14         #设置网站的关键字
15 
16         <meta name="description" content="云知梦PHP培训-致力于PHP培训、LAMP技术培训,只为有梦想的人。>
17         #网站描述
18     </head>
19 
20     <body>
21         <h1>云知梦，只为有梦想的人!</h1>    
22         <h1>云知梦，只为有梦想的人!</h1>    
23         #可见的网站骨架或实体内容
24 
25     </body>
26 </html>

三、代码

页面中图片旋转实例

 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>小帅</title>
 6     <!-- css样式设计 -->
 7     <style>
 8         div{
 9             256px;
10             height:256px;
11             border:10px inset #f00;
12             margin:0 auto;
13             background: #ccc;
14             border-radius:256px;
15             cursor: pointer;
16         }
17     </style>    
18     <script src="jquery.js"></script>
19 </head>
20 <!-- html标签 -->
21 <body>
22     <div>
23         <img src="xs.png" alt="">    
24     </div>
25 </body>
26 <!-- js特效 -->
27 <script>
28 $('div').mouseenter(function(){
29     s=0;
30     v=10;
31     setInterval(function(){
32         s+=v;
33         $('div').css({'transform':'rotate('+s+'deg)'});
34     },10);
35 });    
36 </script>
37 </html>