web前端第八次作业---制作音乐榜单
制作音乐榜单
代码:
<!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"> <strong class="color">1</strong> 不重逢</div><div class="box2"> <strong class="color">2</strong> 温暖的房子</div><div class="box1"> <strong class="color">3</strong> 永不熄灭的火焰</div><div class="box2"> 4 怪诞心理学</div><div class="box1"> 5 不重逢</div><div class="box2"> 6 不重逢</div><div class="box1"> 7 不重逢</div><div class="box2"> 8 不重逢</div><div class="box1"> 9 不重逢</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…...
心脏扩散张量成像中的异常值检测:射击拒绝还是稳健拟合?|文献速递-视觉大模型医疗图像应用
Title 题目 Outlier detection in cardiac diffusion tensor imaging: Shot rejection or robust fitting? 心脏扩散张量成像中的异常值检测:射击拒绝还是稳健拟合? 01 文献速递介绍 心脏扩散张量成像(Cardiac Diffusion Tensor Imagin…...
Linux Kernel 之十 详解 PREEMPT_RT、Xenomai 的架构、源码、构建及使用
概述 现在的 RTOS 基本可以分为 Linux 阵营和非 Linux 阵营这两大阵营。非 Linux 阵营的各大 RTOS 都是独立发展,使用上也相对独立;而 Linux 阵营则有多种不同的实现方法来改造 Linux 以实现实时性要求。本文我们重点关注 Linux 阵营的实时内核实现方法! 本文我们重点关注 …...
RabbitMQ-消息消费确认
我们一般使用的是消费者作为被动方接收 RabbitMQ 推送消息,另一种是消费者作为主动方可以主动拉取消息。 RabbitMq 服务器推送消息分为隐式(自动)确认和显示确认。 1 消费者拉取消息 消费者作为主动方拉取消息,每次只能获取一条。 using (var channel c…...
E10.【C语言】练习:编写一个猜数字游戏
目录 1.规则 2.准备 3.游戏代码 1.规则 1.程序生成1-100间的随机数 2.用户猜数字 猜对了:游戏结束 猜错了:程序会告知猜大了或猜小了,继续进行游戏,直到猜对 3.游戏可以一直玩除非退出游戏 2.准备 1.框架:循…...
RK3568-rk809rtc休眠唤醒
参考链接 https://www.360doc.cn/article/71858349_1119199262.html修改驱动drivers/mfd/rk808.c static void rk817_shutdown_prepare(void) { int ret; …...
【Uniapp-Vue3】pages.json页面路由globalStyle的属性
项目的全局配置在pages.json中。 一、导航栏设置 二、下拉刷新设置 下拉就可以看到设置的样式 三、上拉触底 这个页面中,向下滑动页面到底部就会输出“到底了” 现在将触底距离设置为500 走到半路就会输出“到底了”...
NHANES数据挖掘|特征变量对死亡率预测的研究设计与分析
书接上回,应各位临床或在科室的小伙伴们需求,除了多组学和算法开发外,插播关于临床护理方向的数据挖掘,今天分享两篇NHANES的分析文献。 1、时依中介分析 DOI: 10.1186/s12933-024-02191-5 整体思路 基于 NHANES 数据…...
【Sharding-JDBC学习】概述_shardingsphere-jdbc 和sharding-jdbc
1.概述 1.1.分库分表是什么 小明是一家初创电商平台的开发人员,他负责卖家模块的功能开发,其中涉及了店铺、商品的相关业务,设计如下 数据库: 通过以下SQL能够获取到商品相关的店铺信息、地理区域信息: SELECT p.*…...
用户登录/登出功能,当登录页面在另一域名下
需求: 要求为某网址增加用户登录功能。登录页面是现成的,但是位于另一个域名。当request 没带token ,要求跳转此登录页面,用户登录后会返回token. 此时再跳回原网址。这个过程如何避免发生跨域问题? 最简单的方案 登…...
自动化解决方案:修复devicedisplaystatusmanager.dll丢失
在Windows操作系统中,DLL(动态链接库)文件扮演着至关重要的角色。它们为应用程序提供必要的函数和数据,以确保系统的平稳运行。然而,有时我们可能会遇到DLL文件丢失或损坏的问题,比如DeviceDisplayStatusMa…...
.Net8 Avalonia跨平台UI框架——<vlc:VideoView>控件播放海康监控、摄像机视频(Windows / Linux)
一、UI效果 二、新建用户控件:VideoViewControl.axaml 需引用:VideoLAN.LibVLC.Windows包 Linux平台需安装:VLC 和 LibVLC (sudo apt-get update、sudo apt-get install vlc libvlccore-dev libvlc-dev) .axaml 代码 注…...
网络协议(八):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 首部校验和…...
深度解析 pytest 参数化与 --count 执行顺序的奥秘
有这样一个业务场景,登录不同地区的账号,重复500遍,以验证登录功能是否正常。 登录的代码如下,其中login_data是一个fixture,用来组织数据: pytest.mark.parametrize("login_data", [cn_test, …...
【traefik】forwadAuth中间件跨namespace请求的问题
前情提要 - fowardAuth鉴权中间件的使用: 【traefik】使用forwardAuth中间件做网关层的全局鉴权 1. 问题 我的 traefik-ingress-controller 所在 namespace: traefik 业务服务所在 namespace: apps 路由与 forwardAuth 中间件配置如下: # 路由 apiV…...
java学习记录16
并发基础 进程与线程 进程 进程(Process)是计算机中正在运行的程序。程序是一种静态的概念,而进程是程序在执行过程中创建的动态实体。每个进程都有自己的内存空间、代码、数据和资源,它也是操作系统进行任务调度和资源分配的基…...
【Lua学习之旅】之单行/多行注释
Lua的注释 单行注释多行注释 单行注释 lua中的单行注释采用两个短横线"--" --这是lua单行注释多行注释 写法一: --[[ 这个lua的多行注释, 很多资料说多行注释不可以嵌套, 根据我的测试,这种写法的多行注释在lua54版…...
[Effective C++]条款45 运用成员函数模板接受所有兼容类型
本文初发于 “天目中云的小站”,同步转载于此。 条款45 : 运用成员函数模板接受所有兼容类型 本条款中我们将会以智能指针为例, 介绍如何通过成员函数模板使一个模板类可以接受所有兼容类型. 我们先来构建一个简单的继承体系 : class Top { ... }; class Middle: p…...
Harry技术添加存储(minio、aliyun oss)、短信sms(aliyun、模拟)、邮件发送等功能
Harry技术添加存储(minio、aliyun oss)、短信sms(aliyun、模拟)、邮件发送等功能 基于SpringBoot3Vue3前后端分离的Java快速开发框架 项目简介:基于 JDK 17、Spring Boot 3、Spring Security 6、JWT、Redis、Mybatis-P…...
【python基础——异常BUG】
什么是异常(BUG) 检测到错误,py编译器无法继续执行,反而出现错误提示 如果遇到错误能继续执行,那么就捕获(try) 1.得到异常:try的执行,try内只可以捕获一个异常 2.预案执行:except后面的语句 3.传入异常:except … as uestcprint(uestc) 4.没有异常:else… 5.鉴定完毕,收尾的语…...
AI-调查研究-01-正念冥想有用吗?对健康的影响及科学指南
点一下关注吧!!!非常感谢!!持续更新!!! 🚀 AI篇持续更新中!(长期更新) 目前2025年06月05日更新到: AI炼丹日志-28 - Aud…...
基于FPGA的PID算法学习———实现PID比例控制算法
基于FPGA的PID算法学习 前言一、PID算法分析二、PID仿真分析1. PID代码2.PI代码3.P代码4.顶层5.测试文件6.仿真波形 总结 前言 学习内容:参考网站: PID算法控制 PID即:Proportional(比例)、Integral(积分&…...
实现弹窗随键盘上移居中
实现弹窗随键盘上移的核心思路 在Android中,可以通过监听键盘的显示和隐藏事件,动态调整弹窗的位置。关键点在于获取键盘高度,并计算剩余屏幕空间以重新定位弹窗。 // 在Activity或Fragment中设置键盘监听 val rootView findViewById<V…...
Swagger和OpenApi的前世今生
Swagger与OpenAPI的关系演进是API标准化进程中的重要篇章,二者共同塑造了现代RESTful API的开发范式。 本期就扒一扒其技术演进的关键节点与核心逻辑: 🔄 一、起源与初创期:Swagger的诞生(2010-2014) 核心…...
Rapidio门铃消息FIFO溢出机制
关于RapidIO门铃消息FIFO的溢出机制及其与中断抖动的关系,以下是深入解析: 门铃FIFO溢出的本质 在RapidIO系统中,门铃消息FIFO是硬件控制器内部的缓冲区,用于临时存储接收到的门铃消息(Doorbell Message)。…...
蓝桥杯3498 01串的熵
问题描述 对于一个长度为 23333333的 01 串, 如果其信息熵为 11625907.5798, 且 0 出现次数比 1 少, 那么这个 01 串中 0 出现了多少次? #include<iostream> #include<cmath> using namespace std;int n 23333333;int main() {//枚举 0 出现的次数//因…...
使用Matplotlib创建炫酷的3D散点图:数据可视化的新维度
文章目录 基础实现代码代码解析进阶技巧1. 自定义点的大小和颜色2. 添加图例和样式美化3. 真实数据应用示例实用技巧与注意事项完整示例(带样式)应用场景在数据科学和可视化领域,三维图形能为我们提供更丰富的数据洞察。本文将手把手教你如何使用Python的Matplotlib库创建引…...
Mysql中select查询语句的执行过程
目录 1、介绍 1.1、组件介绍 1.2、Sql执行顺序 2、执行流程 2.1. 连接与认证 2.2. 查询缓存 2.3. 语法解析(Parser) 2.4、执行sql 1. 预处理(Preprocessor) 2. 查询优化器(Optimizer) 3. 执行器…...
毫米波雷达基础理论(3D+4D)
3D、4D毫米波雷达基础知识及厂商选型 PreView : https://mp.weixin.qq.com/s/bQkju4r6med7I3TBGJI_bQ 1. FMCW毫米波雷达基础知识 主要参考博文: 一文入门汽车毫米波雷达基本原理 :https://mp.weixin.qq.com/s/_EN7A5lKcz2Eh8dLnjE19w 毫米波雷达基础…...
python爬虫——气象数据爬取
一、导入库与全局配置 python 运行 import json import datetime import time import requests from sqlalchemy import create_engine import csv import pandas as pd作用: 引入数据解析、网络请求、时间处理、数据库操作等所需库。requests:发送 …...
