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-5.1编译配置（van）

    必备文件: archives1211.tgz ubuntu_install_1204.tgz 安装指引: ubuntu_install_1204/readme.txt 工作目录结构: git ├── ...

  2. 40.lombok在IntelliJ IDEA下的使用

    转自:https://www.cnblogs.com/yjmyzz/p/lombok-with-intellij-idea.html lombok是一款可以精减java代码.提升开发人员生产效率的辅助 ...

  3. 11.typeid

    #include <iostream> using namespace std; void main() { int a; cout << typeid(a).name() & ...

  4. 有关Canvas的一点小事—canvas数据和像素点

    1.  canvas生成base64数据 canvas.toDataURL()生成的数据可以直接给image对象使用作为<img>显示在前端,也可以传给后台生成图片保存.前端生成保存图片的 ...

  5. Java对ad操作

    转载:http://blog.csdn.net/binyao02123202/article/details/18697953

  6. 关于python的二维数组

    test =[ [1, 2, 3], [4, 5, 6], [7, 8, 9]]   #这个就可以看做是二维数组了,直接创建print(test)print(test[:][1])           ...

  7. Altium Designer如何创建类,如何修改线宽

    如果线宽还是没有改变,就是因为,有一个默认的class,它的规则优先级要高于PWR

  8. SpringBoot 使用yml配置 mybatis+pagehelper+druid+freemarker实例

    SpringBoot 使用yml配置 mybatis+pagehelper+druid+freemarker实例 这是一个简单的SpringBoot整合实例 这里是项目的结构目录 首先是pom.xml ...

  9. Access WMI via Python from Linux

    You can use Impacket (https://github.com/CoreSecurity/impacket) that has WMI implemented in Python. ...

  10. GridView与ArrayAdapter的结合

    activity_main.xml: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android ...