HTML面试题---专题四
文章目录
- 一、前言
- 二、如何在 `HTML` 中嵌入音频文件?
- 三、解释 `<script>` 标签中 `defer` 属性的用途。
- 四、如何在 `HTML` 中创建粘性/固定导航栏?
- 五、`HTML` 中的 `span` 元素的用途是什么?
- 六、如何使 `HTML` 元素可拖动?
- 七、解释 `<input>` 标签中模式属性的用途。
- 八、如何在 `HTML` 中创建进度条?
- 九、`HTML` 中 `<blockquote>` 元素的用途是什么?
- 十、如何在 `HTML` 中创建包含大写罗马数字的有序列表?
- 十一、解释 `HTML` 中 `contenteditable` 属性的用途。
- 十二、最后

一、前言
HTML
(超文本标记语言)是 Web
开发的基石,掌握 HTML
的基本概念与内容对于在技术面试中脱颖而出至关重要。
本文是 HTML
面试题的专题四。通过掌握这些问题,你将更好地准备应对具有挑战性的面试场景并展示您的专业知识。
万维网联盟 (
W3C
) 提供的官方文档:HTML
— 万维网联盟 (W3C
)(https://html.spec.whatwg.org/multipage/)
HTML
的Mozilla
开发人员网络 (MDN
) 网络文档(https://developer.mozilla.org/en-US/docs/Web/HTML)
二、如何在 HTML
中嵌入音频文件?
要嵌入音频文件,请使用 <audio>
元素并使用 src
属性指定源文件。您可以包含其他属性(例如控件)来添加播放控件。
<audio src="audio.mp3" controls />
三、解释 <script>
标签中 defer
属性的用途。
defer
属性用于指示应在解析 HTML
内容后执行脚本。它允许并行加载其他资源,有助于提高页面加载性能。
<script src="script.js" defer />
四、如何在 HTML
中创建粘性/固定导航栏?
要创建粘性/固定导航栏,请使用 CSS
将导航栏的位置设置为固定并指定顶部或底部值。
<style>.navbar {position: fixed;top: 0;width: 100%;}
</style><div class="navbar"><!-- Navigation links -->
</div>
五、HTML
中的 span
元素的用途是什么?
<span>
元素是一个内联容器,用于对较大内容块中的元素进行分组和设置样式。它本身没有语义意义,但对于样式化或定位内容的特定部分很有用。
<p>My name is <span class="highlight">John Doe</span>.</p>
六、如何使 HTML
元素可拖动?
要使 HTML
元素可拖动,请使用draggable
属性并将其设置为 true
。然后,您可以定义事件处理程序来控制拖放行为。
<div draggable="true">Drag me!</div>
七、解释 <input>
标签中模式属性的用途。
pattern
属性用于指定输入值必须匹配的正则表达式模式。它通常用于表单字段验证。
<input type="text" pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}" placeholder="XXX-XXX-XXXX" />
八、如何在 HTML
中创建进度条?
使用 <progress>
元素创建进度条,并使用 value
属性指定当前值,使用 max
属性指定最大值。
<progress value="50" max="100" />
九、HTML
中 <blockquote>
元素的用途是什么?
<blockquote>
元素用于指示引用内容的一部分,例如来自其他来源的引用。它有助于区分引用的内容和周围的文本。
<blockquote><p>This is a quoted text.</p>
</blockquote>
十、如何在 HTML
中创建包含大写罗马数字的有序列表?
使用 <ol>
元素的 type
属性并将其设置为I
以显示大写罗马数字。
<ol type="I"><li>Item 1</li><li>Item 2</li><li>Item 3</li>
</ol>
十一、解释 HTML
中 contenteditable
属性的用途。
contenteditable
属性允许用户编辑元素的内容。它可以应用于任何 HTML
元素,从而在浏览器中实现富文本编辑。
<div contenteditable="true">Editable content</div>
十二、最后
本人每篇文章都是一字一句码出来,希望对大家有所帮助,多提提意见。顺手来个三连击,点赞👍收藏💖关注✨,一起加油☕
相关文章:

HTML面试题---专题四
文章目录 一、前言二、如何在 HTML 中嵌入音频文件?三、解释 <script> 标签中 defer 属性的用途。四、如何在 HTML 中创建粘性/固定导航栏?五、HTML 中的 span 元素的用途是什么?六、如何使 HTML 元素可拖动?七、解释 <i…...

stm32项目(11)——基于stm32的俄罗斯方块游戏机
1.功能设计 使用stm32f103zet6平台,以及一块LCD屏幕,实现了一个俄罗斯方块游戏机。可以用按键调整方块的位置、还可以控制方块下降的速度! 2.视频演示 俄罗斯方块 3.俄罗斯方块发展史 俄罗斯方块是一种经典的拼图游戏,由苏联俄罗…...
【计算机网络基础2】IP地址和子网掩码
1、IP地址 网络地址 IP地址由网络号(包括子网号)和主机号组成,网络地址的主机号为全0,网络地址代表着整个网络。 广播地址 广播地址通常称为直接广播地址,是为了区分受限广播地址。 广播地址与网络地址的主机号正…...
ES6-import后是否有{}的区别
在ES6中,import语句用于导入其他模块中的变量、函数、类等。在使用import语句时,可以选择是否使用花括号{}来包裹导入的内容,这会影响导入的内容的使用方式。 1.使用花括号{}: 当使用花括号{}时,表示只导入指定的变量…...

rv1126-rv1109-以太网功能-eth-(原理篇)
这里只是浅浅分析一下 1.主控里面会内置mac 2.mac有组接口接到phy(网络芯片:8201) 3.phy(网络芯片:8201)接到网口 //这里就到达硬件的接口了,大致就是这个原理; 4.然后涉及到软件部分 就是mdio总线;这个总线是注册phy用的; 如果注册失败会导致网口无法使用 [ 1.002751] m…...

【IDEA】反向撤销操作快捷键 ctrl+shift+z 和搜狗热键冲突的解决办法
当我们执行某些操作时与搜狗热键冲突,直接取消搜狗的快捷键即可!!!以下以 ctrlshiftz 为例。 在输入悬浮框右键找到更多设置 按键里面找到系统功能快捷键设置 取消掉冲突的热键即可...

数据结构之----逻辑结构、物理结构
数据结构之----逻辑结构、物理结构 目前我们常见的数据结构分别有: 数组、链表、栈、队列、哈希表、树、堆、图 而它们可以从 逻辑结构和物理结构两个维度进行分类。 什么是逻辑结构? 逻辑结构是指数据元素之间的逻辑关系,而逻辑结构又分为…...
pip 通过git安装库
举例:安装peft库 git clone https://github.com/huggingface/peft.git cd peft python -m pip install . 解释: 使用git clone克隆PEFT库的代码。进入克隆的目录。使用python -m pip install .来安装PEFT库。 补充:使用pip安装到指定编译器…...
C语言——从终端输入 3 个数 a、b、c,按从大到小的顺序输出。
方式一 #include <stdio.h> int main() {int a, b, c, temp;printf("请输入三个数:\n");scanf("%d %d %d", &a, &b, &c);if (a < b) {temp a;a b;b temp;}if (a < c) {temp a;a c;c temp;}if (b < c) {temp…...

【JVM从入门到实战】(二)字节码文件的组成
一、Java虚拟机的组成 二、字节码文件的组成 字节码文件的组成 – 应用场景 字节码文件的组成部分-Magic魔数 什么是魔数? Java字节码文件中的魔数 文件是无法通过文件扩展名来确定文件类型的,文件扩展名可以随意修改,不影响文件的内容。…...
OPC UA常见故障信息代码
错误信息解释0x00000000操作成功。0x40000000值不确定,但原因不明。0x80000000值为坏,但原因不明。Bad_UnexpectedError 0x80010000发生非预期错误。Bad_InternalError 0x80020000编程或配置错误时发生内部错误。Bad_OutOfMemory 0x80030000完成操作所需…...
第20关 快速掌握K8S下的有状态服务StatefulSet
------> 课程视频同步分享在今日头条和B站 大家好,我是博哥爱运维,K8s是如何来管理有状态服务的呢?跟着博哥来会会它们吧! 前面我们讲到了Deployment、DaemonSet都只适合用来跑无状态的服务pod,那么这里的Statefu…...

如何使用https://www.krea.ai/来实现文生图,图生图,
网址:https://www.krea.ai/apps/image/realtime Krea.ai 是一个强大的人工智能艺术生成器,可用于创建各种创意内容。它可以用来生成文本描述的图像、将图像转换为其他图像,甚至写博客文章。 文本描述生成图像 要使用 Krea.ai 生成文本描述…...

点滴生活记录2
我从小跟着我爷爷奶奶,小学六年级转到县城上小学,就没跟我奶奶他们住一起了。十一回家,把奶奶接到我这住,细想,自六年级之后,就很少跟奶奶住一起了。 奶奶(间歇性)耳聋,为…...

【带头学C++】----- 九、类和对象 ---- 9.12 C++之友元函数(9.12.1---12.4)
❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️创做不易,麻烦点个关注❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️ ❤️❤️❤️❤️❤️❤️❤️❤️❤️文末有惊喜!献舞一支!❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️ 目录 9.12…...
设计模式的定义
1 组合模式: 整体-部分模式,它是一种将对象组合成树状层次结构的模式,用来表示整体和部分的关系,使用户对单个对象和组合对象具有一致的访问性,属于结构型设计模式 1.1 特点: 组合模式使得客户端代码可以一致的处理单个对象和组合对象更容易在组合体内加入新的对象,客户端不…...

【Kubernetes】存储类StorageClass
存储类StorageClass 一、StorageClass介绍二、安装nfs provisioner,用于配合存储类动态生成pv2.1、创建运行nfs-provisioner需要的sa账号2.2、对sa授权2.3、安装nfs-provisioner程序 三、创建storageclass,动态供给pv四、创建pvc,通过storage…...

【LLM】大模型之RLHF和替代方法(DPO、RAILF、ReST等)
note SFT使用交叉熵损失函数,目标是调整参数使模型输出与标准答案一致,不能从整体把控output质量,RLHF(分为奖励模型训练、近端策略优化两个步骤)则是将output作为一个整体考虑,优化目标是使模型生成高质量…...

Spring Boot监听redis过期的key
Redis支持过期监听,可以实现监听过期数据,实现过程如下 1、pom依赖 <!-- Redis--><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-redis</artifactId></depend…...

day01、什么是数据库系统?
数据库系统介绍 1.实例化与抽象化数据库系统2.从用户角度看数据库管理系统的功能2.1 数据库定义功能2.2 数据库操纵2.3 数据库控制2.4 数据库维护功能2.5 数据库语言与高级语言 3.从系统:数据库管理系统应具有什么功能 来源于战德臣的B站网课 1.实例化与抽象化数据库…...
RestClient
什么是RestClient RestClient 是 Elasticsearch 官方提供的 Java 低级 REST 客户端,它允许HTTP与Elasticsearch 集群通信,而无需处理 JSON 序列化/反序列化等底层细节。它是 Elasticsearch Java API 客户端的基础。 RestClient 主要特点 轻量级ÿ…...
是否存在路径(FIFOBB算法)
题目描述 一个具有 n 个顶点e条边的无向图,该图顶点的编号依次为0到n-1且不存在顶点与自身相连的边。请使用FIFOBB算法编写程序,确定是否存在从顶点 source到顶点 destination的路径。 输入 第一行两个整数,分别表示n 和 e 的值(1…...

【数据分析】R版IntelliGenes用于生物标志物发现的可解释机器学习
禁止商业或二改转载,仅供自学使用,侵权必究,如需截取部分内容请后台联系作者! 文章目录 介绍流程步骤1. 输入数据2. 特征选择3. 模型训练4. I-Genes 评分计算5. 输出结果 IntelliGenesR 安装包1. 特征选择2. 模型训练和评估3. I-Genes 评分计…...
【生成模型】视频生成论文调研
工作清单 上游应用方向:控制、速度、时长、高动态、多主体驱动 类型工作基础模型WAN / WAN-VACE / HunyuanVideo控制条件轨迹控制ATI~镜头控制ReCamMaster~多主体驱动Phantom~音频驱动Let Them Talk: Audio-Driven Multi-Person Conversational Video Generation速…...

初探Service服务发现机制
1.Service简介 Service是将运行在一组Pod上的应用程序发布为网络服务的抽象方法。 主要功能:服务发现和负载均衡。 Service类型的包括ClusterIP类型、NodePort类型、LoadBalancer类型、ExternalName类型 2.Endpoints简介 Endpoints是一种Kubernetes资源…...

使用Spring AI和MCP协议构建图片搜索服务
目录 使用Spring AI和MCP协议构建图片搜索服务 引言 技术栈概览 项目架构设计 架构图 服务端开发 1. 创建Spring Boot项目 2. 实现图片搜索工具 3. 配置传输模式 Stdio模式(本地调用) SSE模式(远程调用) 4. 注册工具提…...

安全突围:重塑内生安全体系:齐向东在2025年BCS大会的演讲
文章目录 前言第一部分:体系力量是突围之钥第一重困境是体系思想落地不畅。第二重困境是大小体系融合瓶颈。第三重困境是“小体系”运营梗阻。 第二部分:体系矛盾是突围之障一是数据孤岛的障碍。二是投入不足的障碍。三是新旧兼容难的障碍。 第三部分&am…...

MySQL 知识小结(一)
一、my.cnf配置详解 我们知道安装MySQL有两种方式来安装咱们的MySQL数据库,分别是二进制安装编译数据库或者使用三方yum来进行安装,第三方yum的安装相对于二进制压缩包的安装更快捷,但是文件存放起来数据比较冗余,用二进制能够更好管理咱们M…...
C#学习第29天:表达式树(Expression Trees)
目录 什么是表达式树? 核心概念 1.表达式树的构建 2. 表达式树与Lambda表达式 3.解析和访问表达式树 4.动态条件查询 表达式树的优势 1.动态构建查询 2.LINQ 提供程序支持: 3.性能优化 4.元数据处理 5.代码转换和重写 适用场景 代码复杂性…...

Rust 开发环境搭建
环境搭建 1、开发工具RustRover 或者vs code 2、Cygwin64 安装 https://cygwin.com/install.html 在工具终端执行: rustup toolchain install stable-x86_64-pc-windows-gnu rustup default stable-x86_64-pc-windows-gnu 2、Hello World fn main() { println…...