HTML世界之标签Ⅴ

目录

一、meter 标签

二、nav 标签

三、noscript 标签

四、object 标签

五、ol 标签

六、optgroup 标签

七、option 标签

八、output 标签

九、param 标签

十、pre 标签

十一、picture 标签


一、meter 标签

<meter> 标签定义度量衡。仅用于已知最大和最小值的度量。

比如:磁盘使用情况,查询结果的相关性等。

属性

描述

form

form_id

规定 <meter> 元素所属的一个或多个表单。

high

number

规定被界定为高的值的范围。

low

number

规定被界定为低的值的范围。

max

number

规定范围的最大值。

min

number

规定范围的最小值。

optimum

number

规定度量的最优值。

value

number

必需。规定度量的当前值。

写法:

<meter value="2" min="0" max="10">2 out of 10</meter>

二、nav 标签

<nav> 标签定义导航链接的部分。

并不是所有的 HTML 文档都要使用到 <nav> 元素。<nav> 元素只是作为标注一个导航链接的区域。在不同设备上(手机或者PC)可以制定导航链接是否显示,以适应不同屏幕的需求。

写法:

<nav>

<a href="/html/">HTML</a> |

<a href="/css/">CSS</a>

</nav>

三、noscript 标签

noscript 元素用来定义在脚本未被执行时的替代内容(文本)。

此标签可被用于可识别 <noscript> 标签但无法支持其中的脚本的浏览器。

写法:

<script>

document.write("Hello World!")

</script>

<noscript>抱歉,你的浏览器不支持 JavaScript!</noscript>

四、object 标签

定义一个嵌入的对象。请使用此元素向您的 XHTML 页面添加多媒体。此元素允许您规定插入 HTML 文档中的对象的数据和参数,以及可用来显示和操作数据的代码。

<object> 标签用于包含对象,比如图像、音频、视频、Java applets、ActiveX、PDF 以及 Flash。

object 的初衷是取代 img 和 applet 元素。不过由于漏洞以及缺乏浏览器支持,这一点并未实现。

浏览器的对象支持有赖于对象类型。不幸的是,主流浏览器都使用不同的代码来加载相同的对象类型。

而幸运的是,object 对象提供了解决方案。如果未显示 object 元素,就会执行位于 <object> 和 </object> 之间的代码。通过这种方式,我们能够嵌套多个 object 元素(每个对应一个浏览器)。

属性

描述

data

URL

规定对象使用的资源的 URL。

form

form_id

规定对象所属的一个或多个表单。

height

pixels

规定对象的高度。

name

name

为对象规定名称。

type

MIME_type

规定 data 属性中规定的数据的 MIME 类型。

usemap

#mapname

规定与对象一同使用的客户端图像映射的名称。

width

pixels

规定对象的宽度。

写法:

<object width="400" height="400" data="helloworld.swf"></object>

五、ol 标签

<ol> 标签定义了一个有序列表. 列表排序以数字来显示。

属性

描述

reversed

reversed

指定列表倒序(9,8,7...)

start

number

一个整数值属性,指定了列表编号的起始值。

type

a 表示小写英文字母编号

A 表示大写英文字母编号

i 表示小写罗马数字编号

I 表示大写罗马数字编号

1 表示数字编号(默认)

规定列表的类型。

写法:

<ol></ol>

六、optgroup 标签

<optgroup> 标签经常用于把相关的选项组合在一起。

如果你有很多的选项组合, 你可以使用<optgroup> 标签能够很简单的将相关选项组合在一起。

属性

描述

disabled

disabled

规定禁用该选项组。

label

text

为选项组规定描述。

写法:

<optgroup></optgroup>

七、option 标签

<option> 标签定义下拉列表中的一个选项(一个条目)。

<option> 标签中的内容作为 <select> 或者<datalist> 一个元素使用。

属性

描述

disabled

disabled

规定此选项应在首次加载时被禁用。

label

text

定义当使用 <optgroup> 时所使用的标注。

selected

selected

规定选项(在首次显示在列表中时)表现为选中状态。

value

text

定义送往服务器的选项值。

写法:

<option> </option>

八、output 标签

<output> 标签作为计算结果输出显示(比如执行脚本的输出)。

属性

描述

for

element_id

描述计算中使用的元素与计算结果之间的关系。

form

form_id

定义输入字段所属的一个或多个表单。

name

name

定义对象的唯一名称(表单提交时使用)。

写法:

<output></output>

九、param 标签

<param>元素允许您为插入 XHTML 文档的对象规定 run-time 设置,也就是说,此标签可为包含它的 <object> 或者 <applet> 标签提供参数。

属性

描述

name

name

定义参数的名称(用在脚本中)。

value

value

描述参数值。

写法:

<param name="autoplay" value="true">

十、pre 标签

<pre> 标签可定义预格式化的文本。

被包围在 <pre> 标签 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。

写法:

<pre></pre>

十一、picture 标签

picture 元素允许我们在不同的设备上显示不同的图片,一般用于响应式。

HTML5 引入了 <picture> 元素,该元素可以让图片资源的调整更加灵活。

<picture> 元素零或多个 <source> 元素和一个 <img> 元素,每个 <source> 元素匹配不同的设备并引用不同的图像源,如果没有匹配的,就选择 <img> 元素的 src 属性中的 url。

注意:<img> 元素是放在最后一个 <picture> 元素之后,如果浏览器不支持该属性则显示 <img> 元素的的图片。

写法:

<picture></picture>

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

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

相关文章

Windows下hydra(海德拉/九头蛇)暴力猜解RDP的简单渗透实践

attscker machine&#xff1a;windows10 靶机&#xff1a;windoes server 2003 环境&#xff1a;网络可达 && mstsc开启 hydra字典&#xff1a; 123456 123admin admin123 123Com&#xff08;正确密码&#xff09; 进入hydra目录&#xff0c;字典与hydar.exe同一目录…

MySQL分组查询与子查询 + MySQL表的联结操作

目录 1 MySQL分组查询与子查询 1.1 数据分组查询 1.2 过滤分组 1.3 分组结果排序 1.4 select语句中子句的执行顺序 1.5 子查询 2 MySQL表的联结操作 2.1 关系表 2.2 表联结 2.3 笛卡尔积 2.4 内部联结 2.5 外联结 2.6 自联结 2.7 组合查询 1 MySQL分组查询与子查询…

Python 解析json文件 使用Plotly绘制地理散点图

目录 0、任务说明 1、解析json文件 2、使用Plotly绘制地理散点图 2.1 函数scatter_geo介绍 2.2 官方示例 3、根据json文件数据&#xff0c;准备绘制地理散点图的‘数据结构’ 4、完整代码及运行效果 0、任务说明 json文件中存放了关于地震的地理信息。 使用plotly模块…

Java柠檬班Java全栈自动化课程

Java柠檬班Java全栈自动化课程旨在教授学员Java编程技能与全栈开发知识&#xff0c;包括自动化测试、前端开发和后端开发。学员将学习如何构建完整的应用程序&#xff0c;并掌握自动化测试框架&#xff0c;为职业发展打下坚实基础。 课程大小&#xff1a;14G 课程下载&#x…

关闭蓝牙hci日志

echo off ::1.获取最开始的文件夹路径 set "Start_BT%~dp0" for /f %%A in (powershell -Command "Get-Date -Format yyyy_MMdd_HHmmss") do set "timestamp%%A" echo Timestamp: %timestamp% title Set_Debug_Set_HCI_LOG%timestamp% ::打开工程…

使用verilog设计实现16位CPU及仿真

这是一个简单的16位CPU(中央处理单元)的设计实验。这个CPU包括指令存储器、数据存储器、ALU(算术逻辑单元)、寄存器文件和控制单元。 设计一个简单的16位CPU的实验通常可以分为以下几个步骤: 指令集设计:首先确定CPU支持的指令集架构,包括指令格式、寄存器组织、地址模…

流畅的 Python 第二版(GPT 重译)(四)

第二部分&#xff1a;函数作为对象 第七章&#xff1a;函数作为一等对象 我从未认为 Python 受到函数式语言的重大影响&#xff0c;无论人们说什么或想什么。我更熟悉命令式语言&#xff0c;如 C 和 Algol 68&#xff0c;尽管我将函数作为一等对象&#xff0c;但我并不认为 Py…

C++11 新特性:常量表达式 constexpr(下)

接上篇文章&#xff0c;继续说说常量表达式 constexpr 在模板编程中的使用场景。 constexpr 用于模板编程 在模板编程中&#xff0c;constexpr 的应用非常广泛&#xff0c;主要是因为它能够在编译时进行计算&#xff0c;这对于模板元编程、编译时断言、模板特化选择等场合尤为…

爬虫基础:Web网页基础

爬虫基础&#xff1a;Web网页基础 前言Web网页基础网页的组成网页的结构节点树及节点间的关系选择器 前言 用浏览器访问不同的网站时&#xff0c;呈现的页面各不相同&#xff0c;你有没有想过为何会这样呢&#xff1f;了解一下网页的组成、结构和节点等内容。了解这些内容有助于…

挖掘网络宝藏:利用Scala和Fetch库下载Facebook网页内容

介绍 在数据驱动的世界里&#xff0c;网络爬虫技术是获取和分析网络信息的重要工具。本文将探讨如何使用Scala语言和Fetch库来下载Facebook网页内容。我们还将讨论如何通过代理IP技术绕过网络限制&#xff0c;以爬虫代理服务为例。 技术分析 Scala是一种多范式编程语言&…

设计模式学习笔记 - 设计模式与范式 - 创建型:2.单例模式(中):为什么不推荐使用单例模式?又有何替代方案?

前言 尽管单例是一个很常用的实际模式&#xff0c;在实际的开发中&#xff0c;也经常使用&#xff0c;但是&#xff0c;有些人认为单例是一种反模式&#xff08;anti-pattern&#xff09;&#xff0c;并不推荐使用。所以&#xff0c;今天就针对这个说法详细地讲讲。 单例模式…

软考 系统架构设计师系列知识点之系统性能(3)

接前一篇文章&#xff1a;软考 系统架构设计师系列知识点之系统性能&#xff08;2&#xff09; 所属章节&#xff1a; 第2章. 计算机系统基础知识 第9节. 系统性能 系统性能是一个系统提供给用户的所有性能指标的集合。它既包括硬件性能&#xff08;如处理器主频、存储器容量、…

用pdf2docx将PDF转换成word文档

pdf2docx是一个Python模块&#xff0c;可以将PDF文件转换为docx格式的Word文档。 pdf2docx模块基于Python的pdfminer和python-docx库开发&#xff0c;可以在Windows、Linux和Mac系统上运行。它可以从PDF文件中提取文本和图片&#xff0c;并将其转换成可编辑的Word文档&#xf…

ZC3201 耐压40V输出12V 300mA LDO

概述 ZC3201是一款40V高精度微安级功率LDO稳压器。只有luA的功耗使其适用于大多数高压节电系 统。其最大工作电压高达40V. 其他功能包括低压差&#xff0c;1%的极高输出精度&#xff0c;限流保护和高纹波抑制比。 ZC3201采用SOT89-3&#xff0c;SOT23…

分布式游戏服务器

1、概念介绍 分布式游戏服务器是一种专门为在线游戏设计的大型系统架构。这种架构通过将游戏服务器分散部署到多台计算机&#xff08;节点&#xff09;上&#xff0c;实现了数据的分散存储和计算任务的并行处理。每个节点都负责处理一部分游戏逻辑和玩家请求&#xff0c;通过高…

DM-达梦数据库实时主备搭建

dm实时主备说明 将主库产生的 Redo日志传输到备库&#xff0c;备库接收并重演Redo日志&#xff0c;从而实现备库与主库的数据同步。 一、环境准备 1.1、配置环境准备 首先搭建实时主备&#xff0c;要规划好机器的&#xff0c;我准备两台机器服务器 主服务器 mast…

监控系统prometheus+grafana+发送告警信息

1、基础环境准备两台或更多的主机 2、关闭selinux vi /etc/selinux/config&#xff0c;修改SELINUX的值为disabled 3、关闭防火墙 systemctl disable firewalld systemctl stop firewalld 4、prometheus官网下载 https://prometheus.io/download/ 5、grafana官网下载 https…

Cronos zkEVM 基于 Covalent Network(CQT)数据可用性 API,推动其 Layer2 DeFi 生态更好地发展

在一项旨在显著改善 DeFi 生态的战略举措中&#xff0c;Cronos 与 Covalent Network&#xff08;CQT&#xff09;携手合作&#xff0c;以期待 Cronos zkEVM 的推出。这一整合&#xff0c;预计将进一步降低以太坊生态系统的交易成本、提升交易速度&#xff0c;并带来更好的交易体…

开源IT自动化运维工具Ansible Playbook介绍

Ansible Playbook 是一种基于 YAML 格式的配置、编排与自动化工具&#xff0c;用于定义和执行IT基础设施的配置管理和应用程序部署任务。它允许您以声明式的方式编写任务集&#xff0c;这些任务集可以在一组或多组主机上按顺序执行&#xff0c;以实现自动化的配置管理、应用部署…

【Qt】使用Qt实现Web服务器(三):QtWebApp中HttpRequest和HttpResponse

1、HttpRequest 1.1 示例 1)在Demo1的Dump HTTP request示例 在浏览器中输入http://127.0.0.1:8080点击Dump HTTP request 2)切换到页面:http://127.0.0.1:8080/dump 该页面显示请求和响应的内容: Request: Method: GET Path: /dump Version: HTTP/1.1 Headers: accep…