纯html文件实现目录和文档关联
目录结构
效果图
代码
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>项目结题报告</title><style lang="scss">::-webkit-scrollbar {width: 6px;height: 6px;}::-webkit-scrollbar-track {background: #f1f1f1;}::-webkit-scrollbar-thumb {background: #d4d4d4;border-radius: 5px;}::-webkit-scrollbar-thumb:hover {background: #adadad;}html,body {margin: 0;padding: 0;height: 100%;}.common-layout {width: 100%;height: 100%;/* overflow: hidden; */.header {height: 70px;background-color: #083a55;color: #fff;box-shadow: 0px 0px 10px 2px #0000003d;z-index: 1;padding: 0 20px;display: flex;align-items: center;justify-content: space-between;.title {font-weight: bold;font-size: 28px;}.header-content {.common- {height: 70%;font-size: 18px;border-right: 1px solid rgb(70, 70, 70);margin-left: 20px;padding-right: 20px;cursor: pointer;.current {outline: none;font-size: 16px;}.iconfont {padding-right: 10px;color: #ffffff;}&:last-child {border: 0;}}}}.el-container {height: calc(100% - 70px);background-color: #f9f6ee;display: flex;.aside {margin: 10px 10px;width: 350px;position: relative;isolation: isolate;background-color: #ffffff;box-shadow: 1px 1px 5px 0px rgba(89, 89, 89, 0.2784313725);.nav {height: 100%;padding: 25px 20px;box-sizing: border-box;font-size: 15px;text-align: left;p {margin-top: 0;font-size: 18px;font-weight: bold;}.list_item {margin: 0 0 0 25px;a {padding: 4px 0;display: inline-block;text-decoration: none;font-size: 15px;color: #5d5d5d;&:hover {color: #409eff;}}}.nav_item {padding: 5px 0;&:hover {cursor: pointer;color: rgb(0, 140, 255);}.active {color: #008cff}}.active {color: #008cff !important;}}}.main {margin: 10px 10px 10px 0;width: calc(100% - 370px);height: calc(100% - 20px);background-color: #ffffff;box-shadow: 1px 1px 5px 0px rgba(89, 89, 89, 0.2784313725);text-align: left;padding: 0;.ref_container {height: 100%;overflow-y: auto;}.content_cover {width: 100%;height: calc(100vh - 90px);display: flex;margin-bottom: 100px;box-shadow: 0px 3px 10px 5px #ededed70;padding: 0 0 0 20px;box-sizing: border-box;.before {width: 55%;display: flex;flex-direction: column;.logo {height: 35%;img {height: 70%;padding-top: 20px;}}.title {height: 63%;h1 {color: #616161;font-weight: 600;}h4 {margin: 10px 20px;color: #4e4e4e;font-weight: 500;}}.footer {height: 8%;p {margin: 5px 20px;font-size: 16px;}}}.behind {width: 45%;height: 100%;overflow: hidden;img {height: 100%;}}}.content {padding: 0 20px;}.content_first {text-align: left;.cont {font-size: 15px;}.tips {margin: 15px 0;color: cadetblue;}.tip {margin: 0 0 0 10px;font-size: 14px;&:first-child {margin: 0;}}h6 {margin: 10px;text-align: center;}.echarts {display: flex;justify-content: space-between;margin: 40px 5px 0;box-shadow: 0px 0px 15px 2px #e0e0e057;.echart {width: calc(100% - 150px);}.echart2 {display: flex;@media screen and (min-width: 1851px) {iframe {width: 45%;max-width: 700px;}}@media screen and (max-width: 1850px) {flex-direction: column;iframe {width: 100%;max-width: 700px;}}}.echarts_nav {width: 300px;margin-left: 5px;padding: 15px;font-size: 16px;box-sizing: border-box;border-right: 1px solid #e1e1e1;.echarts_nav_item {margin: 10px 0;cursor: pointer;&:hover {color: #008cff}}.item_active {color: #008cff}}}:deep .my-table-header {background-color: #647687;color: white;}}.table7 {height: 420px;overflow-y: auto;}.table_container {height: 420px;overflow-y: auto;}table {width: 100%;border-collapse: collapse;thead {position: sticky;top: 0;background: #647687;z-index: 100;color: white;font-size: 14px;z-index: 100;th {padding: 8px 12px;border-right: 2px solid #ebeef5;&:last-child {border: 0;}}}tbody {border: 1px solid #ebeef5}tr {border-bottom: 1px solid #ebeef5;&:nth-of-type(even) {background-color: #fafafa;}&:hover {background-color: #cacfdd3d;}}td {font-size: 14px;padding: 8px 12px;border-right: 1px solid #ebeef5;}}}select {align-items: center;border-radius: 5px;box-sizing: border-box;cursor: pointer;display: flex;font-size: 14px;gap: 6px;line-height: 24px;min-height: 32px;padding: 4px 12px;position: relative;text-align: left;outline: none;}}}.print {display: none;}@media print {.print {display: contents;}@page {margin: 20px 10px;}body {overflow: visible;}.table_container {height: auto !important;overflow-y: auto;}.el-container {height: auto !important;}.no_print {display: none !important;}.content_cover {box-shadow: unset !important;margin-bottom: 0 !important;height: calc(100vh - 20px) !important;}.main {width: 100% !important;height: 100% !important;box-shadow: unset !important;}.echart2 {display: flex;flex-direction: column !important;iframe {width: 100% !important;}}.ref_container {overflow-y: unset !important;}table {border-collapse: collapse;border: 2px solid #ebeef5;tr {page-break-inside: avoid;break-inside: avoid;border-top: 2px solid #ebeef5;border-bottom: 2px solid #ebeef5;}th {color: #363636 !important;border-right: 0 !important;}}.table_7 {/* page-break-before: always; */}.table7 {th,td {font-size: 12px !important;padding: 8px 9px !important;}}.echarts {justify-content: center !important;box-shadow: unset !important;margin: 0 !important;.echart {width: 100% !important;min-width: 100% !important;}}}</style>
</head><body><div class="common-layout"><div class="header no_print"><div class="title">***报告</div><div class="header-content"><div class="common-"><span class="iconfont icon-human1"></span><span>客户单位：XX科学院</span></div></div></div><div class="el-container"><div class="aside no_print"><div class="nav"><p>目录</p><div id="navList"></div></div></div><div class="main"><div class="ref_container" id="content"><div><div class="content_cover"><div class="before"><div class="logo"><img src="image/1.png"></div><div class="title"><h1>项目结题报告</h1><h4>测序报告</h4><h4>客户单位：XX科学院</h4></div><div class="footer"><p>***有限公司</p><p>服务热线：***</p></div></div><div class="behind"><img src="image/2.png" alt=""></div></div><div class="content" style="page-break-after: always;"><div class="content_first" id="id1"><h3>1.项目概况</h3><img src="image/report/1.png" alt="" title=""></div><div class="content_first"><h3 id="id2">2.流程说明</h3><div class="content_second"><h4 id="id21">2.1.实验流程</h4><div><img src="image/report/2.1.png" alt=""><div id="id211"><h5>2.1.1.aa</h5><p class="cont">************</p></div><div id="id212"><h5>2.1.2.bb</h5><div class="cont">************</div></div><div id="id213"><h5>2.1.3.cc</h5><div class="cont">************************************************</div></div><div id="id214"><h5>2.1.4.dd</h5><p class="cont">************************************************************************************************</p></div><div id="id215"><h5>2.1.5.ee</h5><div class="cont">************************************************************************************************</div></div></div></div><div class="content_second" id="id22"><h4>2.2.信息分析流程</h4><p class="cont">************************************************************************************************</p><img src="image/report/2.2.png" alt=""></div></div><div class="content_first"><h3 id="id3">3.数据质控</h3><div class="content_second"><div id="id31"><h4>3.1 测序数据统计</h4><div><p class="cont">结果见表1。</p><h6 class="table_1">表1 ***</h6><div class="table_container table1"><table><thead class="thead"><tr><th>Sample</th><th>Raw reads</th><th>Raw bases</th><th>Q30(%)</th><th>GC(%)</th><th>Duplication(%)</th></tr></thead><tbody class="no_print"><tr><td>S1</td><td>2</td><td>3</td><td>3</td><td>3</td><td>3</td></tr></tbody></table></div><div class="tips"><p class="tip">注：</p><p class="tip">************</p><p class="tip">************</p><p class="tip">************</p><p class="tip">************</p><p class="tip">************</p><p class="tip">************</p></div></div></div><h4 id="id32">3.2.质量控制</h4><div id="id321"><h5>3.2.1.质量分布</h5><div><div class="cont">************结果见图1。</div><div class="echarts"><div class="no_print" style="font-size: 16px;margin: 40px 0 0 20px;"><select name="cars" id="select1"onchange="selectChange('select1','iframe1','fig1_quality_boxplot')"></select></div><div class="echart"><iframe id="iframe1"src="public/fig1_quality_boxplot/9-16_quality_boxplot.html"width="100%" height="600px" scrolling="no" frameborder="0"></iframe></div></div><h6 class="h62">图1 </h6><div class="tips"><p class="tip">注：</p><p class="tip">************</p><p class="tip">************</p><p class="tip">************</p></div></div></div><div id="id322"><h5>3.2.2.Base Content分布</h5><div><div class="cont">************</div><div class="echarts" id="echart2"><div class="no_print" style="font-size: 16px;margin: 40px 0 0 20px;"><select id="select2" name="cars"onchange="selectChange2('select2','fig2_base_content')"><option value="16-122" selected>16-122</option><option value="16-146">16-146</option><option value="16-161">16-161</option><option value="16-176">16-176</option><option value="16-182">16-182</option><option value="16-183">16-183</option><option value="16-200">16-200</option><option value="16-201">16-201</option><option value="16F">16F</option><option value="16M">16M</option></select></div><div class="echart echart2"><iframe id="iframe21"src="public/fig2_base_content/16-122_read1_base_content.html"width="100%" height="600px" scrolling="no" frameborder="0"></iframe><iframe id="iframe22"src="public/fig2_base_content/16-122_read2_base_content.html"width="100%" height="600px" scrolling="no" frameborder="0"></iframe></div></div><h6 class="h62">图2 </h6><div class="tips"><p class="tip">注：</p><p class="tip">************，</p><p class="tip">************</p><p class="tip">************</p></div></div></div><div id="id33"><h4>3.3.过滤数据统计</h4><div><div class="cont">************</div><p class="cont">1)************</p><p class="cont">2)************</p><div class="cont">************数据处理的步骤如下：</div><p class="cont">1)************</p><p class="cont">2)************</p><p class="cont">3)************</p><div class="cont">数据过滤的基本情况见表2。</div><h6 class="h61">表2 </h6><div class="table_container table2"><table><thead><tr><th>Sample</th><th>Clean reads</th><th>Clean bases</th><th>Clean reads(%)</th><th>Clean bases(%)</th></tr></thead><tbody class="no_print"><tr><td>S1</td><td>70367889</td><td>5595586</td><td>0.838</td><td>1</td></tr><tr><td>S1</td><td>70367889</td><td>5595586</td><td>0.838</td><td>1</td></tr></tbody></table></div><div class="tips"><p class="tip">注：</p><p class="tip">************，</p><p class="tip">************，</p><p class="tip">************，</p><p class="tip">************，</p><p class="tip">************</p></div><div><div class="echarts"><div class="no_print"style="font-size: 16px;margin: 40px 0 0 20px;"><select name="cars" id="select3"onchange="selectChange('select3','iframe3','fig3_piecharts')"></select></div><div class="echart"><iframe id="iframe3" src="public/fig3_piecharts/9-3_pie.html"width="100%" height="600px" scrolling="no" frameborder="0"></iframe></div></div></div><h6 class="h62">图3 数据过滤统计</h6></div></div></div></div></div></div></div></div></div></div><script></script>
</body><script>let navList = [{'id': 'id1','title': '1. 项目概况'},{'id': 'id2','title': '2. 流程说明','children': [{'id': 'id21','title': '2.1 实验流程','children': [{'id': 'id211','title': '2.1.1 aa'},{'id': 'id212','title': '2.1.2 bb'},{'id': 'id213','title': '2.1.3 cc'},{'id': 'id214','title': '2.1.4 dd'},{'id': 'id215','title': '2.1.5 ee'}]},{'id': 'id22','title': '2.2 信息分析流程'}]},{'id': 'id3','title': '3. 数据质控','children': [{'id': 'id31','title': '3.1 测序数据统计'},{'id': 'id32','title': '3.2 质量控制','children': [{'id': 'id321','title': '3.2.1 质量分布'},{'id': 'id322','title': '3.2.2 Base Content分布'}]},{'id': 'id33','title': '3.3 过滤数据统计'}]}]//生成目录const titles = []function nav(list, id) {let divElement = document.getElementById(id);list.forEach((item, index) => {let div = document.createElement('div');let a = document.createElement('a');a.textContent = item.title;a.href = '#' + item.id;a.className = 'box';div.id = item.id + '_';div.className = 'list_item';divElement.appendChild(div);div.appendChild(a)titles.push(item)if (item.children) {nav(item.children, div.id)}});}//下拉选择改变后 iframe中的图改变function selectChange(id, iframeId, url) {let selectedValue = document.getElementById(id).valuedocument.getElementById(iframeId).src = 'public/' + url + '/' + selectedValue + '.html';}function selectChange2(id, url) {let selectedValue = document.getElementById(id).valuedocument.getElementById('iframe21').src = 'public/' + url + '/' + selectedValue + '_read1_base_content.html';document.getElementById('iframe22').src = 'public/' + url + '/' + selectedValue + '_read2_base_content.html';}//给每个下拉选择赋值function ceratdOption() {let options = [{ value: '9-3', text: '9-3' },{ value: '9-5', text: '9-5' },{ value: '9-6', text: '9-6' },{ value: '9-16', text: '9-16' },{ value: '9-20', text: '9-20' },{ value: '9-21', text: '9-21' },{ value: '9-26', text: '9-26' },{ value: '9-51', text: '9-51' },{ value: '9-55', text: '9-55' },{ value: '9-56', text: '9-56' }]options.forEach(function (option, index) {document.getElementById('select1').add(new Option(option.text + '_quality_boxplot', option.value + '_quality_boxplot'))document.getElementById('select3').add(new Option(option.text + '_pie', option.value + '_pie'))document.getElementById('select4').add(new Option(option.text + '_coverage', option.value + '_coverage'))document.getElementById('select5').add(new Option(option.text + '_snp_anno_pie', option.value + '_snp_anno_pie'))document.getElementById('select6').add(new Option(option.text + '_indel_anno_pie', option.value + '_indel_anno_pie'))});}//点击菜单高亮const menu = document.getElementById('navList')menu.addEventListener('click', (e) => {highlight(e.target)})// 设置当前菜单高亮function highlight(id) {document.querySelectorAll('.box').forEach(a =>a.classList.remove('active'));// 如果传递的是一个元素if (id instanceof HTMLElement) {id.classList.add('active')return}if (id.startsWith('#')) {id = id.substring(1)}document.querySelector(`a[href="#${id}"]`).classList.add('active')}// 锚点滚动 菜单高亮const handScroll = () => {for (let i = 0; i < titles.length; i++) {// 获取锚点对应内容元素的位置const rect = document.getElementById(titles[i].id).getBoundingClientRect()// rect.top 当前元素距离页面顶部的距离 rect.bottom 当前元素底部距离页面顶部的距离if ((rect.top >= 70 && rect.top < 100) || (rect.bottom > 90 && rect.bottom < 120)) {highlight(`#${titles[i].id}`)break;}}}const contentele = document.getElementById('content')contentele.addEventListener('scroll', handScroll)window.onload = function () {nav(navList, 'navList'); // 页面加载完成后调用函数console.log('onload', titles)ceratdOption()}</script></html>
相关文章：
纯html文件实现目录和文档关联
目录结构 效果图 代码 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><title>项目结题报告</title><style lang"scss">::-webkit-scrollbar {width: 6px;height: 6px;}::-webkit-scro…...
C# | 委托 | 事件 | 异步
委托（Delegate）和事件（Event） 在C#和C中，委托（Delegate）与事件（Event）以及函数对象（Function Object）是实现回调机制或传递行为的重要工具。虽然…...
数据结构——顺序表与链表
1. 基础介绍 1、线性结构： 如果一个数据元素序列满足： （1）除第一个和最后一个数据元素外，每个数据元素只有一个前驱数据元素和一个后继数据元素； （2）第一个数据元素没有前驱数据…...
【uniapp】图片添加canvas水印
目录 需求&背景实现地理位置添加水印 ios补充 需求&背景 需求：拍照后给图片添加水印, 水印包含经纬度、用户信息、公司logo等信息。 效果图： 方案：使用canvas添加水印。 具体实现：上传图片组件是项目里现有的ÿ…...
ElementUI 级联选择器el-cascader启用选择任意一级选项，选中后关闭下拉框
1、启用选择任意一级选项 在 el-cascader 标签上加上配置项： :props"{ checkStrictly: true }"例如： <el-cascaderref"selectedArrRef"v-model"selectedArr":options"optionsList":props"{ checkStri…...
【音视频】ffplay常用命令
一、 ffplay常用命令 -x width：强制显示宽度-y height：强制显示高度 强制以 640*360的宽高显示 ffplay 2.mp4 -x 640 -y 360 效果如下 -fs 全屏显示 ffplay -fs 2.mp4效果如下： -an 禁用音频（不播放声音）-vn 禁…...
5人3小时复刻Manus？开源OpenManus项目全解剖，我的DeepSeek股票报告这样诞生
大家好，我是大 F，深耕AI算法十余年，互联网大厂技术岗。分享AI算法干货、技术心得。 更多文章可关注《大模型理论和实战》、《DeepSeek技术解析和实战》，一起探索技术的无限可能！ OpenManus是什么 1. 项目背景 OpenManus 是由 MetaGPT 核心团队仅用 3 小时复刻而成的开源…...
【Python运维】用Python自动化AWS资源管理：利用boto3实现高效管理S3桶和EC2实例
《Python OpenCV从菜鸟到高手》带你进入图像处理与计算机视觉的大门！ 解锁Python编程的无限可能：《奇妙的Python》带你漫游代码世界 随着云计算的普及，AWS（Amazon Web Services）已经成为许多企业和开发者首选的云平台。为了提高工作效率，自动化管理AWS资源成为了一个热…...
django各种mixin用法
在 Django 中，Mixin 是一种用于扩展类功能的设计模式。通过 Mixin，可以在不修改原有类的情况下，为其添加新的方法或属性。Django 中的 Mixin 广泛应用于视图（View）、表单（Form）、模型（Model）等组件中。以下是 Django 中常见 Mixin 的用法和示例： 一、视图（View）中的…...
Java 大视界 -- Java 大数据在智能教育考试评估与学情分析中的应用（112）
💖亲爱的朋友们，热烈欢迎来到 青云交的博客！能与诸位在此相逢，我倍感荣幸。在这飞速更迭的时代，我们都渴望一方心灵净土，而 我的博客 正是这样温暖的所在。这里为你呈上趣味与实用兼具的知识，也…...
Manus AI : Agent 元年开启.pdf
Manus AI : Agent 元年开启.pdf 是由华泰证券出品的一份调研报告，共计23页。报告详细介绍了Manus AI 及 Agent，主要包括Manus AI 的功能、优势、技术能力，Agent 的概念、架构、应用场景，以及 AI Agent 的类型和相关案例࿰…...
【计算机网络】计算机网络的性能指标——时延、时延带宽积、往返时延、信道利用率
计算机网络的性能指标 导读 大家好，很高兴又和大家见面啦！！！ 在上一篇内容中我们介绍了计算机网络的三个性能指标——速率、带宽和吞吐量。用大白话来说就是：网速、最高网速和实时网速。 相信大家看到这三个词应该就…...
FreeRTOS第15篇：FreeRTOS链表实现细节03_List_t与ListItem_t的奥秘
文/指尖动听知识库-星愿 文章为付费内容，商业行为，禁止私自转载及抄袭，违者必究！！！ 文章专栏：深入FreeRTOS内核：从原理到实战的嵌入式开发指南 1 FreeRTOS列表的核心数据结构 FreeRTOS的列表实现由两个关键结构体组成：List_t（列表）和ListItem_t（列表项）。它们共同…...
git 添加额外的远程仓库 URL
要使用 git branch -a 查看 net-next 远程仓库中的所有分支，请按照以下步骤操作： 步骤 1: 确保已添加 net-next 远程仓库 如果尚未添加 net-next 远程仓库，请运行以下命令： git remote add net-next git://git.kernel.org/pub/s…...
不同类型光谱相机的技术差异比较
一、波段数量与连续性 多光谱相机 波段数：通常4-9个离散波段，光谱范围集中于400-1000nm。 数据特征：光谱呈阶梯状，无法连续覆盖，适用于中等精度需求场景（如植被分类）。 高光谱相机…...
Swift系列01-Swift语言基本原理与设计哲学
本文将深入探讨Swift的核心原理、设计理念以及与Objective-C的对比 1. Swift与Objective-C的架构差异分析 Swift和Objective-C尽管可以无缝协作，但它们的架构设计存在本质差异。 1.1语言范式 Objective-C是一种动态语言，建立在C语言之上并添加了Smal…...
《OpenCV》——dlib（人脸应用实例）
文章目录 dlib库dlib库——人脸应用实例——表情识别dlib库——人脸应用实例——疲劳检测 dlib库 dlib库的基础用法介绍可以参考这篇文章：https://blog.csdn.net/lou0720/article/details/145968062?spm1011.2415.3001.5331，故此这篇文章只介绍dlib的人…...
以太网通讯
接口开发笔记-WebApi-CSDN博客 以太网常用通讯协议 1、modbus tcp using EasyModbus; using System;class Program {static void Main(string[] args){// 创建Modbus客户端实例ModbusClient modbusClient new ModbusClient("192.168.1.100"); // IP地址modbusCli…...
UDP学习笔记（一）为什么UDP需要先将数据转换为字节数组
UDP 发送数据时需要先将数据转换为字节数组再发送，主要是因为计算机网络传输的最基本单位是“字节”（Byte）。让我们从以下几个方面来深入理解这个设计选择： 1. 计算机网络只能传输“字节” 在网络通信中，无论是 TCP 还…...
数据分析/数据科学常见SQL题目：连续登录用户、留存率、最大观看人数
文章目录 1. SQL的执行顺序是什么？on和join谁先执行，为什么？on和where的区别？2. 已知表user,字段id, date，求新用户的次日留存率3. 已知表user，字段id，date，求每个日期新用户的次日留…...
【Conda】Windows安装conda/Anaconda环境
安装conda并配置powershell 访问该网址，下载安装即可： Anaconda下载 安装完成后，打开Anaconda，并访问Powershell Prompt 弹出Windows Terminal，并正常进入Conda 【非必须】如果不是通过Windows Terminal打开&#x…...
olmOCR：高效精准的 PDF 文本提取工具
在日常的工作和学习中，是否经常被 PDF 文本提取问题困扰？例如： 想从学术论文 PDF 中提取关键信息，却发现传统 OCR 工具识别不准确或文本格式混乱？需要快速提取商务合同 PDF 中的条款内容，却因工具不给力而…...
数字投屏叫号器-发射端python窗口定制
窗口 本系列前章介绍，叫号器的显示端，完成了视频音频的形成和传输的介绍。本章节开始定制小窗口。 最终实现，处于桌面最前端，发送指令，集合前篇即可完成： 处理本地text.txt更新，随之被rtsp采集…...
从零开始实现大语言模型（十四）：高阶训练技巧
1. 前言 预训练大语言模型的流程与训练普通神经深度网络模型本质上并没有任何不同。可以使用深度学习实践中已经被证明非常有效的高阶训练技巧，优化大语言模型预训练流程，使大语言模型预训练效率更高，训练过程更稳定。 本文介绍深度学习领域…...
Spring-framework源码编译
版本统一（搭配其他版本会遇到不可知错误）： 1）spring 5.2.X（5.5.26） 2）JDK8 3）Gradle:5.6.4 可以在gradle-wrapper.properties中修改 https\://services.gradle.org/distribution…...
分布式系统的核心挑战与解决方案
1、分布式系统的引入 在移动互联网、云计算和物联网的推动下，现代软件系统需要处理亿级用户请求、PB级数据存储和毫秒级响应需求。传统的单体架构受限于单机性能瓶颈和容灾能力，逐渐被分布式系统取代。例如，电商平台在“双十一”期间需应对每…...
fastjson漏洞
fastjson漏洞 fastjson工作原理攻击原理补充 例子 fastjson工作原理 fastjson的作用是将JAVA对象转换成对应的json表示形式，也可以反过来将json转化为对应的Java对象。fastjson使用AutoType功能进行反序列化，AutoType使用type标记字符的原始类型&#x…...
upload-labs详解（13-20）文件上传分析
目录 upload-labs-env upload-labs-env第十三关 文件包含漏洞 代码 测试 上传一个.jpg图片 上传一个.png文件 上传一个.gif图片 upload-labs-env第十四关 代码 思路 upload-labs-env第十五关 代码 思路 upload-labs-env第十六关 代码 思路 测试 上传gif格式…...
HTML第四节
一.复合选择器 1.后代选择器 注：1.后代选择器会选中后代所有的要选择的标签 2.儿子选择器 3.并集选择器 注：1.注意换行，同时选中多种标签 4.交集选择器 注：1.标签选择器放在最前面，例如放在类选择器的前面 2.两个选择…...
基于 LeNet 网络的 MNIST 数据集图像分类
1.LeNet的原始实验数据集MNIST 名称：MNIST手写数字数据集 数据类型：灰度图 （一通道） 图像大小：28*28 类别数：10类（数字0-9） 1.通过torchvision.datasets.MNIST下载并保存到本地…...