HTML知识复习2

文章目录

  • HTML5简介
    • 什么是HTML5
    • HTML5优势
  • 新增语义化标签
    • 新增布局标签
    • 新增状态标签
    • 新增列表标签
    • 新增文本标签
  • 新增表单功能
    • 表单控件新增属性
    • input新增属性值
  • 新增多媒体标签
    • 视频标签
    • 音频标签
  • HTML5兼容性处理

HTML5简介

什么是HTML5

HTML5 是新一代的 HTML 标准,2014年10月由万维网联盟( W3C )完成标准制定。
官网W3C
HTML5 在狭义上是指新一代的 HTML 标准,在广义上是指:整个前端。

HTML5优势

针对 JavaScript ,新增了很多可操作的接口。
新增了一些语义化标签、全局属性。
新增了多媒体标签,可以很好的替代 flash 。
更加侧重语义化,对于 SEO 更友好。
可移植性好,可以大量应用在移动设备上。

新增语义化标签

新增布局标签

在这里插入图片描述
关于 article 和 section :

  • artical 里面可以有多个 section 。
  • section 强调的是分段或分块,如果你想将一块内容分成几段的时候,可使用 section元素。
  • article 比 section 更强调独立性,一块内容如果比较独立、比较完整,应该使用article 元素。

新增状态标签

meter标签
定义已知范围内的标量测量。也被称为 gauge (尺度),双标签,例如:电量、磁盘用量等。
在这里插入图片描述
progress标签
显示某个任务完成的进度的指示器,一般用于表示进度条,双标签,例如:工作完成进度等。
在这里插入图片描述

新增列表标签

在这里插入图片描述

新增文本标签

文本注音
在这里插入图片描述

<ruby><span>魑魅魍魉</span><rt>chī mèi wǎng liǎng </rt>
</ruby>

文本标记:双标签,mark

新增表单功能

表单控件新增属性

在这里插入图片描述

input新增属性值

在这里插入图片描述

新增多媒体标签

视频标签

video标签用来定义视频,它是双标签。
在这里插入图片描述

音频标签

audio标签用来定义音频,它是双标签。
在这里插入图片描述

HTML5兼容性处理

  • 添加元信息,让浏览器处于最优渲染模式。
<!--设置IE总是使用最新的文档模式进行渲染-->
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<!--优先使用 webkit ( Chromium ) 内核进行渲染, 针对360等壳浏览器-->
<meta name="renderer" content="webkit">
  • 使用 html5shiv 让低版本浏览器认识 H5 的语义化标签。
<!--[if lt ie 9]>
<script src="../sources/js/html5shiv.js"></script>
<![endif]-->
  • 扩展
    lt 小于
    lte 小于等于
    gt 大于
    gte 大于等于
    ! 逻辑非
    例如:
<!--[if IE 8]>仅IE8可见<![endif]-->
<!--[if gt IE 8]>仅IE8以上可见<![endif]—>
<!--[if lt IE 8]>仅IE8以下可见<![endif]—>
<!--[if gte IE 8]>IE8及以上可见<![endif]—>
<!--[if lte IE 8]>IE8及以下可见<![endif]—>
<!--[if !IE 8]>非IE8的IE可见<![endif]-->

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.pswp.cn/pingmian/87567.shtml
繁体地址,请注明出处:http://hk.pswp.cn/pingmian/87567.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

栈(Stack)和队列(Queue)

文章目录 前言1. 栈(Stack)1.1 什么是栈1.2 栈的常用操作1.3 栈的模拟实现1.4 栈的应用场景1.4.1 元素序列处理1.4.2 字符串反转1.4.3 括号匹配1.4.4 逆波兰表达式求值1.4.5 栈的压入、弹出序列1.4.6 最小栈1.4.7 递归转循环 1.5 概念区分1.5.1 数据结构中的栈1.5.2 JVM中的虚拟…

5G MEC四大核心挑战技术解析报告

一、MEC园区部署挑战:数据本地化与低时延接入 痛点深度解析 数据不出园区:工业质检、医疗影像等敏感业务需数据在本地闭环处理。但运营商基站与企业MEC间若经公网绕行,时延超50ms且存在泄露风险。L2网络局限:传统L2接入网无法实现基站→UPF的智能路由,导致业务流绕行城域…

【硬核拆解】英伟达Blackwell芯片架构如何重构AI算力边界?

前言 前些天发现了一个巨牛的人工智能免费学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到网站 一、Blackwell诞生的算力危机&#xff08;2025现状&#xff09; graph TD A[2025年AI算力需求] --> B[千亿参数模型训练能耗…

【深度学习模块】图像的相对位置编码

这个是一个常用的模块&#xff0c;就是我们可以对输入的特征嵌入位置编码。 位置编码&#xff08;Positional Encoding&#xff09;是一种将空间位置信息嵌入到特征中的方法&#xff0c;通常用于帮助模型更好地理解特征的空间关系。 这里介绍的这个是相对位置编码&#xff0c;…

osg加入实时光照SilverLining 天空和3D 云

OSG系列文章目录 文章目录 OSG系列文章目录一、前言官网的介绍&#xff1a; 二、编译官网例子 一、前言 osg本身也可以加入动态云&#xff0c;但是效果有点差强人意&#xff0c;这里我们使用sundog公司的动态云&#xff1a;SilverLining 天空和 3D 云。 官网的介绍&#xff1…

spring-ai-alibaba 1.0.0.2 学习(十二)——聊天记忆扩展包

学习spring-ai时提到过&#xff0c;spring-ai除了内置的InMemoryChatMemoryRepository&#xff0c;还提供jdbc、cassandra、neo4j三个扩展包。 而spring-ai-alibaba则提供了jdbc、redis、elasticsearch三个扩展包。 两者都提供了jdbc扩展包&#xff0c;有什么区别呢&#xff…

c语言-指针(数组)练习2

题目&#xff1a;将数组中n个元素按逆序存放并打印出来&#xff0c;使用函数封装与指针 思路&#xff1a; 1.定义一个数组arr[5]和用于存放数组大小&#xff08;数组大小通过sizeof关键字来进行计算&#xff09;的变量len&#xff1b; 2.创建三个函数initArr、printArr、rev…

Redis服务器

Redis&#xff0c;一款Key-Value型内存数据库 常用于网站开发场景 Redis服务器只发布了Linux版本 Redis服务器安装&#xff0c;2种办法 自动安装 apt install redis-server手动编译安装 从官网下载源码&#xff0c;编译&#xff0c;部署 1 安装redis apt install redis-s…

LeetCode 第91题:解码方法

题目描述&#xff1a; 一条包含字母A-Z的消息通过以下映射进行了编码 1-A ...... 26-Z 要特别注意&#xff0c;11106可以映射为AAJF或KJF 06不是一个合法编码 给你一个只含数字的非空字符串s&#xff0c;请计算并返回解码方法的总数。如果没有合法的方法解码整个字符串&#xf…

Rocky Linux 9 源码包安装Mysql8

Rocky Linux 9 源码包安装Mysql8 大家好我是星哥&#xff0c;之前介绍了&#xff0c;Rocky Linux 9 源码包安装Mysql5.7。 本文将介绍如何在Rocky Linux 9操作系统上&#xff0c;从源码一步步安装MySQL 8&#xff0c;为您提供一个稳定、高效且可控的数据库解决方案。 为什么…

AI小智项目全解析:软硬件架构与开发环境配置

AI小智项目全解析&#xff1a;软硬件架构与开发环境配置 一、项目整体架构 AI小智是一款基于ESP32的智能物联网设备&#xff0c;集成了语音交互、边缘计算等功能。整体系统架构如下&#xff1a; 终端设备&#xff1a;ESP32模组作为核心通信方式&#xff1a; WebSocket实现实…

设计模式之上下文对象设计模式

目录 一、模式介绍 二、架构设计 三、Demo 示例 四、总结 一、模式介绍 上下文对象&#xff08;Context Object&#xff09;模式 最早由《Core J2EE Patterns》第二版提出&#xff0c;其核心目标是在多层或多组件间共享与当前作用域&#xff08;如一次请求、一次会话、一次…

@Linux服务器加域退域

文章目录 **一、加入Active Directory域****1. 准备工作****2. 配置步骤****步骤1&#xff1a;验证网络和DNS****步骤2&#xff1a;发现域****步骤3&#xff1a;加入域****步骤4&#xff1a;配置SSSD&#xff08;可选&#xff09;****步骤5&#xff1a;配置sudo权限&#xff08…

鸿蒙系统(HarmonyOS)4.2 设备上实现无线安装 APK 并调试

在鸿蒙系统&#xff08;HarmonyOS&#xff09;4.2 设备上实现无线安装 APK 并调试的步骤与 Android 类似&#xff0c;但需注意鸿蒙系统的特殊设置。以下是详细操作指南&#xff1a; 鸿蒙系统特殊准备 开启开发者选项&#xff1a; - 设置 > 关于手机 > 连续点击"H…

MyBatis时间戳查询实战指南

在 MyBatis 中通过时间戳&#xff08;Timestamp&#xff09;作为查询条件&#xff0c;需注意数据库时间类型与 Java 类型的映射。以下是具体实现方式&#xff1a; 一、Java 实体类与数据库字段映射 实体类定义 使用 java.sql.Timestamp 或 java.time.LocalDateTime&#xff08;…

【Verilog硬件语言学习笔记4】FPGA串口通信

串口通信是系统设计中比较基部分&#xff0c;其原理其实也很通俗易懂。单次建立通信会传输8个bit&#xff0c;其时序也很简单&#xff0c;这里就不再赘述了。其对应的实例代码如下所示&#xff1b; 首先是接受部分&#xff08;因为我的变量命名也很规范&#xff0c;通俗易懂&a…

Go 语言安装教程(Windows 系统)

2025年07月02日 准备工作 确认系统为 Windows 7 及以上版本&#xff08;推荐 Windows 10/11&#xff09;。64 位系统选择 amd64 版本安装包&#xff0c;32 位系统选择 386 版本。确保安装目录&#xff08;默认 C:\Program Files\Go\&#xff09;有至少 1GB 空间。 下载安装包…

接口测试之postman

一、Postman功能简介 3天精通Postman接口测试&#xff0c;全套项目实战教程&#xff01;&#xff01; Postman是由Postdot Technologies公司打造的一款功能强大的调试HTTP接口的工具。在做接口测试的时候&#xff0c;Postman相当于一个客户端&#xff0c;它可以模拟用户发起的各…

【记录】Ubuntu安装Mysql

本文记录Ubuntu系统下安装Mysql 1 查看系统信息 lsb_release -a 2 使用apt下载安装Mysql 1 打开终端,首先更新你的系统包索引,以确保所有包都是最新的 sudo apt update 2 安装mysql服务器 sudo apt install mysql-server (也可以选择对应的mysql-server 版本) 3 查看mysql状…

【深度学习:进阶篇】--4.1.循环神经网络(改进)

RNN存在的问题&#xff1a;梯度爆炸&#xff0c;长期依赖参数量过大等问题 目录 1.GRU(门控循环单元) 1.1.什么是GRU 1.2.直观理解 1.3.本质解决问题 2.LSTM(长短记忆网络) 2.1.作用 3.结构扩展与效率优化​ 1.GRU(门控循环单元) 2014年&#xff0c;出现的算法&#x…