全国服务热线:4008-888-888

技术知识

HTML5学习培训心得总结(强烈推荐)

Html学习培训总结

1.甚么是html:HyperTextMarket language,超文字标识語言,是用来叙述网页页面語言,html应用标识标识来叙述网页页面,html并不是程序编写語言,是1种标识語言。

2.亲身经历过得版本号:HTML2.0、HTML3.2、HTML4.0、HTML4.0.1、HTML5

3.H5新特点:

•用于美术绘画的 canvas 元素
•用于媒体回放的 video 和 audio 元素
•对当地线下储存的更好的适用
•新的独特內容元素,例如 article、footer、header、nav、section
•新的表单控制,例如 calendar、date、time、email、url、search

4.html全是由标识构成的

5.html的基础文件格式:

XML/HTML Code拷贝內容到剪贴板
  1. <html>  
  2.     <head>  
  3.         置放1些特性信息内容,輔助信息内容。   
  4.         引进1些外界的文档。(css,javascript)   
  5.         它里边的內容会先载入。   
  6.         meta:出示有关文本文档的信息内容   
  7.         link:界定与外界資源的关联(css款式)   
  8.         style:在文本文档內容界定款式   
  9.         script:界定脚本制作程序流程,或外联脚本制作文本文档   
  10.         noscript:包括访问器禁用脚本制作,或不适用脚本制作时显示信息的內容   
  11.     </head>  
  12.     <body>  
  13.         储放真实的数据信息。   
  14.     </body>  
  15. </html>  

- DOCTYPE:申明文本文档的版本号
- meta:告知访问器1些有关该文本文档的信息内容1.html留意事项:

•大部分标识全是有刚开始标识和完毕标识,在其中有某些标识由于仅有单1作用,或沒有要装饰的內容能够在标识内完毕。

•要想对被标识装饰的內容开展更丰富多彩的实际操作,就用到了标识中的特性,根据对特性值的更改,提升了更多的实际效果挑选。

•特性与特性值之间用“=”联接,特性值能够用双引号或单引号或无需引号,1般都会用双引号。或企业要求撰写标准。

h5全局性特性:

文字元素

XML/HTML Code拷贝內容到剪贴板
  1. - br 换行   
  2. - wbr 软换行,在英小蜜章中,扩张变小访问器的情况下,遇到某1个长单词的情况下,<wbr>能够要求这个单词从哪里切开。  

<a> 超连接,特性:

XML/HTML Code拷贝內容到剪贴板
  1. 1. href:url。   
  2.   
  3. 2. targert:网页页面开启方法_blank新建网页页面开启   
  4.   
  5. 3. 锚点:也便是返回顶部那种。先在顶部界定1个id,随后在超连接中应用锚点跳去,href="#id";   
  6.   
  7. 4. 假如href中特定的协议书,访问器不可以分析,就会启用运用程序流程,能够分析的程序流程便可以开启。  

•abrr 缩略语
•b 不带任何强调实际意义的标识1段文本,加粗
•strong 表明关键內容,加粗
•em 表明侧重强调1段文本,歪斜
•i 不带任何强调实际意义的标识1段文本,歪斜
•cite 表明著作题目,将著作名歪斜
•del 表明从文本文档中删掉的文本
•s 表明文本早已已不精确,也是删掉线
•u 不带强调实际意义的给1段文本加下划线
•ins 表明添加文本文档的文本,也是下划线
•small 表明小号字体样式
•sub 表明下标文本
•sup 表明上标文本
•q 表明引自其它的內容,被q标识装饰的自身加了引号表明引入
•pre 表明文件格式化1段文本,还可以用来引进1段编码
•span css中应用的加上款式的控制模块
•div会换行,span不容易换行
•<!-- -->注解

html实体线

也便是在网页页面中应用<,>,空格等。

&lt;&gt;&nbsp;

嵌入元素

1. 嵌入图象
- img标识嵌入图象
- src特性:表明图象的相对路径
- alt特性:表明图象若显示信息不出来显示信息的內容
- width/height特性:设定图象的宽和高

2. 嵌入1张网页页面
- iframe标识表明嵌入1张网页页面
- src特性:表明超连接文本文档的详细地址
- width/height:该地区的宽和高
- name:给iframe取名,便捷之后a标识的target特性启用&lt;a href="shiti_test.html" target="iframe"&gt;进到实体线网页页面&lt;/a&gt;

3. 视頻/声频 video/audio
- scr:相对路径
- autoplay:全自动播发视頻
- controls:显示信息播发控制
- loop:循环系统播发
- width/height

4. 进度条
- progress标识
- max特性:要求每日任务1共必须是多少工作中 100%
- value特性:要求早已进行了是多少每日任务 80%排序元素

1. p 段落标识,在刚开始和完毕的部位上都会留下1段空行
- 特性:align,对齐方法

2. hr 切分线
- 特性:width宽度 100px或30%
- align:对齐方法
- size:粗细
- color:色调

3. 井然有序目录ol  li
- type:目录前的序标号
- start:从第几个刚开始

4. 无编码序列表ul li

5. 自定目录
- dl:表明自定目录
- dd:表明自定目录项
- dt:表明自定目录题目

6. 地区
- div:申明1块地区
- span:申明1块地区 1般用于客户名登陆密码以后的提醒,比如:该客户名已被申请注册。
- div与span的差别:div1长列,全自动换行,span1短列,不换行。

7. 照片地区
- figure照片地区,里面套img标识和figcaption和a标识等
- figcaption:表明对照片的叙述<a href="http://item.jd.com/2600210.html" target="_blank"><figcaption><font size="2" color="red">华为P9:3999带回家了</font></figcaption></a>8. pre:文件格式化1段文本或加上编码报表元素(关键)
- 功效:文件格式化数据信息

- table 申明1个报表特性:
1.border 边框 border=1
2.width 宽度
3.cellpadding 文本与内边框的间距 cellpadding=10
4.cellspacing 模块格间隔 cellspacing=0

•tr 行
1.align:对齐方法

•td 列
1.width/height
2.colspan 合拼列
3.rowspan 合拼行

•th 表头,会加粗,而且会垂直居中

•caption 报表的题目

•给报表区划地区(不常见)

1.thead、tbody、tfoot

词义元素(很少用)

•h1~h6:表明题目
•header:表明头顶部
•nav:表明导航栏
•footer:表明尾部
•address:表明文本文档或article的联络信息内容
•aside:表明侧面栏
•section:表明主题地区
•article:表明1段单独的內容

XML/HTML Code拷贝內容到剪贴板
  1. <article>  
  2.         <h3>Internet Explorer 9</h3>  
  3.         <p>Windows Internet Explorer 9(简称 IE9)于 2011 年 3 月 14 日公布.....</p>  
  4. </article>  
  5.   
  6.     <!--header的应用方式-->  
  7.     <header>  
  8.         <h3>Welcome to my home page</h3>  
  9.         <p>My name is Luogg</p>  
  10.     </header>  
  11.   
  12.    <!--section的应用方式-->  
  13.     <font color="blue" size="4">3.<section>的界定</font><br/>  
  14.     <section> 标识界定文本文档中的节(section、区间)。例如章节、页眉、页脚或文本文档中的别的一部分。<br/><br/>  
  15.   
  16.     <!--footer的应用方式-->  
  17.     <font color="blue" size="4">4.<footer>的应用方式:</font>  
  18.     <footer>  
  19.         <p>作者 : Luogg</p>  
  20.         <p>联络我 : <a href="http://www.cnblogs.com/luogg">luogg.blog.com</a></p>  
  21.     </footer>  
  22.   
  23.     <!--新特点之nav导航栏标识的应用-->  
  24.     <nav>  
  25.         <a href="../right.html">返回首页</a>  
  26.     </nav>  

架构(便是在1个网页页面中展现好几个网页页面),架构标识不可以写在body标识之中或下面。要不然访问器没法分析。

•frameset:架构构造
•ros:将网页页面分成n行
•cols:将网页页面分成n列
•frame:放在架构中的每一个html文本文档

XML/HTML Code拷贝內容到剪贴板
  1. <frameset rows="20%,*">  
  2.        <frame src="top.html">  
  3.        <frameset cols="15%,*">  
  4.            <frame src="left.html">  
  5.            <frame src="right.html" name="right">  
  6.        </frameset>  
  7. </frameset>  

表模块素(关键)

•功效:能够和服务器开展互动

中的特性:

1.action:界定1个URL,当点一下递交按钮时,向这个URL推送数据信息
2.method(get/post):用于向action URL推送数据信息的HTTP方式。默认设置是get。

get和post差别:

1)get方法表单封裝的数据信息立即显示信息在url上。post方法数据信息无法显示在url上。
2)get方法安全性级別较低,post级別较高。
3)get方法数据信息的长度,post适用绝大多数据。•input 标识:界定键入字段,客户可在这其中键入数据信息。

input 中 type特性:

1)type=text 文字框
2)type=password 登陆密码
3)type=radio 单选按钮 name特性
4)type=checkbox 多选按钮   

单选和多选都有默认设置值:checked="checked"

5)type=reset  重设按钮
6)type=submit 递交按钮
7)type=file  提交文档的键入项
8)type=button 按钮
9)type=image 照片(也是递交按钮,)
10)type=hidden 掩藏标识(客户无需看到的,可是我们开发设计时务必要应用的,能够把数据信息封裝到掩藏标识中,和表单1起递交到后台管理)

挑选标识

select /select>挑选往下拉框 option 表明內容 /option

文字域textarea
 textarea 文字內容 /textareavalue特性:
针对按钮、重设按钮和确定按钮:界定按钮上的文字。

针对图象按钮:界定传送向某个脚本制作的此域的标记結果。

针对复选框和单选按钮:界定 input 元素被点一下时的結果。

针对掩藏域、登陆密码域和文字域:界定元素的默认设置值。

注解:不可以与 type="file" 1同应用。

注解:与 type="checkbox" 和 type="radio" 1同应用时,此元素是必须的。•name特性:为 input 元素界定唯1的名字。

以上这篇HTML5学习培训心得总结(强烈推荐)便是网编共享给大伙儿的所有內容了,期待能给大伙儿1个参照,也期待大伙儿多多适用脚本制作之家。

原文详细地址:http://www.cnblogs.com/luogg/p/5649398.html



在线客服

关闭

客户服务热线
4008-888-888


点击这里给我发消息 在线客服

点击这里给我发消息 在线客服