【前端笔记】☞ HTML

1. 什么是HTML5

   网页的伍.0本子。201四年才定制完HTML5的正规化,历时8年

2. 为啥要用HTML5

  一> 跨平台:利用HTML5编纂的UI界面能运营在装有具有浏览器的平台

  二> HTML伍的运营平台:浏览器

  叁> 可是HTML5不能够形成部分一定的意义,比如:拍照(ImagePickerController)、访问相册….

三. 什么样利用HTML5

  1> 本身编写多量的HTML5代码

  二> 使用现成的HTML5框架

    sencha-touch

    phoneGap

    jQuery mobile

    bootstrap

4. 手提式有线电话机APP的开发情势

  1> 原生(纯OC)

  2> 纯HTML5

  3> 原生+HTML5

五. 怎么要上学HTML伍

  壹> 现在的1种倾向

  二> 扩充面试、开发竞争力

    Android程序员  Java、服务器、HTML5

陆. 集团职位的分开

  一> 平面设计师 
作图、切图、HTML、CSS

  二> 前端工程师  HTML、CSS、Javascript、模板技术

  叁> 后台工程师 
服务器(Java、.Net、PHP)、数据库

  4> 移动工程师(iOS/android)手提式有线话机UI界面(OC、HTML五)、跟服务器交互

柒. Web开发新时代

  Web1.0

    主流技术:HTML+CSS

  Web2.0

    主流技术:Ajax(JavaScript/DOM/异步数据请求)

  Web3.0

    主流技术:HTML伍+CSS3

  HTML伍亮点:Canvas、HTML五音录制、Web存款和储蓄、吉优location、Workers十二线程处理

  CSS三亮点:设计动画、2D变形、N多新特色

捌. 网页的重组

  一个有切实际效果果的总体的网页,壹般由三局地构成

  一》HTML:网页的具体内容和协会

  2》CSS:网页的体裁(美化网页最根本的1块)

  叁》JavaScript(理解):网页的并行功效,比如对用户鼠标事件做出响应

    HTML \ CSS \ JavaScript 学习资料:http://www.w3school.com.cn/

9. HTML

  什么是HTML:HTML的完备是HyperText 马克up Language,超文本标记语言

  其实它便是文本,由浏览器负责将它解析成现实的网页内容。

10. HTML的组成

  跟XML类似,HTML由N个标签(节点、元素、标记)组成

  HTML语法分外松懈,近来的流行版是伍.0,也正是HTML 5

11. 常见的HTML标签

  • 标题:h1、h2、h3、h4、h5….
  • 段落:p
  • 换行:br
  • 容器:div、span(用来包容其余标签)
  • 表格:table、tr、td
  • 列表:ul、ol、li
  • 图片:img
  • 表单:input
  • 链接:a

12. HTML5新增标签

  HTML伍猛增了2多少个标签成分,扬弃了1四个标签成分,主要不外乎:结构性标签、级块性标签、行内语义性标签、交互性标签

  1》结构性标签

    负责Web上下文结构的定义,确定保障HTML文档,蕴含:

    article 
小说主体内容(一篇博客、1篇论坛帖子、1段用户评价、插件)

    header   标记底部区域内容(小说的底部)

    footer  
标记脚部区域内容(小说的最底层)

    section  区域章节表述
(小说的区域章节)

    nav      菜单导航,链接导航

  二》块级性标签(分块用的)

    完毕Web页面区域的细分,确定保障内容的实用分隔,蕴含:

    aside   注记,贴士,侧栏,摘要,插入的引用作为补充主体的始末

    figure 
对三个要素结合并体现的成分,常与figcaption联合利用

    code   
表示1段代码块

    dialog 
人与人中间对话,包括dt和dd五个组成成分(dt用于表示说话者、dd用于表示说话者的内容)

  三》行内语义性标签

    完结Web页面具体内容的引用和表述,丰裕显示内容,包罗:

    meter     特定范围内的数值,如薪资、数量、百分比

    time     
时间值

    progress 
进程条,可用max、min、step进行支配,完结对速度的象征和监听  

    video    
录像元素,用于录制播放,扶助缓冲预载和多种录制媒体格式

      <!–录制播放–>

      //  告诉浏览器,笔者要选拔你的播放器 controls

      <video src=”source/BigBuck.m4v”
controls=”controls”></video>

    audio    
音频成分,用于音频播放,协助缓冲预载和四种节奏媒体格式

      <!–音频播放–>

       //  告诉浏览器,小编要动用你的播放器 controls

      <audio src=”source/music.m4a”
controls=”controls”></audio>

  肆》交互性标签

    功用性内容的发布,有肯定的内容和数码的涉嫌,是各样风云的底子,包含:

    details   表示1段具体的情节,默许不出示,通过某种方式(单击)与legend交互才会显得

    datagrid 
控制客户端数据与展现,可用于动态脚本及时更新

    menu     
用于互动菜单

    command  
用来拍卖命令按钮

13. HTML标签类型

  • HTML有N多标签,依照显示的品种,首要可以分为三大类

  壹》块级标签

    独占1行的价签

    能每二十二1十八日设置宽度和中度(比如:div、p、h壹、h2、ul、li)

  贰》行内标签(内联标签)

    四个行内标签能同时呈现在一行

    宽度和中度取决于内容的尺寸(比如:span、a、label)

  叁》行内-块级标签(内联-块级标签)

    多个行内-块级标签能够来得在同1行

    能时时设置宽度和惊人(比如:input、button)

 

  div与span标签的界别:

    div标签是块级标签,独占壹行,能够安装宽度和冲天。

    span标签是行内标签:八个行内标签能够而且展现在一行,宽度和冲天取决于内容的轻重。

1四. 改动标签的来得档次

  CSS中有个display属性,能修改标签的呈现档次

  1》none:隐藏标签

    div {

         color: red;

         <!–隐藏标签(包罗标签的构造和剧情)–>

         display: none;

    }

  ②》block:让标签变为块级标签

    span {

         background-color:
yellow;

         /* 把当前标签变为块级标签(就足以占据壹行和设置标签的宽高)*/

         display: block;

    }

  三》inline:让标签变为行内标签

    div {

         background-color:
red;

         /* 把当前标签变为行内标签 */

         display: inline;

    }

  四》inline-block:让标签变为行内-块级标签(内联-块级标签)

    div {

         background-color:
red;

         /*把当下标签变为行内块级标签*/

         display: inline-block;

    }

相关文章