HTML5学习笔记

HTML是一种描述网页的超文本标记(不是编程)语言。

学习流程建议:

  • HTML
  • XHTML
  • Css
  • Css3
  • JavaScript
  • JQuery
  • HTML5

HTML5新特性

  • 用于绘画的canvas标签;
  • 用于媒介回放的video和audio元素;
  • 对本地离线存储的更好支持;
  • 新的特殊内容元素:article、footer、header、nav、section等;
  • 新的表单控件: calendar、date、time、email、url、search等;
  • 浏览器支持:Safari、Chrome、Firefox、IE。

HTML5语法

>声明

>基础标签

head、body:这两个标签都被定义在 中

>标题

h1...h6:标记内容的大小和粗细

>段落

p:定义段落,定义一段话,不在p标签内的文字都会另起一行显示

>超链接

a:定义超链接

>图像

img:定义图像

>换行

br


 
     
         
        HTML基础标签
    
    
        

h1标题

h2标题

h3标题

h4标题

h5标题
h6标题

你好,中国

搜索引擎 学习HTML5
需要学习样式和JS脚本

HTML属性

  • 标签可以拥有属性为元素提供更多信息;
  • 属性以键值对出现;
>常用标签属性
>通用属性
  • class:声明元素类名
  • id:声明元素唯一ID
  • style:声明元素的样式,使用CSS
  • title:声明元素的额外信息

 
     
         
        HTML属性
    
    
        

h1标题

h2

你好,中国

搜索引擎

定义字体

  • b:定义加粗文字
  • em:定义斜体文字
  • i:定义斜体文字
  • small:定义小号字
  • strong:定义加重语气
  • sub:定义下标字
  • sup:定义上标字
  • ins:定义插入字
  • del:定义删除字

HTML样式

>标签
  • style:样式定义
  • link:资源引用
>属性
  • rel="sytlesheet":外部样式表
  • type="text/css":引入文档类型
  • margin-left、margin-right:边距
>三种样式表插入方法
  • 外部样式表
  • 内部样式表
  • 内联样式表

HTML链接

>链接数据
  • 文本链接
  • 图片链接
>属性
  • href:指向另一个文档的链接
  • name:创建文本内的链接
>img标签属性
  • alt:替换文本属性
  • waith:宽
  • height:高

HTML表格

  • table:定义表格
  • caption:定义表格标题
  • th:定义表格的表头
  • tr:定义表格的行
  • td:定义表格的单元
  • thead:定义表格的页眉
  • tbody:定义表格主体
  • tfoot:定义表格页脚
  • col:定义表格的页属性

HTML列表

  • ol:有序列表
  • ul:无序列表
  • li:列表向
  • dl:列表
  • dt:列表项
  • dd:描述

 
     
         
        HTML列表
    
    
        
  • html
  • css
  • javsscript
  1. html
  2. css
  3. javsscript
banana
it's food
cat
it's a anmianl

HTML块

  • 块元素:在显示时通常会以新的行开始,如h1、p、ul
  • 内联元素:通常不会以新行开始,如b、a、img
  • div元素:配合CSS样式使用,通常作为组合成HTML的容器
  • span:内联元素,可作为文本的容器

 
     
         
        HTML块
        
    
    
        

这是一段话

这是一个加重标签这是一个超链接标签
这是div标签中的内容

这是span标签中的内容这是span标签外的内容

HTML布局

>div布局

 
     
         
        div布局
        
    
    
        
内容菜单
内容主体
>table布局

 
     
         
        table布局
        
    
    
        
头部
左菜单 内容 右菜单
底部

HTML表单

表单用于获取不同类型的用户输入

>常用表单标签
  • form:表单
  • input:输入域
  • textarea:文本域
  • label:控制标签
  • fieldset:定义域
  • legend:域的标题
  • select:选择列表
  • optgroup:选项组
  • option:下拉列表中的选项
  • button:按钮

 
     
         
        HTML表单
        
    
    
        
用户名:
密码:
你去过那里? 台湾 新疆 香港
你是哪里人? 安徽 吉林 北京
你的性别?

你可能感兴趣的:(HTML5学习笔记)