2025web寒假作业二
一、整体功能概述
该代码构建了一个简单的后台管理系统界面，主要包含左侧导航栏和右侧内容区域。左侧导航栏有 logo、管理员头像、导航菜单和安全退出按钮；右侧内容区域包括页头、用户信息管理内容（含搜索框和用户数据表格）以及页脚。
二、demo01后台管理系统.html
1. 文档结构
-
采用标准的 HTML5 文档结构，包含
<!DOCTYPE html>声明。 -
头部（
<head>）部分设置了字符编码、视口信息，引入了外部 CSS 文件。 -
主体（
<body>）部分包含一个大容器<div id="container">，将页面分为左右两部分。
2. 左侧导航区域
-
logo 部分：通过
<div class="logo">展示系统 logo 图片和名称。 -
管理员信息：使用
<div class="header-img">显示管理员头像和姓名。 -
导航菜单：利用无序列表
<ul class="nav">列出多个导航项，如首页、系统设置等。 -
安全退出：
<div class="exit">提供安全退出功能入口。
3. 右侧内容区域
-
页头：包含 “收起菜单” 按钮、系统名称和管理员姓名。
-
内容主体：
-
标题：<h2> 显示 “用户信息管理”。
-
搜索框：提供账号和邮箱输入框以及搜索按钮。
-
数据表格：通过
<div class="tb-title">和多个<div class="tb-content">展示用户数据，包含 ID、账号、密码等列。
-
-
页脚：显示版权信息。
4. 存在的问题
- “收起菜单” 使用的是
<span>标签，无法实现交互功能，应改为<label>标签并结合隐藏的<input type="checkbox">来实现菜单收起展开效果。 search-box中的lable拼写错误，应为label。
三、CSS 文件分析
1. style.css
- 全局样式设置：使用通配符
*将所有元素的外边距和内边距设置为 0，并采用box-sizing: border-box盒模型，确保元素的宽度和高度包含内边距和边框。 html和body元素：将高度和宽度设置为 100%，为页面布局提供基础。
2. demo01.css
- 布局相关：
#container：使用display: flex实现左右布局，宽度为 100%，高度为视口高度。.left和.right：分别设置左侧导航栏和右侧内容区域的样式，左侧固定宽度 200px，右侧使用flex: 1占据剩余空间。
- 样式细节：
- 各个部分（如 logo、导航项、搜索框、表格等）都有详细的样式设置，包括背景颜色、字体大小、边框等。
- 部分元素（如导航项、操作按钮）设置了
:hover伪类，实现鼠标悬停效果。
代码效果：
相关文章：
2025web寒假作业二
一、整体功能概述 该代码构建了一个简单的后台管理系统界面，主要包含左侧导航栏和右侧内容区域。左侧导航栏有 logo、管理员头像、导航菜单和安全退出按钮；右侧内容区域包括页头、用户信息管理内容（含搜索框和用户数据表格）以及页…...
三、OSG学习笔记-应用基础
前一章节：二、OSG学习笔记-入门开发-CSDN博客https://blog.csdn.net/weixin_36323170/article/details/145513874 一、 OsgGA: 界面事件处理空间，处理操作各种操作器的最大名字空间； GUIEventHandler: ui 事件操作类 注意：在启…...
CTFHub-RCE系列wp
目录标题 引言什么是RCE漏洞 eval执行文件包含文件包含php://input读取源代码远程包含 命令注入无过滤过滤cat过滤空格过滤目录分隔符过滤运算符综合过滤练习 引言 题目共有如下类型 什么是RCE漏洞 RCE漏洞，全称是Remote Code Execution漏洞，翻译成中文…...
Linux ping不通百度但浏览器可以打开百度的的解决方法
问题描述：使用ping命令ping www.baidu.com,提示的地址为ipv6地址，但该地址ping不通，但使用浏览器直接打开百度网址可以打开。 问题可能的原因：（1）虚拟机上ipv6为自动模式，影响了ipv4寻址&#…...
Redis中的某一热点数据缓存过期了，此时有大量请求访问怎么办?
1、提前设置热点数据永不过期 2、分布式中用redis分布式锁（锁可以在多个 JVM 实例之间协调）、单体中用synchronized（锁只在同一个 JVM 内有效） 编写服务类 import com.redisson.api.RLock; import com.redisson.api.RedissonCli…...
低成本+高性能+超灵活！Deepseek 671B+Milvus重新定义知识库搭建
“老板说，这个项目得上Deepseek,还得再做个知识库...” 还有哪个开发者，最近没听到这样的抱怨？ Deepseek爆火，推理端的智能提速，算力成本急剧下降，让不少原本不想用大模型，用不起大模型的企业&a…...
TCP服务器与客户端搭建
一、思维导图 二、给代码添加链表 【server.c】 #include <stdio.h> #include <sys/socket.h> #include <sys/types.h> #include <fcntl.h> #include <arpa/inet.h> #include <unistd.h> #include <stdlib.h> #include <string.…...
PDF 文件的安全功能概述
由于安全问题始终存在，我们希望重点介绍 PDF 文件格式提供的一些安全功能。如果您希望控制或限制用户可以执行的操作，这些功能可以启用。本文将介绍可以阻止哪些类型的操作，以及可以实施哪些不同的身份验证技术来提高 PDF 的安全性。 可以控制…...
在Linux上部署Jenkins的详细指南
引言 在当今快速迭代的软件开发环境中，持续集成和持续交付（CI/CD）变得越来越重要。Jenkins作为一个开源自动化服务器，能够帮助开发者更高效地进行代码集成、测试和部署。本文将详细介绍如何在Linux系统上安装和配置Jenkins。 准…...
碳纤维复合材料制造的六西格玛管理实践：破解高端制造良率困局的实战密码
碳纤维复合材料制造的六西格玛管理实践：破解高端制造良率困局的实战密码 在全球碳中和与高端制造升级的双重驱动下，碳纤维复合材料行业正经历前爆发式增长。航空航天、新能源汽车、风电叶片等领域对碳纤维产品的性能稳定性提出近乎苛刻的要求࿰…...
Day83：图形的绘制
Python 提供了多种绘图工具，其中最常用的是 Turtle（海龟绘图）和 Matplotlib（数据可视化）。今天，我们主要介绍 Turtle，它可以轻松绘制各种几何图形、艺术图案和动画。 1. Turtle 库简介 Turtle 是 Python 内置的绘图工具，主要用于教学、趣味绘画和简单图形的创建。 基…...
C# Dll嵌入到.exe
将dll属性作为 嵌入的资源 修改引用属性为不复制 增加dll识别来源 AppDomain.CurrentDomain.AssemblyResolve new ResolveEventHandler(CurrentDomain_AssemblyResolve);private static System.Reflection.Assembly CurrentDomain_AssemblyResolve(object sender, Reso…...
o3-mini、Gemini 2 Flash、Sonnet 3.5 与 DeepSeek 在 Cursor 上的对决
最新的 OpenAI 模型 o3-mini 已于 1 月 31 日（星期五）发布，并已在 Cursor 上架。不久后，Gemini 2 Flash 也会陆续登场。 上周，对 DeepSeek V3、DeepSeek R1 以及 Claude 3.5 Sonnet 做过类似测试。那次测试结果显示&am…...
如何在Vscode中接入Deepseek
一、获取Deepseek APIKEY 首先，登录Deepseek官网的开放平台：DeepSeek 选择API开放平台，然后登录Deepseek后台。 点击左侧菜单栏“API keys”，并创建API key。 需要注意的是，生成API key复制保存到本地，丢失…...
6 maven工具的使用、maven项目中使用日志
文章目录 前言一、maven：一款管理和构建java项目的工具1 基本概念2 maven的安装与配置（1）maven的安装（2）IDEA集成Maven配置当前项目工程设置 maven全局设置 （3）创建一个maven项目 3 pom.xml文件…...
Day82：创建图形界面（GUI）
在 Python 中，我们可以使用 Tkinter（标准 GUI 库）来创建图形用户界面（GUI）。Tkinter 提供了一系列工具和控件，使开发者可以轻松地创建窗口、按钮、输入框等界面组件。 1. Tkinter 简介 Tkinter 是 Python 内置的 GUI 库，使用它可以创建窗口应用程序，而无需安装额外的库…...
字节跳动大模型应用 Go 开发框架 —— Eino 实践
前言 开发基于大模型的软件应用，就像指挥一支足球队：组件是能力各异的队员，编排是灵活多变的战术，数据是流转的足球。Eino 是字节跳动开源的大模型应用开发框架，拥有稳定的内核，灵活的扩展性，完…...
【Golang学习之旅】Go + MySQL 数据库操作详解
文章目录 前言1. GORM简介2. 安装GORM并连接MySQL2.1 安装GORM和MySQL驱动2.2 连接MySQL 3. GORM数据模型（Model）3.1 定义User结构体3.2 自动迁移（AutoMigrate） 4. GORM CRUD 操作4.1 插入数据（Create）4.2 …...
Http 的响应码有哪些？ 分别代表的是什么？
HTTP 状态码分为多个类别，下面是常见的 HTTP 状态码及其含义，包括 3xx 重定向状态码的详细区别： 📌 HTTP 状态码分类 分类状态码范围说明1xx100-199信息性状态码，表示请求已被接收，继续处理2xx200-299成功…...
深入解析 Linux 系统中 Cron 定时任务的配置与管理
在 Linux 和类 Unix 系统中，cron 是一个非常强大的工具，用于定时执行各种任务，例如自动备份、定时运行脚本和定期清理日志文件。通过合理配置 cron，你可以让很多系统维护任务自动化，从而减轻日常管理的压力。而 cronta…...
手把手教你为WCH CH582移植CherryUSB主机栈（基于RT-Thread，含中断优化）
基于RT-Thread的WCH CH582 USB主机协议栈深度移植指南在嵌入式开发领域，USB主机功能的实现往往意味着设备能够直接连接各类USB外设，从简单的键盘鼠标到复杂的存储设备。对于使用WCH CH582这类RISC-V内核MCU的开发者而言，原厂SDK提供的USB主机…...
从社交关系到分子结构：图解GCN（图卷积网络）到底在‘看’什么？
从社交关系到分子结构：图解GCN（图卷积网络）到底在‘看’什么？想象一下，你刚搬到一个新社区，想快速了解周围的邻居。最直接的方式是什么？不是挨家挨户敲门，而是通过社区活动认识几位关…...
Agent开发面试通关攻略：吃透稳拿offer
阅读前置：2026年当下最卷也最缺人的AI岗位，一定是AI Agent开发。最近刷遍CSDN、牛客、力扣最新面经，发现一个非常明显的招聘趋势：普通大模型微调岗位饱和内卷，而AI Agent开发岗位人才严重缺口，薪资更高、竞…...
开发转兼职DBA（二）：执行计划教我做事
开发转兼职DBA（二）：执行计划教我做事 查询慢了不知道为什么，加了索引还是慢，复合索引怎么建，执行计划怎么看——这些不是DBA的专利，是每个写SQL的开发者迟早要面对的事。 文章目录 开发转兼职DB…...
打不开JupyterLab
因为安装某些依赖导致JupyterLab的依赖被动升级或降级，从而影响了JupyterLab的运行，此时可以SSH登录到实例，然后输入jupyter-lab命令进行确认，如果执行命令报错则说明是此问题，那么可以通过pip install jupyterlab再次…...
手把手教你用Mind+和Blynk，让手机轻松遥控掌控板（含自建服务器避坑指南）
从零搭建物联网控制平台：Mind与Blynk深度整合实战 当你第一次尝试用手机控制硬件设备时，那种"隔空取物"的奇妙感总会让人兴奋不已。想象一下，躺在沙发上就能调节书桌上的智能台灯亮度，或者在外出时随时查看家中的温湿度…...
Performance-Fish：让你的《环世界》后期游戏帧率提升400%的终极优化方案
Performance-Fish：让你的《环世界》后期游戏帧率提升400%的终极优化方案 【免费下载链接】Performance-Fish Performance Mod for RimWorld 项目地址: https://gitcode.com/gh_mirrors/pe/Performance-Fish 你是否曾在《环世界》游戏后期，面对庞大…...
我们公司全员把 Cursor 换成了自研的 全开源AtomCode
【引子】这是一篇实录——一位 CTO 用 28 天,用 Claude GLM 双模型调度,造出了一个让全公司放弃 Cursor 的工具。然后我意识到我们正在经历的事情,比"换工具"大得多。【读者承诺】接下来 15 分钟,你会拿到三件东西:一个真实案例(28 天 1,146 commits 是怎么做出来的…...
从模糊到电影级景深：Midjourney + Topaz Gigapixel联调方案（含LUT预设包+PSD分层模板）
更多请点击： https://codechina.net 第一章：从模糊到电影级景深：Midjourney Topaz Gigapixel联调方案（含LUT预设包PSD分层模板） 当Midjourney生成的图像存在主体边缘柔化、背景层次缺失或分辨率不足等问题时…...
国内大学生常用的AI写作辅助平台有哪些？
国内高校学生常用的 AI 写作辅助平台，以本土化全流程工具为主，结合通用大模型与专项功能模块，覆盖选题构思、大纲搭建、初稿撰写、语言润色、降重处理、查重检测及格式排版等关键环节，以下是主流平台详解与对比： 一、本…...