前端：html实现页面切换、顶部标签栏，类似于浏览器的顶部标签栏（完整版）
效果
代码
<!DOCTYPE html>
<html><head><style>/* 左侧超链接列表 */.link {display: block;padding: 8px;background-color: #f2f2f2;cursor: pointer;}/* 顶部标签栏 */#tabsContainer {width:98%;display: flex;align-items: center;overflow-x: auto; /* 添加横向滚动 */white-space: nowrap; /* 防止标签换行 */}#tabsContainer::-webkit-scrollbar {display: none; /* 隐藏Webkit浏览器的滚动条 */}/* 关闭按钮的宽度 */.line2{width:2%;}#all_close{cursor: pointer;display: none;}.tab_position:hover #all_close {display: block;}.tab_position {display: flex;align-items: center;/*垂直居中*/}.tab {display: flex;align-items: center;background-color: #f2f2f2;cursor: pointer;position: relative;margin-right: 10px;border-radius: 3px;}/* 标签标题 */.tab .title {padding: 5px 15px 5px 15px;user-select: none; /* 禁止文字复制 */}/* 标签关闭按钮 */.tab .close-btn {font-size: 10px;font-weight: bold;cursor: pointer;padding: 5px 5px 5px 0;user-select: none; /* 禁止文字复制 */}.tab.active {background-color: #ccc;}/* 左侧内容 */#links {float: left;width: 200px;padding: 10px;}#tabs {padding: 10px;}/* 右侧 */#content {border: 1px solid #ccc;padding: 10px;overflow: auto;}</style></head><body><div id="links"><!-- 在这里添加你的超链接 --><a href="#" onclick="loadContent('page1.html', '这是我的超链接标题1，我要测试滚动条');returnfalse;"class="link">超链接1</a><a href="#" onclick="loadContent('page2.html', '这是我的超链接标题2，我要测试滚动条');returnfalse;"class="link">超链接2</a><a href="#" onclick="loadContent('page3.html', '这是我的超链接标题3，我要测试滚动条');returnfalse;"class="link">超链接3</a><a href="#" onclick="loadContent('page4.html', '这是我的超链接标题4，我要测试滚动条');returnfalse;"class="link">超链接4</a><a href="#" onclick="loadContent('page5.html', '这是我的超链接标题5，我要测试滚动条');returnfalse;"class="link">超链接5</a><a href="#" onclick="loadContent('page6.html', '这是我的超链接标题6，我要测试滚动条');returnfalse;"class="link">超链接6</a><a href="#" onclick="loadContent('page7.html', '这是我的超链接标题7，我要测试滚动条');returnfalse;"class="link">超链接7</a><a href="#" onclick="loadContent('page8.html', '这是我的超链接标题8，我要测试滚动条');returnfalse;"class="link">超链接8</a><a href="#" onclick="loadContent('page9.html', '这是我的超链接标题9，我要测试滚动条');returnfalse;"class="link">超链接9</a></div><div class="tab_position"><div id="tabsContainer"></div><div id="line2"><div id="all_close" onclick="all_close()">X</div></div></div><div id="content"></div><script>var tabsContainer = document.getElementById('tabsContainer');var contentContainer = document.getElementById('content');var activeTab = null;// 加载内容到右侧窗口function loadContent(url, tabName) {var existingTab = tabsContainer.querySelector('[data-url="' + url + '"]');if (existingTab) {setActiveTab(existingTab);return;}// 检查标签页数量是否已达上限var tabs = Array.from(tabsContainer.getElementsByClassName('tab'));if (tabs.length >= 7) {alert('已达到标签页数量上限');return;}// 隐藏当前页面内容if (activeTab) {activeTab.classList.remove('active');var activeUrl = activeTab.getAttribute('data-url');var activeContent = document.getElementById(activeUrl);activeContent.style.display = 'none';}// 显示新页面内容var content = document.getElementById(url);if (content) {content.style.display = 'block';} else {content = document.createElement('div');content.id = url;content.style.display = 'block';contentContainer.appendChild(content);var iframe = document.createElement('iframe');iframe.src = url;iframe.frameborder = '0';iframe.style.width = '100%';iframe.style.height = '100%';content.appendChild(iframe);}createTabAndSetActive(url, tabName);}function createTabAndSetActive(url, tabName) {// 如果标签已存在，则激活该标签var tab = tabsContainer.querySelector('[data-url="' + url + '"]');if (tab) {setActiveTab(tab);return;}// 创建新的标签tab = document.createElement('div');tab.className = 'tab';tab.setAttribute('data-url', url);var title = document.createElement('span');title.className = 'title';title.innerText = tabName;tab.appendChild(title);var closeBtn = document.createElement('span');closeBtn.innerText = 'X';closeBtn.className = 'close-btn';closeBtn.addEventListener('click', function (event) {event.stopPropagation();closeTab(tab);});tab.appendChild(closeBtn);// 点击标签页切换内容tab.addEventListener('click', function () {loadContent(url, tabName);setActiveTab(tab);});tabsContainer.appendChild(tab);setActiveTab(tab);}// 设置活动标签页样式function setActiveTab(tab) {var tabs = Array.from(tabsContainer.getElementsByClassName('tab'));tabs.forEach(function (t) {t.classList.remove('active');// 隐藏标签页对应的内容var tabUrl = t.getAttribute('data-url');var tabContent = document.getElementById(tabUrl);if (tabContent) {tabContent.style.display = 'none';}});tab.classList.add('active');activeTab = tab;// 显示当前标签页对应的内容var url = tab.getAttribute('data-url');var content = document.getElementById(url);if (content) {content.style.display = 'block';}}// 关闭标签页function closeTab(tab) {var isActiveTab = (tab === activeTab);var nextActiveTab = tab.previousElementSibling || tab.nextElementSibling;tab.parentNode.removeChild(tab);// 如果关闭的是活动标签页且还有其他标签页存在，则将页面锁定到下一个标签页if (isActiveTab && nextActiveTab) {setActiveTab(nextActiveTab);loadContent(nextActiveTab.getAttribute('data-url'), nextActiveTab.querySelector('.title').innerText);}// 如果关闭的是活动标签页且没有其他标签页存在，则清空内容和活动标签页if (isActiveTab && !nextActiveTab) {contentContainer.innerHTML = '';activeTab = null;}// 隐藏当前页面内容if (isActiveTab) {var activeUrl = tab.getAttribute('data-url');var activeContent = document.getElementById(activeUrl);activeContent.style.display = 'none';}}// 关闭全部未激活标签页function all_close() { var confirmation = confirm('是否关闭全部标签页？'); // 显示确认和取消提示框if (confirmation) {var tabs = Array.from(tabsContainer.getElementsByClassName('tab'));tabs.forEach(function (tab) {if (!tab.classList.contains('active')) {closeTab(tab);}});// 清空内容、活动标签页和标签导航栏contentContainer.innerHTML = '';activeTab = null;tabsContainer.innerHTML = '';} else {console.log('取消')} }var isMouseDown = false;var startX = 0;var scrollLeft = 0;tabsContainer.addEventListener('mousedown', function (e) {isMouseDown = true;startX = e.pageX - tabsContainer.offsetLeft;scrollLeft = tabsContainer.scrollLeft;});tabsContainer.addEventListener('mouseleave', function () {isMouseDown = false;});tabsContainer.addEventListener('mouseup', function () {isMouseDown = false;});tabsContainer.addEventListener('mousemove', function (e) {if (!isMouseDown) return;e.preventDefault();var x = e.pageX - tabsContainer.offsetLeft;var walk = (x - startX) * 2; // 调整滚动速度tabsContainer.scrollLeft = scrollLeft - walk;});</script></body></html>
相关文章：
前端：html实现页面切换、顶部标签栏，类似于浏览器的顶部标签栏（完整版）
效果 代码 <!DOCTYPE html> <html><head><style>/* 左侧超链接列表 */.link {display: block;padding: 8px;background-color: #f2f2f2;cursor: pointer;}/* 顶部标签栏 */#tabsContainer {width:98%;display: flex;align-items: center;overflow-x: …...
强化自主可控，润开鸿发布基于RISC-V架构的开源鸿蒙终端新品
2023 RISC-V中国峰会于8月23日至25日在北京召开,峰会以“RISC-V生态共建”为主题,结合当下全球新形势,把握全球新时机,呈现RISC-V全球新观点、新趋势。本次大会邀请了RISC-V国际基金会、业界专家、企业代表及社区伙伴等共同探讨RISC-V发展趋势与机遇,吸引超过百余家业界企业、高…...
软件设计师知识点·1
控制器: (1)指令寄存器(IR) : CPU执行一条指令时,从内存储器取到缓冲寄存器中,再送入IR暂存; (2)程序计数器(PC): 将要执行的下一条指令的地址; (3)地址寄存器(IR): 当前CPU所访问的内存单元地址; (4)指令译码器(ID): 对指令中的操作码字段进行分析解释; 多核CPU可以满足用户…...
修改Jupyter Notebook默认打开路径
这里我是重新下载的anaconda，打开Jupyter之后是默认在C盘的一个路径的，现在我们就来修改一下它的一个默认打开路径，这样在我们后续学习过程中，可以将ipynb后缀的文件放在这个目录下就能查看了。 1、先打开Anaconda Prompt&#x…...
经典卷积网络
目录 一、经典神经网络出现的时间线编辑 二、LeNet 三、AlexNet 四、VGGNet 五、InceptionNet 六、ResNet 总结： 一、经典神经网络出现的时间线 二、LeNet 背景：LeNet由Yann LeCun于1998年提出，卷积网络开篇之作。 解释࿱…...
react+koa+vite前后端模拟jwt鉴权过程
路由组件（生成token） const Router require(koa/router) const jwt require(jsonwebtoken); const router new Router()const mockDbUserInfo [{nickname: xxxliu,username: Tom,password: 123456,icon: url1},{nickname: xxx,username: John,passw…...
VK1616是LED显示控制驱动电路/LED驱动IC、数显驱动芯片、数码管驱动芯片
产品品牌：永嘉微电/VINKA 产品型号：VK1616 封装形式：SOP16 产品年份：新年份 概述：VK1616是一种数码管或点阵LED驱动控制专用芯片，内部集成有3线串行接口、数据锁存器、LED 驱动等电路。SEG脚接LED阳极&a…...
开箱报告，Simulink Toolbox库模块使用指南（五）——S-Fuction模块(C MEX S-Function)
文章目录 前言 C MEX S-Function 算法原理 原始信号创建 编写S函数 仿真验证 Tips 分析和应用 总结 前言 见《开箱报告，Simulink Toolbox库模块使用指南（一）——powergui模块》 见《开箱报告，Simulink Toolbox库模块使用…...
摄像头的调用和视频识别
CV_tutorial3 摄像头调用实时播放保存视频 运动目标识别帧差法背景减除法 摄像头调用 创建视频捕捉对象：cv2.VideoCapture() 参数为视频设备的索引号，就一个摄像投的话写0默认； 或者是指定要读取视频的路径。 实时播放 import cv2 import …...
多通道分离与合并
目录 1.多通道分离split() 2.多通道合并merge() 3.Android JNI demo 1.多通道分离split() void cv::split ( InputArray m, OutputArrayOfArrays mv ） m:待分离的多通道图像。 mv:分离后的单通道图像，为向量vector形式。 2.多通道合并merge…...
JOJO的奇妙冒险
JOJO,我不想再做人了。 推荐一部动漫 JOJO的奇妙冒险 荒木飞吕彦创作的漫画 《JOJO的奇妙冒险》是由日本漫画家荒木飞吕彦所著漫画。漫画于1987年至2004年在集英社的少年漫画杂志少年JUMP上连载（1987年12号刊-2004年47号刊），2005年后在集英…...
LeetCode56.合并区间
这道题我想了一会儿，实在想不到比较好的算法，只能硬着头皮写了，然后不断的debug，经过我不懈的努力，最后还是AC，不过效率确实低。 我就是按照最直接的方法来，先把intervals数组按照第一个数star…...
【内推码：NTAMW6c】 MAXIEYE智驾科技2024校招启动啦
MAXIEYE智驾科技2024校招启动啦【内推码：NTAMW6c】 【招聘岗位超多！！公司食堂好吃！！】 算法类：感知算法工程师、SLAM算法工程师、规划控制算法工程师、目标及控制算法工程师、后处理算法工程师 软件类&a…...
Python框架【模板继承 、继承模板实战、类视图 、类视图的好处 、类视图使用场景、基于调度方法的类视图】(四)
👏作者简介：大家好，我是爱敲代码的小王，CSDN博客博主,Python小白 📕系列专栏：python入门到实战、Python爬虫开发、Python办公自动化、Python数据分析、Python前后端开发 📧如果文章知识点有错误…...
对于前端模块化的理解与总结（很全乎）
目录 模块化的好处 模块化的commonJS导入导出 暴露(导出)模块：module.exports value或exports.xxx value 导入模块——使用 es6模块化 方法一逐个导出 方法二默认导出 方法三 方法四 方法五 export 和import 同时存在 多个文件导出到一个文件后在相关文件…...
NewStarCTF 2022 web方向题解 wp
----------WEEK1---------- BUU NewStarCTF 公开赛赛道 WEEK1 [NotPHP] 先看题目，要传参加绕过。 分析一下代码：首先get一个datadata://test/plain,Wel…。然后key1和2用数组可以绕过。num2077a可以绕过弱类型。eval()中的php语句被#注释了，…...
WebGL矩阵变换库
目录 矩阵变换库： Matrix4对象所支持的方法和属性如表所示： 方法属性规范： 虽然平移、旋转、缩放等变换操作都可以用一个44的矩阵表示，但是在写WebGL程序的时候，手动计算每个矩阵很耗费时间。为了简化编程…...
block层：8. deadline调度器
deadline 源码基于5.10 0. 私有数据 struct deadline_data {/** run time data*//** requests (deadline_rq s) are present on both sort_list and fifo_list*/struct rb_root sort_list[2];struct list_head fifo_list[2];/** next in sort order. read, write or both ar…...
DTO，VO，PO的意义与他们之间的转换
DTO（Data Transfer Object）：数据传输对象，这个概念来源于J2EE的设计模式，原来的目的是为了EJB的分布式应用提供粗粒度的数据实体，以减少分布式调用的次数，从而提高分布式调用的性能和降低网络负…...
Java 集合框架2
一、关于set接口的常用类 1.HashSet类 用来处理无序的单列数据，没有重复的元素,重复的元素算一个 i.构造方法 //HashSet类是set接口的子类，是无序的单列数据，没有重复的元素，重复的元素算一个 //HashSet的构造方法 //HashSet() …...
2024王道408数据结构P144 T16
2024王道408数据结构P144 T16 思考过程 首先看题目，要求我们把二叉树的叶子结点求出来并且用链表的方式存储，链接时用叶结点的右指针来存放单链表指针。我们很清楚可以看出来能用中序遍历递归的方式实现，因为第一个叶子结点在整棵树的最左下…...
【ARM Coresight 系列文章 22 -- linux frace 与 trace-cmd】
文章目录 ftrace 介绍trace-cmd 介绍trace-cmd 常用跟踪事件ftrace 与 trace-cmd 关系ftrace 编译依赖 ftrace 介绍 ftrace 是 Linux 内核中的一个跟踪工具，主要用于帮助开发者分析和调试内核的行为。ftrace 的名字来源于 “function tracer”，它最初是…...
MyBatis的一级缓存和二级缓存是怎么样的？
目录 1. 一级缓存 2. 一级缓存失效的几种情况 3. 二级缓存 4.二级缓存失效的情况 5. 二级缓存的相关配置 6. 缓存的查询顺序 MyBatis 的缓存共分为一级缓存和二级缓存。 1. 一级缓存 一级缓存是 SqlSession 级别的，通过同一个 SqlSession 查询到的数据会被缓…...
下载的文件被Windows 11 安全中心自动删除
今天从CSDN上下载了自己曾经上传的文件，但是浏览器下载完之后文件被Windows安全中心自动删除，说是带病毒。实际是没有病毒的，再说了即便有病毒也不应该直接删除啊，至少给用户一个保留或删除的选项。 研究了一番，可以暂…...
【Java List与数组】List＜T＞数组和数组List＜T＞的区别（124）
List数组：存储List的数组，即：数组中的元素是：List； 数组List：存储数组的List，即：List中的数据是类型的数组； 测试案例： import java.util.ArrayList; impor…...
Nuxt 菜鸟入门学习笔记四：静态资源
文章目录 public 目录assets 目录全局样式导入 Nuxt 官网地址： https://nuxt.com/ Nuxt 使用以下两个目录来处理 CSS、fonts 和图片等静态资源： public 目录 public 目录用作静态资产的公共服务器，可通过应用程序定义的 URL 公开获取。 换…...
C语言 - 结构体、结构体数组、结构体指针和结构体嵌套
结构体的意义 问题：学籍管理需要每个学生的下列数据：学号、姓名、性别、年龄、分数，请用 C 语言程序存储并处理一组学生的学籍。 单个学生学籍的数据结构： 学号（num）： int 型姓名（…...
python安装playwright问题记录
python安装playwright这个时候,有得时候会https timeout 有的时候会 not found。 我最后使用的方法三，挺好用的。 PyPI The Python Package Index 可以尝试使用的方法 1. 更换pip源：使用国内的pip源可以提高下载速度并减少超时问题。例如，…...
关于gRPC微服务利弊之谈
gRPC微服务架构包括以下几个主要组件： 服务定义：定义服务的接口和消息格式，使用Protocol Buffers或其他的消息格式进行描述。服务实现：实现定义的服务接口和消息处理逻辑。服务器端实现：在服务器端，需要实…...
【Terraform学习】使用 Terraform创建Lambda函数启动EC2（Terraform-AWS最佳实战学习）
本站以分享各种运维经验和运维所需要的技能为主 《python》：python零基础入门学习 《shell》：shell学习 《terraform》持续更新中：terraform_Aws学习零基础入门到最佳实战 《k8》暂未更新 《docker学习》暂未更新 《ceph学习》ceph日常问题解…...
Mac软件删除方法？如何删除不会有残留
Mac电脑如果有太多无用的应用程序，很有可能会拖垮Mac系统的运行速度。因此，卸载电脑中无用的软件是优化Mac系统运行速度的最佳方式之一。Mac卸载应用程序的方式是和Windows有很大的区别，特别对于Mac新用户来说，如何无残留的卸载删…...
编程之道：【性能优化】提高软件效率的实际建议和避免常见陷阱
在今天的数字化世界中，软件性能是应用程序成功的关键之一。无论是网页加载速度、移动应用的响应时间还是后端服务器的处理速度，性能都直接影响着用户满意度。在追求高性能时，开发人员需要采取一系列实际建议，同时避免常见的陷阱。…...
VGG的结构:视觉几何组（Visual Geometry Group）
目录 1. VGG 的结构 2. VGG 的网络细节 3. VGG 的代码实现 1. VGG 的结构 牛津大学的视觉几何组（Visual Geometry Group）设计了 VGGNet(也称为 VGG)，一种经典的卷积神经网络 (CNN) 架构。在 2014 年 ILSVRC 分类任务中，VGG 取…...
VBA：按照Excel工作表中的名称列自动汇总多个工作薄中对应sheet中所需要的数据
需求如下： B列为产品名为合并单元格，C列为供应商名，G、H列为金额数据；数据源放在同一个文件夹内，B列产品名来源于工作薄名称中间的字符串，C列供应商名来源于工作薄中的sheet名；G、H列金额数据来…...
Mybatis1.9 批量删除
1.9 批量删除 1.9.1 编写接口方法1.9.2 编写SQL语句1.9.3 编写测试方法 如上图所示，用户可以选择多条数据，然后点击上面的 删除 按钮，就会删除数据库中对应的多行数据。 1.9.1 编写接口方法 在 BrandMapper 接口中定义删除多行数据的方法。…...
CUDA小白 - NPP(2) -图像处理-算数和逻辑操作(2)
cuda小白 原始API链接 NPP GPU架构近些年也有不少的变化，具体的可以参考别的博主的介绍，都比较详细。还有一些cuda中的专有名词的含义，可以参考《详解CUDA的Context、Stream、Warp、SM、SP、Kernel、Block、Grid》 常见的NppStatus…...
python+redis实现布隆过滤器（含redis5.0版本以上和5.0以下版本的两份代码）
布隆过滤器是一种空间效率极高的概率数据结构，用于测试一个元素是否是集合的成员。如果布隆过滤器返回 False，则元素绝对不在集合中。如果返回 True，则元素可能在集合中，但也可能是一个误报。布隆过滤器利用了多个不同的哈希函数对…...
SpringBoot Thymeleaf iText7 生成 PDF（2023/08/29）
SpringBoot Thymeleaf iText7 生成 PDF（2023/08/29） 文章目录 SpringBoot Thymeleaf iText7 生成 PDF（2023/08/29）1. 前言2. 技术思路3. 实现过程4. 测试 1. 前言 近期在项目种遇到了实时生成复杂 PDF 的需求，经过一番…...
【核磁共振成像】并行采集MRI
目录 一、并行成像二、SENSE重建三、SMASH重建四、灵敏度校准五、AUTO-SMASH和VD-AUTO-SMASH六、GRAPPA重建七、SPACE RIP重建算法八、PILS重建算法九、PRUNO重建算法十、UNFOLD算法 一、并行成像 并行MR成像(pMRI):相位阵列接受线圈不但各有自己专用的接受通道，而且…...
深度图相关评测网站
文章目录 1 单目/Stereo相关测评网站介绍12 单目/Stereo相关测评网站介绍23 单目/Stereo相关测评网站介绍3 1 单目/Stereo相关测评网站介绍1 https://vision.middlebury.edu/stereo/eval3/ 2 单目/Stereo相关测评网站介绍2 http://www.cvlibs.net/datasets/kitti/eval_stereo…...
本地部署 CodeLlama 并在 VSCode 中使用 CodeLlama
本地部署 CodeLlama 并在 VSCode 中使用 CodeLlama 1. CodeLlama 是什么2. CodeLlama Github 地址3. 下载 CodeLlama 模型4. 部署 CodeLlama5. 在 VSCode 中使用 CodeLlama6. 使用WSGI启动服务7. 创建 start.sh 启动脚本 1. CodeLlama 是什么 Code Llama 是一个基于 Llama 2 的…...
Agilent33220A任意波形发生器
20MHz正弦波和方波脉冲、斜披、三角波，噪声和直流波形14-bit,50MSa/s，64K点任意波形AM、FM、PM、FSK和PWM凋制线性和对数扫描及脉冲串模式10mVpp至10Vpp幅苗范围图形化界面可以对信号设置进行可视化验证通过USB、GPIB和LAN连接 性能优异的各种函数的波形…...
springboot第37集：kafka，mqtt，Netty，nginx，CentOS，Webpack
image.png binzookeeper-server-start.shconfigzookeeper.properties.png image.png image.png 消费 image.png image.png image.png image.png image.png image.png image.png image.png image.png Netty的优点有很多： API使用简单，学习成本低。功能强大…...
NVIDIA DLI 深度学习基础 答案 领取证书
最后一节作业是水果分类的任务，一共6类，使用之前学习的知识在代码段上进行填空。 加载ImageNet预训练的基础模型 from tensorflow import kerasbase_model keras.applications.VGG16(weights"imagenet",input_shape(224, 224, 3),include_t…...
axios模拟表单提交
axios默认是application/json方式提交，controller接收的时候必须以RequestBody的方式接收，有时候不太方便。如果axios以application/x-www-form-urlencoded方式提交数据，controller接收的时候只要保证名字应对类型正确即可。 前端代码&#…...
智安网络|探索物联网架构：构建连接物体与数字世界的桥梁
物联网是指通过互联网将各种物理设备与传感器连接在一起，实现相互通信和数据交换的网络系统。物联网架构是实现这一连接的基础和框架，它允许物体与数字世界之间的互动和协作。 一、物联网架构的概述 物联网架构是一种分层结构，它将物联网系…...
胡歌深夜发文：我对不起好多人
胡歌的微博又上了热搜。 8月29日01:18分，胡歌微博发文称：“我尽量保持冷静，我对不起好多人，我希望对得起这短暂的一生”，并配了一张自己胡子拉碴的图，右眼的伤疤清晰可见。 不少网友留言称“哥你又喝多了吗…...
C++二级题
数字放大 #include<iostream> #include<string.h> #include<stdio.h> #include<iomanip> #include<cmath> #include<bits/stdc.h> int a[2000][2000]; int b[2000]; char c[2000]; long long n; using namespace std; int main() {cin>…...
NetApp AFF A900：适用于数据中心的超级产品
NetApp AFF A900：适用于数据中心的超级产品 AFF A 系列中的 AFF A900 高端 NVMe 闪存存储功能强大、安全可靠、具有故障恢复能力，提供您为任务关键型企业级应用程序提供动力并保持数据始终可用且安全所需的一切。 产品功能与特性 AFF A900：…...
入海排污口水质自动监测系统，助力把好入河入海“闸门”
随着经济社会的不断发展，污水的排放强度不断加大，大量的污水排入河流、湖泊和海洋中，造成了水体污染，严重影响着我国的用水安全、公众健康、经济发展与社会稳定。入河入海排污口是污染物进入河流和海洋的最后关口，也是…...