HTML面试题(2)
HTML5相比HTML有哪些更新?
- 语义化更强的HTML元素:引入artitcle、section、nav、header、footer等元素,帮助创建结构更清晰、语义更明确的网页,有利于SEO和内容的可访问性
- 表单控件增强:新增多种表单输入类型(如email、data),直接支持数据验证,提高了表单的易用性和功能性
- 音视频支持:原生支持音频(audio)和视频(video),无需依赖外部插件,提高了访问多媒体内容的速度和兼容性
- 新的API支持:如Canvas Geolocation Drap and Drop,让网页能支持更复杂的用户交互
- Web存储和WebSockets:提供了更先进的数据存储方案(localStorage和sessionStorage)和实时通信能力(WebSockets),让网页应用像传统的桌面应用
- 更好的连接性和离线支持:通过应用程序缓存(Application Cache)支持离线应用,使得Web应用能够更灵活地在没有网络的环境下使用
img标签的srcset属性的作用?
提供多个文件源和各自的分辨率,浏览器会根据设备的屏幕尺度和像素密度(DPI)选择最适合的图像。
行内元素有哪些?块级元素有哪些?空(void)元素有哪些?
行内元素(Inline Elements)
行内元素通常位于文本内部,它们不会导致文本换行,而是在内容流中连续展示。这些元素主要用于改变一小块内容的样式或行为,不影响周围的布局。
- <span>
- <a>
- <img>
- <b>和<i>
- <input>
- <select>:在表达中创建下拉选择菜单
- <strong>
块级元素(Block-level-Elements)
块级元素在页面中通常表现为“块”,会在其前后自动换行,默认占据父元素的完整宽度。
- <div>
- <p>
- <h1>到<h6>
- <ul> <ol>:分别定义有序列表和无序列表
- <li>:列表项
空元素(Empty Elements)
空元素是那些只有开始标签,没有结束标签的元素,因为它们不包含任何内容
- <img>
- <br>
- <hr>:水平分割线
- <input>:用于创建输入字段,如文本框、复选框、单选框等
- <meta>:提供关于HTML文档的元数据,如定义字符集,页面描述等
- <link>:用于链接外部资源,如CSS文件
HTML5的离线储存如何使用?
离线存储(Application Cache):允许开发者指定哪些文件(如 HTML 页面、图像、JS 脚本和 CSS 样式表)应该被浏览器缓存,并能够在没有网络连接时访问它们。
1.创建清单文件
创建一个以.appcache结尾的清单文件,在文件中列出需要缓存的资源。这个文件必须声明MIME类型,即text/cache-manifest
2.引用清单文件
在HTML页面的<html>中使用manifest属性引用这个清单文件
<html manifest="example.appcache">
3.结构清单文件
# 2024-01-01 v1.0.0
CACHE:
/css/style.css
/js/app.js
/images/logo.pngNETWORK:
*FALLBACK:
/ /offline.html
- CACHE:首次下载后会被缓存,支持离线访问。
- NETWORK:不会缓存,从浏览器请求。*表示默认情况下,所有其他资源都需要网络连接才可以访问。
- FALLBACK:备用页面的路径。如果用户请求的资源无法访问,将跳转到备用路径。
浏览器如何对离线缓存的资源进行管理和加载?
管理
- 创建并引用清单文件
- 下载资源到缓存:用户首次访问时,浏览器解析清单文件并下载指定资源到应用程序缓存中
- 更新缓存:每次访问页面时,浏览器都会检查清单文件是否更新。如果更新,重新下载清单文件中指定的所有资源并替换掉旧缓存。
- 离线访问:资源被缓存,即可离线访问
加载
- 缓存中存在资源,从缓存加载
- 缓存中不存在资源且设备离线,使用备用资源
相关文章:
HTML面试题(2)
HTML5相比HTML有哪些更新? 语义化更强的HTML元素:引入artitcle、section、nav、header、footer等元素,帮助创建结构更清晰、语义更明确的网页,有利于SEO和内容的可访问性表单控件增强:新增多种表单输入类型࿰…...
微服务day07
MQ高级 发送者可靠性,MQ的可靠性,消费者可靠性。 发送者可靠性 发送者重连 连接重试的配置文件: spring:rabbitmq:connection-timeout: 1s # 设置MQ的连接超时时间template:retry:enabled: true # 开启超时重试机制initial-interval: 10…...
芯原科技嵌入式面试题及参考答案
Linux 相关驱动怎么写? 在 Linux 中编写驱动主要有以下步骤。 首先,需要了解设备的硬件特性。这包括设备的工作原理、寄存器地址和功能、中断号等信息。例如,对于一个简单的 GPIO 设备,要知道其数据寄存器、方向寄存器的位置以及读写操作的规则。 然后是模块的初始化部分。…...
二叉树Golang
二叉树 前言 完全二叉树 最底层节点按顺序从左到右排列。 满二叉树 一颗二叉树只有0度和2度的节点。 二叉搜索树 左子树上的所有节点的值均小于根节点的值。右子树上的所有节点的值均大于根节点的值。 平衡二叉搜索树 左右两个子树的高度差的绝对值不超过1 。 二叉树的存储…...
通过css的哪些方式可以实现隐藏页面上的元素?
1:opacity:0 通过将元素的透明度设置为o,实现隐藏效果,但是依然会占用空间并可以进行交互。 2:visibility:hidden 与透明度度为0的方案类似,会占据空间,但不可以进行交互。 3:Overflow:hi…...
微信小程序 === 使用腾讯地图选点
目录 插件介绍 接入指引 相关参数说明 插件错误处理 效果图 permission 插件的作用 添加插件 引入插件代码包 使用插件 页面 js 接口 插件介绍 腾讯位置服务地图选点插件 可以让用户快速、准确地选择并确认自己的当前位置,并将相关位置信息回传给开发者。…...
Redis高可用-Cluster(集群)
Redis cluster cluster 为无中心,分布式 sharding,高可用技术架构。 在哨兵 sentinel 机制中,可以解决 redis 高可用的问题,即当 master 故障后可以自动将 slave 提升为 master 从而可以保证 redis 服务的正常使用。 但是无法解…...
Spring Boot编程训练系统:数据管理与存储
摘要 随着信息技术在管理上越来越深入而广泛的应用,管理信息系统的实施在技术上已逐步成熟。本文介绍了编程训练系统的开发全过程。通过分析编程训练系统管理的不足,创建了一个计算机管理编程训练系统的方案。文章介绍了编程训练系统的系统分析部分&…...
报告解读 | 创意经济2024:如何在变革中抢占先机?
在科技飞速发展的今天,创意行业正面临前所未有的变化。《Skillshare Trendshare 2024》报告揭示了多项趋势,为创意人士提供了深刻的洞察和实用的建议。本文将为您详细解读这些趋势,助您在创意领域脱颖而出。 1. 人工智能(AI&…...
Flume1.9.0自定义Sink组件将数据发送至Mysql
需求 1、将Flume采集到的日志数据也同步保存到MySQL中一份,但是Flume目前不支持直接向MySQL中写数据,所以需要用到自定义Sink,自定义一个MysqlSink。 2、日志数据默认在Linux本地的/data/log/user.log日志文件中,使用Flume采集到…...
如何在 Ubuntu 24.04 上安装和配置 Fail2ban ?
确保你的 Ubuntu 24.04 服务器的安全是至关重要的,特别是如果它暴露在互联网上。一个常见的威胁是未经授权的访问尝试,特别是通过 SSH。Fail2ban 是一个强大的工具,可以通过自动阻止可疑活动来帮助保护您的服务器。 在本指南中,我…...
uniapp如何i18n国际化
1、正常情况下项目在代码生成的时候就已经有i18n的相关依赖,如果没有可以自行使用如下命令下载: npm install vue-i18n --save 2、创建相关文件 en文件下: zh文件下: index文件下: 3、在main.js中注册:…...
C++__day1
1、思维导图 2、如果登录失败,提示用户登录失败信息,并且提示错误几次,且重新输入;如果输入错误三次,则退出系统 #include <iostream> using namespace std;int main() {string id , pswd;string user"admi…...
Emacs进阶之插入时间信息(一百六十三)
简介: CSDN博客专家、《Android系统多媒体进阶实战》一书作者 新书发布:《Android系统多媒体进阶实战》🚀 优质专栏: Audio工程师进阶系列【原创干货持续更新中……】🚀 优质专栏: 多媒体系统工程师系列【…...
Java线程池:ThreadPoolExecutor原理解析
一、线程池的基本概念 1.1 线程池的定义 线程池是一组预先创建的线程,这些线程可以重复使用来执行多个任务,避免了频繁创建和销毁线程的开销。线程池的核心思想是通过复用一组工作线程,来处理大量的并发任务,减少系统资源消耗&a…...
二叉树、哈夫曼报文大全
1、泛型链树 #include <iostream> #include<Windows.h> #include<string> #include<stack> #include<queue> using namespace std; void menu() {cout << "**********" << endl;cout << "-1.添加" <&…...
NotePad++中安装XML Tools插件
一、概述 作为开发人员,日常开发中大部的数据是标准的json格式,但是对于一些古老的应用,例如webservice接口,由于其响应结果是xml,那么我们拿到xml格式的数据后,常常会对其进行格式化,以便阅读。…...
聊天服务器(7)数据模块
目录 Mysql数据库代码封装头文件与源文件 Mysql数据库代码封装 业务层代码不要直接写数据库,因为业务层和数据层的代码逻辑也想完全区分开。万一不想存储mysql,想存redis的话,就要改动大量业务代码。解耦合就是改起来很方便。 首先需要安装m…...
VS2022编译32位OpenCV
使用环境 Visual Studio 2022 OpenCV: 4.7.0 cmake: 3.30.2一、使用CMake工具生成vs2022的openCV工程解决方案 打开cmake,选择opencv的源代码目录,创建一个文件夹,作为VS工程文件的生成目录 点击configure构建项目,弹出构建设置…...
WP网站如何增加文章/页面的自定义模板
通过Wordpress我们后台在发布文章或者页面的时候其实可以看到有些主题 他有选择使用的页面模板,可以自定义模板,但是有些主题却没有选择主题这个功能,那这个自定义模板的功能是如何实现的呢?以下分两种情况:Page页面和…...
【大模型RAG】拍照搜题技术架构速览:三层管道、两级检索、兜底大模型
摘要 拍照搜题系统采用“三层管道(多模态 OCR → 语义检索 → 答案渲染)、两级检索(倒排 BM25 向量 HNSW)并以大语言模型兜底”的整体框架: 多模态 OCR 层 将题目图片经过超分、去噪、倾斜校正后,分别用…...
【Python】 -- 趣味代码 - 小恐龙游戏
文章目录 文章目录 00 小恐龙游戏程序设计框架代码结构和功能游戏流程总结01 小恐龙游戏程序设计02 百度网盘地址00 小恐龙游戏程序设计框架 这段代码是一个基于 Pygame 的简易跑酷游戏的完整实现,玩家控制一个角色(龙)躲避障碍物(仙人掌和乌鸦)。以下是代码的详细介绍:…...
【JavaEE】-- HTTP
1. HTTP是什么? HTTP(全称为"超文本传输协议")是一种应用非常广泛的应用层协议,HTTP是基于TCP协议的一种应用层协议。 应用层协议:是计算机网络协议栈中最高层的协议,它定义了运行在不同主机上…...
基于服务器使用 apt 安装、配置 Nginx
🧾 一、查看可安装的 Nginx 版本 首先,你可以运行以下命令查看可用版本: apt-cache madison nginx-core输出示例: nginx-core | 1.18.0-6ubuntu14.6 | http://archive.ubuntu.com/ubuntu focal-updates/main amd64 Packages ng…...
【大模型RAG】Docker 一键部署 Milvus 完整攻略
本文概要 Milvus 2.5 Stand-alone 版可通过 Docker 在几分钟内完成安装;只需暴露 19530(gRPC)与 9091(HTTP/WebUI)两个端口,即可让本地电脑通过 PyMilvus 或浏览器访问远程 Linux 服务器上的 Milvus。下面…...
Leetcode 3577. Count the Number of Computer Unlocking Permutations
Leetcode 3577. Count the Number of Computer Unlocking Permutations 1. 解题思路2. 代码实现 题目链接:3577. Count the Number of Computer Unlocking Permutations 1. 解题思路 这一题其实就是一个脑筋急转弯,要想要能够将所有的电脑解锁&#x…...
多种风格导航菜单 HTML 实现(附源码)
下面我将为您展示 6 种不同风格的导航菜单实现,每种都包含完整 HTML、CSS 和 JavaScript 代码。 1. 简约水平导航栏 <!DOCTYPE html> <html lang"zh-CN"> <head><meta charset"UTF-8"><meta name"viewport&qu…...
大学生职业发展与就业创业指导教学评价
这里是引用 作为软工2203/2204班的学生,我们非常感谢您在《大学生职业发展与就业创业指导》课程中的悉心教导。这门课程对我们即将面临实习和就业的工科学生来说至关重要,而您认真负责的教学态度,让课程的每一部分都充满了实用价值。 尤其让我…...
如何在最短时间内提升打ctf(web)的水平?
刚刚刷完2遍 bugku 的 web 题,前来答题。 每个人对刷题理解是不同,有的人是看了writeup就等于刷了,有的人是收藏了writeup就等于刷了,有的人是跟着writeup做了一遍就等于刷了,还有的人是独立思考做了一遍就等于刷了。…...
C++ Visual Studio 2017厂商给的源码没有.sln文件 易兆微芯片下载工具加开机动画下载。
1.先用Visual Studio 2017打开Yichip YC31xx loader.vcxproj,再用Visual Studio 2022打开。再保侟就有.sln文件了。 易兆微芯片下载工具加开机动画下载 ExtraDownloadFile1Info.\logo.bin|0|0|10D2000|0 MFC应用兼容CMD 在BOOL CYichipYC31xxloaderDlg::OnIni…...
