当前位置: 首页 > news >正文

HTML、HTML5一览

文章目录

  • HTML
    • 简介
    • 标签
      • 基本标签
      • 格式化文本
      • 链接
      • 图像
      • 块级元素
      • 列表
      • 表格
      • 框架
      • 表单
      • 实体
  • HTML5

此篇用于优化csdn第一篇文章

在这里插入图片描述

HTML

简介

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

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

标签

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

  • HTML 标签是由尖括号包围的关键词,比如
  • HTML 标签通常是成对出现的,比如
  • 标签对中的第一个标签是开始标签,第二个标签是结束标签
  • 开始和结束标签也被称为开放标签和闭合标签
    基本格式快速生成:快捷点 !+ 回车
    ​​
    ​​在这里插入图片描述
    在这里插入图片描述
    lang后面的是网页显示语言
    charset后的是“万国码”,详解万国码

基本标签

在这里插入图片描述

格式化文本

在这里插入图片描述

链接

在这里插入图片描述
若跳转页面时不覆盖当前页面 则在<a 内定义target=“_blank"

锚点链接:点击链接时,快速定位到链接的位置
在这里插入图片描述

图像

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

路径分为相对路径和绝对路径
相对路径
在这里插入图片描述

​​绝对路径
在这里插入图片描述

块级元素

在这里插入图片描述

div和span的区别

列表

无序列表
在这里插入图片描述
有序列表
在这里插入图片描述
自定义列表

在这里插入图片描述

表格

结构
在这里插入图片描述

定义行 定义列 定义表头

​跨行或跨列的单元格
在这里插入图片描述
在这里插入图片描述

框架

在这里插入图片描述

表单

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
注:maxlength为限制文字数目,checked为默认选择,value为默认内容
下拉列表:
在这里插入图片描述
设置预选
在这里插入图片描述

实体

在这里插入图片描述

HTML5

html5主要新增的一些标签元素
例如:

  • <canvas>标签定义图形,比如图表和其他图像。该标签基于 JavaScript 的绘图 API

新多媒体元素

<audio>    定义音频内容
<video>    定义视频(video 或者 movie)
<source>    定义多媒体资源 <video><audio>
<embed>    定义嵌入的内容,比如插件。
<track>    为诸如 <video><audio> 元素之类的媒介规定外部文本轨道。

新表单元素

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

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

<article>    定义页面独立的内容区域。
<aside>    定义页面的侧边栏内容。
<bdi>    允许您设置一段文本,使其脱离其父元素的文本方向设置。
<command>    定义命令按钮,比如单选按钮、复选框或按钮
<details>    用于描述文档或文档某个部分的细节
<dialog>    定义对话框,比如提示框
<summary>    标签包含 details 元素的标题
<figure>    规定独立的流内容(图像、图表、照片、代码等等)。
<figcaption>    定义 <figure> 元素的标题
<footer>    定义 section 或 document 的页脚。
<header>    定义了文档的头部区域
<mark>    定义带有记号的文本。
<meter>    定义度量衡。仅用于已知最大和最小值的度量。
<nav>    定义导航链接的部分。
<progress>    定义任何类型的任务的进度。
<ruby>    定义 ruby 注释(中文注音或字符)。
<rt>    定义字符(中文注音或字符)的解释或发音。
<rp>    在 ruby 注释中使用,定义不支持 ruby 元素的浏览器所显示的内容。
<section>    定义文档中的节(section、区段)。
<time>    定义日期或时间。
<wbr>    规定在文本中的何处适合添加换行符。

详细内容:

  • canvas : HTML5 元素用于图形的绘制,通过脚本 (通常是JavaScript)来完成.
    标签只是图形容器,您必须使用脚本来绘制图形。
    你可以通过多种方法使用 canvas 绘制路径,盒、圆、字符以及添加图像。

  • video:在这里插入图片描述

  • audio:


  • input新增type

color
date
datetime
datetime-local
email
month
number
range(滑块设置)
search
tel
time
url
week

相关文章:

  • [线程与网络] 网络编程与通信原理(四):深入理解传输层UDP与TCP协议
  • AR和AP重分类(Regroup)[FAGLF101/OBBU/OBBV]
  • LocalViT 论文解读
  • 前端传String字符串 后端使用enun枚举类出现错误
  • 嵌入式移植jpeglib--Linux交叉编译ARM平台
  • 创建线程的技术难点
  • VOC格式标签各个字段的解释
  • 对 SQL 说“不”~
  • 随便用css换个渐变的太阳
  • OrangePi AIpro 变身 Android 打包机
  • github使用相关问题
  • Oracle数据库面试题-3
  • 宇泰485中继器光电隔离防雷 工业级RS485信号放大器 UT-2209正品
  • 学习DHCP动态主机配置协议
  • 赶紧收藏!2024 年最常见 20道 Kafka面试题(五)
  • [rust! #004] [译] Rust 的内置 Traits, 使用场景, 方式, 和原因
  • 2017 年终总结 —— 在路上
  • 2017 前端面试准备 - 收藏集 - 掘金
  • 2018天猫双11|这就是阿里云!不止有新技术,更有温暖的社会力量
  • JavaScript 基本功--面试宝典
  • JSONP原理
  • JS创建对象模式及其对象原型链探究(一):Object模式
  • PAT A1120
  • SpingCloudBus整合RabbitMQ
  • SwizzleMethod 黑魔法
  • vuex 学习笔记 01
  • webpack4 一点通
  • 彻底搞懂浏览器Event-loop
  • 构建工具 - 收藏集 - 掘金
  • 简单实现一个textarea自适应高度
  • 前端学习笔记之观察者模式
  • 我与Jetbrains的这些年
  • 一个完整Java Web项目背后的密码
  • Android开发者必备:推荐一款助力开发的开源APP
  • NLPIR智能语义技术让大数据挖掘更简单
  • # 职场生活之道:善于团结
  • (003)SlickEdit Unity的补全
  • (1)(1.8) MSP(MultiWii 串行协议)(4.1 版)
  • (day6) 319. 灯泡开关
  • (Matalb分类预测)GA-BP遗传算法优化BP神经网络的多维分类预测
  • (附源码)php投票系统 毕业设计 121500
  • (规划)24届春招和25届暑假实习路线准备规划
  • (转)机器学习的数学基础(1)--Dirichlet分布
  • .NET Core IdentityServer4实战-开篇介绍与规划
  • .NET Core、DNX、DNU、DNVM、MVC6学习资料
  • .NET Micro Framework初体验
  • .NET 服务 ServiceController
  • .NET 跨平台图形库 SkiaSharp 基础应用
  • .skip() 和 .only() 的使用
  • //解决validator验证插件多个name相同只验证第一的问题
  • /dev/VolGroup00/LogVol00:unexpected inconsistency;run fsck manually
  • @Bean, @Component, @Configuration简析
  • @cacheable 是否缓存成功_让我们来学习学习SpringCache分布式缓存,为什么用?
  • @JsonFormat 和 @DateTimeFormat 的区别
  • [100天算法】-目标和(day 79)