web前端基础知识——HTML/HTML5

目录

一,HTML

1.HTML简介

2.HTML标签 

基本文档

基本标签

 文本格式化

链接

图像

区块

列表 

表格

 框架

表单

实体

二,HTML5

新增元素

详细内容:


HTML

HTML简介

HTML 是用来描述网页的一种语言。

  • HTML 指的是超文本标记语言: HyperText Markup Language
  • HTML 不是一种编程语言,而是一种标记语言
  • 标记语言是一套标记标签 (markup tag)
  • HTML 使用标记标签来描述网页
  • HTML 文档包含了HTML 标签文本内容
  • HTML文档也叫做 web 页面

HTML标签 

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

  • HTML 标签是由尖括号包围的关键词,比如
  • HTML 标签通常是成对出现的,比如
  • 标签对中的第一个标签是开始标签,第二个标签是结束标签
  • 开始和结束标签也被称为开放标签闭合标签

基本文档

web前端基础知识——HTML/HTML5_第1张图片

 注:输入!可以快速生成

web前端基础知识——HTML/HTML5_第2张图片

 lang后面的是网页显示语言

charset后的是“万国码”

基本标签

web前端基础知识——HTML/HTML5_第3张图片

 文本格式化

web前端基础知识——HTML/HTML5_第4张图片

链接

web前端基础知识——HTML/HTML5_第5张图片

若跳转页面时不覆盖当前页面 则在

锚点链接:点击链接时,快速定位到链接的位置

 

图像

 src后面跟着图片存在的路径,可为硬盘位置,也可为网址链接。alt 是当图片显示不出来的时候,文本代替图片显示。

路径分为相对路径和绝对路径

相对路径:web前端基础知识——HTML/HTML5_第6张图片

绝对路径:

 图像和文字的位置:

web前端基础知识——HTML/HTML5_第7张图片

 

 

区块

web前端基础知识——HTML/HTML5_第8张图片

 div和span的区别:

web前端基础知识——HTML/HTML5_第9张图片

 

列表 

无序列表

web前端基础知识——HTML/HTML5_第10张图片

 

有序列表

web前端基础知识——HTML/HTML5_第11张图片

 

自定义列表

web前端基础知识——HTML/HTML5_第12张图片

 

表格

web前端基础知识——HTML/HTML5_第13张图片

 定义行

定义列

定义表头

跨行或跨列的单元格

web前端基础知识——HTML/HTML5_第14张图片web前端基础知识——HTML/HTML5_第15张图片

web前端基础知识——HTML/HTML5_第16张图片web前端基础知识——HTML/HTML5_第17张图片

 框架

 

表单

web前端基础知识——HTML/HTML5_第18张图片

 

web前端基础知识——HTML/HTML5_第19张图片

web前端基础知识——HTML/HTML5_第20张图片

 

注:maxlength为限制文字数目,checked为默认选择,value为默认内容

下拉列表:

web前端基础知识——HTML/HTML5_第21张图片web前端基础知识——HTML/HTML5_第22张图片

预选:

实体

HTML5

新增元素

新元素
标签    描述
    标签定义图形,比如图表和其他图像。该标签基于 JavaScript 的绘图 API

新多媒体元素
标签    描述

新表单元素
标签    描述
    定义选项列表。请与 input 元素配合使用该元素,来定义 input 可能的值。
    规定用于表单的密钥对生成器字段。
    定义不同类型的输出,比如脚本的输出。

新的语义和结构元素
HTML5提供了新的元素来创建更好的页面结构:

标签    描述

    定义页面独立的内容区域。

你可能感兴趣的:(html5,前端,html)