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文档声明

二、网页结构描述

 文档类型:

 <!doctype html>

 网站代码结构:

 <html>

     <head>

         <meta charset="UTF-8">

         #设置浏览器的阅读编码

         <title>云知梦-太原PHP培训|山西PHP培训</title>

         #设置网站首页的标题

         <meta name="keywords" content="山西PHP培训,太原PHP培训,山西PHP开发>

         #设置网站的关键字

         <meta name="description" content="云知梦PHP培训-致力于PHP培训、LAMP技术培训,只为有梦想的人。>

         #网站描述

     </head>

     <body>

         <h1>云知梦，只为有梦想的人!</h1>

         <h1>云知梦，只为有梦想的人!</h1>

         #可见的网站骨架或实体内容

     </body>

 </html>

三、代码

页面中图片旋转实例

 <!doctype html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>小帅</title>

     <!-- css样式设计 -->

     <style>

         div{

             width:256px;

             height:256px;

             border:10px inset #f00;

             margin:0 auto;

             background: #ccc;

             border-radius:256px;

             cursor: pointer;

         }

     </style>

     <script src="jquery.js"></script>

 </head>

 <!-- html标签 -->

 <body>

     <div>

         <img src="xs.png" alt="">

     </div>

 </body>

 <!-- js特效 -->

 <script>

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

     s=0;

     v=10;

     setInterval(function(){

         s+=v;

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

     },10);

 });

 </script>

 </html>

html5-1 网页结构描述的更多相关文章

  1. 读书笔记：《HTML5开发手册》--HTML5新的结构元素

    读书笔记:<HTML5开发手册> (HTML5 Developer's CookBook) 虽然从事前端开发已有很长一段时间,对HTML5标签也有使用,但在语义化上面理解还不够清晰.之前在 ...

  2. 【原】HTML5 新增的结构元素——能用并不代表对了

    做移动端有一段时间,今天有同事问了我 article 和 section 标签的使用,模模糊糊的解释了下,他似懂非懂,有点小尴尬.忽然间觉得自己有必要再翻翻书籍,重温下 html5 的新元素.html ...

  3. 15个前卫的 HTML5 & CSS3 网页设计作品

    今天,我们编译收集一组使用 HTML5 和 CSS3 制作的精美网站.在此集合中,你可以看到平面设计,网页设计,作品集和企业网站设计实例. 响应式设计和基于 HTML5 & CSS3 编码的网 ...

  4. HTML5 常用的结构化标签整理

    一.语义化结构化标签 结构化标签优点: 1.方便浏览器处理和识别,提升了网页的质量和语义. 2.减少了大量无意义的div标签,增强代码的可读性. 结构化标签:(header,nav,body,arti ...

  5. HTML5文档结构语义：页眉的header和hgroup标签使用

    HTML5提供了新的结构元素——例如header.hgroup.article.section.footer.nav等来定义网页,将使网页结构更加简洁严谨,语义更加结构化,而不用迂回通过class或i ...

  6. 【重构前端知识体系之HTML】HTML5给网页音频带来的变化

    [重构前端知识体系之HTML]HTML5给网页音频带来的变化 引言 音乐播放,相信大家都很熟悉,但是早在之前的音乐播放之前,你的浏览器会问你,是否下载flash插件.然而现在,估计一些年轻的开发者都不 ...

  7. 32+激发灵感的HTML5/CSS3网页设计教程

      HTML5是寄托在HTML4基础上取得了的广泛成就.这不仅意味着你不必完全放弃现有的一些标记,而是可以借鉴,以加强 它. CSS3也以同样的方式在互联网内容的安排下,提供了它的柔韧性.CSS3是开 ...

  8. MongoDB学习笔记(四) 用MongoDB的文档结构描述数据关系

    MongoDB的集合(collection)可以看做关系型数据库的表,文档对象(document)可以看做关系型数据库的一条记录.但两者并不完全对等.表的结构是固定的,MongoDB集合并没有这个约束 ...

  9. HTML5新增与结构有关的元素

    HTML5新增与结构有关的元素 1.section元素 2.article元素 3.aside元素 4.header元素 5.hgroup元素 6.footer元素 7.nav元素 8.figure元 ...

随机推荐

  1. Android-ViewPager+Fragment数据更新问题

    由于FragmentPagerAdapter内部存在缓存.因此调用notifyDataSetChanged()并不可以去更新Fragment的内容. 參考:http://www.devba.com/i ...

  2. C语言速度优化之指针赋值与if推断

    近期在写的一个项目须要优化处理速度,我写了一下程序来測试指针赋值与指针推断的速度比較.结果让我大吃一惊. #include <stdio.h> #include <stdlib.h& ...

  3. 【MongoDB】在windows平台下mongodb的分片集群（六）

    在本篇博客中我们主要讨论下博客的管理.因为已经在前面五篇中写了具体的实例,因此这里就不再举例说明. 一.监控 分片集群是整个体系中比較复杂的一块,因此更应该须要监控. 主要命令: serverstat ...

  4. graphicview和widgets没本质区别。它只是更轻量级，更灵活，性能更高的widgets

    graphicview和widgets没本质区别.它只是更轻量级,更灵活,性能更高的widgets.核心就是把widgets变成了更轻量级的graphicitem,把QWidget的各种事件转换成了g ...

  5. 【前端切图】用css画一个卡通形象-小猪佩奇

    最近在腾讯云技术社区遇到了一位奇才,用css画出了一个社会人小猪佩奇,不得不服.研究了一下他的文章https://segmentfault.com/a/1190000014909658,感觉甚是有趣, ...

  6. Android实践之ScrollView中滑动冲突处理

    转载注明出处:http://blog.csdn.net/xiaohanluo/article/details/52130923 1. 前言 在Android开发中,假设是一些简单的布局.都非常easy ...

  7. datagridview问题

    在winform中,取datagridview某个单元格的值,然后与另外一个值相减,如果相减等于0,结果却为-7.105427357601E-15 Convert.ToDouble(xun_dataG ...

  8. call，apply，求最大最小值，平均数等基础编程知识

    CALL/APPLY.一些编程基础以及一些基础知识.正则 call.apply.bind 求数组的最大值和最小值: 数组排序(SORT的原理->localeCompare实现汉字比较),取头取尾 ...

  9. springboot入门（三）-- springboot集成mybatis及mybatis generator工具使用

    前言 mybatis是一个半自动化的orm框架,所谓半自动化就是mybaitis只支持数据库查出的数据映射到pojo类上,而实体到数据库的映射需要自己编写sql语句实现,相较于hibernate这种完 ...

  10. ORA-00119: invalid specification for system parameter LOCAL_LISTENER；

    错误提示内容及上下文环境: SQL> grant sysdba to weng;grant sysdba to weng*第 1 行出现错误:ORA-01034: ORACLE not avai ...