当前位置： 首页 > news >正文

web前端第八次作业---制作音乐榜单

news 2026/4/4 10:56:31

制作音乐榜单

代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.box_big{width: 1200px;height: 400px;border: 0px solid red;width: auto;}.box_small{width: 150px;height: 150px;box-shadow: -10px 10px 10px rgb(37, 36, 36);}ol,ul{list-style: none;/*  list-style: none 去掉ol(有序列表)ul(无序列表)前面的点*/}.box{width: 240px;height: 150px;border: 0px solid red;margin: auto;padding: 25px;background-color: rgba(230, 230, 239, 0.973);}.box1{width: 288px;height: 35px;border: 0px solid rgb(9, 240, 82);margin: auto; background-color: rgb(210, 211, 214);}.box2{width: 288px;height: 35px;border: 0px solid rgb(51, 9, 240);margin: auto; background-color: rgba(230, 230, 239, 0.973);}.box3{width: 85px;height: 45px;border: 0px solid red;}.bsb{width: 85px;height: 100px;border: 0px solid green;float: right;/*右浮动*/margin:0px 0px 0px 3.5px ;}.color{color: brown;}</style>
</head>
<body><div class="box_big"><div class="box"><img class="box_small" src="https://p3.music.126.net/DrRIg6CrgDfVLEph9SNh7w==/18696095720518497.jpg"><div class="bsb"><p></p><strong>飙升榜</strong><img class="box3" src="/img/微信截图_20250114014228.png"></div></div><div class="box1">&nbsp;<strong class="color">1</strong>&nbsp;不重逢</div><div class="box2">&nbsp;<strong class="color">2</strong>&nbsp;温暖的房子</div><div class="box1">&nbsp;<strong class="color">3</strong>&nbsp;永不熄灭的火焰</div><div class="box2">&nbsp;4&nbsp;怪诞心理学</div><div class="box1">&nbsp;5&nbsp;不重逢</div><div class="box2">&nbsp;6&nbsp;不重逢</div><div class="box1">&nbsp;7&nbsp;不重逢</div><div class="box2">&nbsp;8&nbsp;不重逢</div><div class="box1">&nbsp;9&nbsp;不重逢</div></div></body>
</html>

运行结果:

相关文章：

web前端第八次作业---制作音乐榜单

制作音乐榜单 代码: <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Document</title><s…...

编程日记 2025/1/15 5:13:45

心脏扩散张量成像中的异常值检测：射击拒绝还是稳健拟合？|文献速递-视觉大模型医疗图像应用

Title 题目 Outlier detection in cardiac diffusion tensor imaging: Shot rejection or robust fitting? 心脏扩散张量成像中的异常值检测&#xff1a;射击拒绝还是稳健拟合&#xff1f; 01 文献速递介绍 心脏扩散张量成像&#xff08;Cardiac Diffusion Tensor Imagin…...

编程日记 2025/1/15 5:12:38

Linux Kernel 之十 详解 PREEMPT_RT、Xenomai 的架构、源码、构建及使用

概述 现在的 RTOS 基本可以分为 Linux 阵营和非 Linux 阵营这两大阵营。非 Linux 阵营的各大 RTOS 都是独立发展，使用上也相对独立；而 Linux 阵营则有多种不同的实现方法来改造 Linux 以实现实时性要求。本文我们重点关注 Linux 阵营的实时内核实现方法！ 本文我们重点关注 …...

编程日记 2025/1/15 5:11:35

RabbitMQ-消息消费确认

我们一般使用的是消费者作为被动方接收 RabbitMQ 推送消息&#xff0c;另一种是消费者作为主动方可以主动拉取消息。 RabbitMq 服务器推送消息分为隐式(自动)确认和显示确认。 1 消费者拉取消息 消费者作为主动方拉取消息&#xff0c;每次只能获取一条。 using (var channel c…...

编程日记 2025/1/15 5:10:31

E10.【C语言】练习：编写一个猜数字游戏

目录 1.规则 2.准备 3.游戏代码 1.规则 1.程序生成1-100间的随机数 2.用户猜数字 猜对了&#xff1a;游戏结束 猜错了&#xff1a;程序会告知猜大了或猜小了&#xff0c;继续进行游戏&#xff0c;直到猜对 3.游戏可以一直玩除非退出游戏 2.准备 1.框架&#xff1a;循…...

编程日记 2025/1/15 5:09:28

RK3568-rk809rtc休眠唤醒

参考链接 https://www.360doc.cn/article/71858349_1119199262.html修改驱动drivers/mfd/rk808.c static void rk817_shutdown_prepare(void) { int ret; …...

编程日记 2025/1/15 5:07:25

【Uniapp-Vue3】pages.json页面路由globalStyle的属性

项目的全局配置在pages.json中。 一、导航栏设置 二、下拉刷新设置 下拉就可以看到设置的样式 三、上拉触底 这个页面中&#xff0c;向下滑动页面到底部就会输出“到底了” 现在将触底距离设置为500 走到半路就会输出“到底了”...

编程日记 2025/1/15 5:06:23

NHANES数据挖掘｜特征变量对死亡率预测的研究设计与分析

书接上回&#xff0c;应各位临床或在科室的小伙伴们需求&#xff0c;除了多组学和算法开发外&#xff0c;插播关于临床护理方向的数据挖掘&#xff0c;今天分享两篇NHANES的分析文献。 1、时依中介分析 DOI&#xff1a; 10.1186/s12933-024-02191-5 整体思路 基于 NHANES 数据…...

编程日记 2025/1/15 5:05:22

【Sharding-JDBC学习】概述_shardingsphere-jdbc 和sharding-jdbc

1.概述 1.1.分库分表是什么 小明是一家初创电商平台的开发人员&#xff0c;他负责卖家模块的功能开发&#xff0c;其中涉及了店铺、商品的相关业务&#xff0c;设计如下 数据库&#xff1a; 通过以下SQL能够获取到商品相关的店铺信息、地理区域信息&#xff1a; SELECT p.*…...

编程日记 2025/1/15 5:04:21

用户登录/登出功能，当登录页面在另一域名下

需求&#xff1a; 要求为某网址增加用户登录功能。登录页面是现成的&#xff0c;但是位于另一个域名。当request 没带token &#xff0c;要求跳转此登录页面&#xff0c;用户登录后会返回token. 此时再跳回原网址。这个过程如何避免发生跨域问题&#xff1f; 最简单的方案 登…...

编程日记 2025/1/15 5:03:20

自动化解决方案：修复devicedisplaystatusmanager.dll丢失

在Windows操作系统中&#xff0c;DLL&#xff08;动态链接库&#xff09;文件扮演着至关重要的角色。它们为应用程序提供必要的函数和数据&#xff0c;以确保系统的平稳运行。然而&#xff0c;有时我们可能会遇到DLL文件丢失或损坏的问题&#xff0c;比如DeviceDisplayStatusMa…...

编程日记 2025/1/15 5:02:18

.Net8 Avalonia跨平台UI框架——＜vlc:VideoView＞控件播放海康监控、摄像机视频(Windows / Linux)

一、UI效果 二、新建用户控件&#xff1a;VideoViewControl.axaml 需引用&#xff1a;VideoLAN.LibVLC.Windows包 Linux平台需安装&#xff1a;VLC 和 LibVLC &#xff08;sudo apt-get update、sudo apt-get install vlc libvlccore-dev libvlc-dev&#xff09; .axaml 代码 注…...

编程日记 2025/1/15 5:01:13

网络协议（八）：IP 协议

目录 1. IP 协议简介 2. 首部属性 2.1 版本号 2.2 首部长度 2.3 服务类型 2.4 总长度 2.5 > 16位标识 & 3位标志 & 13位片偏移 2.5.1 > 16 位标识 2.5.2 > 3 位标志 2.5.3 > 13 位片偏移 2.6 生存时间(TTL) 2.7 > 8 位协议 2.8 首部校验和…...

编程日记 2025/1/15 5:00:11

深度解析 pytest 参数化与 --count 执行顺序的奥秘

有这样一个业务场景&#xff0c;登录不同地区的账号&#xff0c;重复500遍&#xff0c;以验证登录功能是否正常。 登录的代码如下&#xff0c;其中login_data是一个fixture&#xff0c;用来组织数据&#xff1a; pytest.mark.parametrize("login_data", [cn_test, …...

编程日记 2025/1/15 4:59:10

【traefik】forwadAuth中间件跨namespace请求的问题

前情提要 - fowardAuth鉴权中间件的使用&#xff1a; 【traefik】使用forwardAuth中间件做网关层的全局鉴权 1. 问题 我的 traefik-ingress-controller 所在 namespace: traefik 业务服务所在 namespace: apps 路由与 forwardAuth 中间件配置如下&#xff1a; # 路由 apiV…...

编程日记 2025/1/15 4:58:08

java学习记录16

并发基础 进程与线程 进程 进程&#xff08;Process&#xff09;是计算机中正在运行的程序。程序是一种静态的概念&#xff0c;而进程是程序在执行过程中创建的动态实体。每个进程都有自己的内存空间、代码、数据和资源&#xff0c;它也是操作系统进行任务调度和资源分配的基…...

编程日记 2025/1/15 4:52:02

【Lua学习之旅】之单行/多行注释

Lua的注释 单行注释多行注释 单行注释 lua中的单行注释采用两个短横线"--" --这是lua单行注释多行注释 写法一&#xff1a; --[[ 这个lua的多行注释&#xff0c; 很多资料说多行注释不可以嵌套&#xff0c; 根据我的测试&#xff0c;这种写法的多行注释在lua54版…...

编程日记 2025/1/15 4:47:56

[Effective C++]条款45 运用成员函数模板接受所有兼容类型

本文初发于 “天目中云的小站”&#xff0c;同步转载于此。 条款45 : 运用成员函数模板接受所有兼容类型 本条款中我们将会以智能指针为例, 介绍如何通过成员函数模板使一个模板类可以接受所有兼容类型. 我们先来构建一个简单的继承体系 : class Top { ... }; class Middle: p…...

编程日记 2025/1/15 4:41:46

Harry技术添加存储（minio、aliyun oss）、短信sms（aliyun、模拟）、邮件发送等功能

Harry技术添加存储&#xff08;minio、aliyun oss&#xff09;、短信sms&#xff08;aliyun、模拟&#xff09;、邮件发送等功能 基于SpringBoot3Vue3前后端分离的Java快速开发框架 项目简介&#xff1a;基于 JDK 17、Spring Boot 3、Spring Security 6、JWT、Redis、Mybatis-P…...

编程日记 2025/1/15 4:40:45

【python基础——异常BUG】

什么是异常(BUG) 检测到错误,py编译器无法继续执行,反而出现错误提示 如果遇到错误能继续执行,那么就捕获(try) 1.得到异常:try的执行,try内只可以捕获一个异常 2.预案执行:except后面的语句 3.传入异常:except … as uestcprint(uestc) 4.没有异常:else… 5.鉴定完毕,收尾的语…...

编程日记 2025/1/15 4:33:36

深度解析：OpenClaw集成MiniMax 2.1遭遇HTTP 401？三步定位+架构级解决方案

–## 一、问题现象与背景 在2026年开源AI智能体工具百花齐放的今天&#xff0c;OpenClaw&#xff08;前身为Clawdbot/Moltbot&#xff09;凭借"本地优先、多平台兼容、高度可定制"的核心优势&#xff0c;成为开发者构建专属AI助手的首选框架。然而&#xff0c;当许多…...

编程新知 2026/4/4 10:33:32

零侵入、极简适配！飞桨CINN实现类CUDA硬件“即插即用”

简介继飞桨框架3.1版本推出“插件式 CUDA兼容类硬件接入方案”&#xff08;飞桨实现插件式硬件图接入方案&#xff0c;模型推理加速2.2倍&#xff09;&#xff0c;实现运行时&#xff08;Runtime&#xff09;与算子&#xff08;Kernel&#xff09;的高效复用后&#xff0c;飞桨…...

编程新知 2026/4/4 10:23:29

Navicat试用期无限重置完全指南：4个创新方法解决14天限制

Navicat试用期无限重置完全指南&#xff1a;4个创新方法解决14天限制 【免费下载链接】navicat_reset_mac navicat mac版无限重置试用期脚本 Navicat Mac Version Unlimited Trial Reset Script 项目地址: https://gitcode.com/gh_mirrors/na/navicat_reset_mac 作为数据…...

编程新知 2026/4/4 10:09:25

仲景GPT：首个中医大语言模型如何革新传统医学诊疗？[特殊字符]

仲景GPT&#xff1a;首个中医大语言模型如何革新传统医学诊疗&#xff1f;&#x1f680; 【免费下载链接】CMLM-ZhongJing 首个中医大语言模型——“仲景”。受古代中医学巨匠张仲景深邃智慧启迪&#xff0c;专为传统中医领域打造的预训练大语言模型。 The first-ever Traditio…...

编程新知 2026/4/4 9:55:09

SEO_中小企业必备的快速见效SEO优化解决办法

SEO: 中小企业必备的快速见效SEO优化解决办法 在当前竞争激烈的市场环境中&#xff0c;中小企业如何迅速提升在搜索引擎上的曝光率&#xff0c;成为每个企业家关注的焦点。搜索引擎优化&#xff08;SEO&#xff09;不仅能帮助企业吸引更多潜在客户&#xff0c;还能显著提高网站…...

编程新知 2026/4/4 9:45:06

SetDPI：Windows多显示器DPI缩放终极解决方案

SetDPI&#xff1a;Windows多显示器DPI缩放终极解决方案 【免费下载链接】SetDPI 项目地址: https://gitcode.com/gh_mirrors/se/SetDPI 关键词&#xff1a;Windows DPI缩放&#xff0c;多显示器显示设置&#xff0c;DPI精准控制&#xff0c;显示器缩放工具&#xff0c…...

编程新知 2026/4/4 9:22:55

Qwen2.5-14B-Instruct实战部署：像素剧本圣殿8-Bit Pro版本CUDA加速实测报告

Qwen2.5-14B-Instruct实战部署&#xff1a;像素剧本圣殿8-Bit Pro版本CUDA加速实测报告 1. 项目概览 像素剧本圣殿&#xff08;Pixel Script Temple&#xff09;是一款基于Qwen2.5-14B-Instruct深度微调的专业剧本创作工具。这款工具将先进的大语言模型推理能力与独特的8-Bit…...

编程新知 2026/4/4 8:36:36

城通网盘终极下载加速指南：三步解锁高速通道的完整教程

城通网盘终极下载加速指南&#xff1a;三步解锁高速通道的完整教程 【免费下载链接】ctfileGet 获取城通网盘一次性直连地址 项目地址: https://gitcode.com/gh_mirrors/ct/ctfileGet 还在为城通网盘下载速度慢如蜗牛而烦恼吗&#xff1f;每天都有无数用户因为城通网盘的…...

编程新知 2026/4/4 8:34:35

零基础5分钟部署AI股票分析师：Ollama本地大模型一键生成专业报告

零基础5分钟部署AI股票分析师&#xff1a;Ollama本地大模型一键生成专业报告 1. 为什么你需要一个本地AI股票分析师 在金融投资领域&#xff0c;及时获取专业分析报告是做出明智决策的关键。但传统方式存在几个痛点&#xff1a; 数据隐私问题&#xff1a;使用在线分析工具需…...

编程新知 2026/4/4 7:09:49

寻音捉影·侠客行从零开始：基于ModelScope FunASR的私有化语音检索实践

寻音捉影侠客行&#xff1a;从零开始基于ModelScope FunASR的私有化语音检索实践 1. 什么是“寻音捉影侠客行”&#xff1f; 在信息爆炸的时代&#xff0c;我们每天面对大量语音内容——会议录音、课程回放、采访素材、客服对话……但想从中快速找到一句关键话&#xff0c;却…...

编程新知 2026/4/4 5:45:08