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

HTML5学习系列之项目实战1

HTML5学习系列之项目实战1

  • 前言
  • 代码
  • 记录问题
  • 总结


前言

学习记录


代码

<div id="player"><audio id="musicbox"></audio><div id="controls" class="clearfix controls"><div id="play" class="playing"></div><div id="next"></div><div id="progress"><div></div><p id="time">00:00/00:00</p></div><div id="volume"><div></div></div></div><div class="bar"><button>重置列表</button><button>随机打乱</button><button>清空列表</button></div><ul id="musiclist"></ul><div class="bar buttom"><span>播放模式:</span><span id="mode">全部</span></div>
</div>

在这里插入图片描述

记录问题

  • 对于<div>必须搭配</div>,不能投简单去改成<div xxxx />,否则会出问题。
  • 在本阶段涉及到css与JavaScript,很多还不太懂,后续应下载对应的编译器进行编译。

总结

学习记录。
后续学习到css与JavaScript再继续扩充吧!

相关文章:

HTML5学习系列之项目实战1

HTML5学习系列之项目实战1 前言代码记录问题总结 前言 学习记录 代码 <div id"player"><audio id"musicbox"></audio><div id"controls" class"clearfix controls"><div id"play" class"…...

git 提交成了LFS格式,如何恢复

平常习惯使用sourceTree提交代码&#xff0c;某次打开时弹出了一个【是否要使用LFS提交】的确认弹窗&#xff0c;当时不知道LFS是什么就点了确认&#xff0c;后续提交时代码全变成了这个样子 因为是初始化的项目首次提交&#xff0c;将近四百个文件全被格式化成了这个样子&…...

【ISP图像处理】Demosaic去马赛克概念介绍以及相关方法整理

1. 基本定义 使用彩色滤光器阵列(CFA)的数码相机需要一个去马赛克程序来形成完整的RGB图像。一般的相机传感器都是采用彩色滤光片阵列(CFA)放置在光感测单元上&#xff0c;在每个像素处仅捕获三种原色成分中的一种。 去马赛克方法主要关注于复原非常规区域&#xff0c;比如边缘…...

单图像3D重建AI算法综述【2023】

计算机视觉是人工智能的一个快速发展的领域&#xff0c;特别是在 3D 领域。 本概述将考虑一个应用任务&#xff1a;2D 和 3D 环境之间的转换。 在线工具推荐&#xff1a; Three.js AI纹理开发包 - YOLO合成数据生成器 - GLTF/GLB在线编辑 - 3D模型格式在线转换 - 可编程3D场景编…...

three.js相机调用reset方法复原但无法完全复原

目录 一、问题 二、原因 三、总结 一、问题 需求&#xff1a;经过多次旋转、平移等变换后&#xff0c;希望恢复到初次渲染的角度、位置。结果发现&#xff1a; three.js oribtControls调用 一次reset方法 无法完全复原;需要多次调用后才能复原。 this.orbitControls.reset…...

前端为什么要工程化

前端为什么要工程化 文章目录 前端为什么要工程化传统开发的弊端一个常见的案例更多问题 工程化带来的优势开发层面的优势团队协作的优势统一的项目结构统一的代码风格可复用的模块和组件代码健壮性有保障团队开发效率高 求职竞争上的优势 现在前端的工作与以前的前端开发已经完…...

软件测试/测试开发/人工智能丨视觉与图像识别自动化测试

视觉与图像识别在软件自动化测试领域中的应用是越来越重要的一项技术&#xff0c;它使得测试可以更全面、准确地模拟用户对图形用户界面&#xff08;GUI&#xff09;的交互。以下是视觉与图像识别在软件自动化测试中的主要应用&#xff1a; 1. 自动化 GUI 测试 视觉与图像识别…...

nvm的下载与使用

1.如果已经安装nodejs , 先卸载nodejs; 从控制面板中 卸载程序 卸载nodejs win r打开cmd ,管理员运行 where node 查看是否删除干净nodejs 2.下载nvm 从github 下载nvm , 下载nvm 3.nvm 和node安装路径最好写在同一个路径下 &#xff0c;如D盘 ,D\a\nvm , D\a\nodejs 4.…...

拼多多官方开放平台接口app商品详情接口获取实时商品详情数据演示

拼多多开放平台提供了一种名为“商品详情接口”的API接口&#xff0c;它允许卖家从自己的系统中快速获取商品信息&#xff0c;如商品标题、描述、价格、库存等&#xff0c;并将这些信息展示在自己的店铺中。通过该接口&#xff0c;卖家可以更好地管理自己的商品库存和销售&…...

STM32F4系列单片机GPIO概述和寄存器分析

第2章 STM32-GPIO口 2.1 GPIO口概述 通用输入/输出口 2.1.1 GPIO口作用 GPIO是单片机与外界进行数据交流的窗口。 2.1.2 STM32的GPIO口 在51单片机中&#xff0c;IO口&#xff0c;以数字进行分组&#xff08;P0~P3&#xff09;&#xff0c;每一组里面又有8个IO口。 在ST…...

【LeetCode刷题】--9.回文数

9.回文数 class Solution {public boolean isPalindrome(int x) {if(x < 0){return false;}int tmp x, sum 0;boolean flag false;while(x ! 0){sum sum * 10 x % 10;x / 10;}if(sum tmp){flag true;}return flag;} }...

大数据-之LibrA数据库系统告警处理(ALM-12057 元数据未配置周期备份到第三方服务器的任务)

告警解释 系统安装完成后会检查元数据是否有周期备份到第三方服务器的任务&#xff0c;然后每1小时会检查一次。如果元数据未配置周期备份到第三方服务器的任务&#xff0c;将发送严重告警。 在用户创建元数据周期备份到第三方服务器的任务后&#xff0c;告警消除。 告警属性…...

毅速丨嫁接打印在模具制造中应用广泛

在模具行业中&#xff0c;3D打印随形水路已经被广泛认可&#xff0c;它可以提高冷却效率&#xff0c;从而提高产品良率。然而&#xff0c;全打印模具制造的成本相对较高&#xff0c;因为需要使用金属3D打印机和专用材料。为了节省打印成本&#xff0c;同时利用3D打印的优势&…...

『亚马逊云科技产品测评』活动征文|基于next.js搭建一个企业官网

『亚马逊云科技产品测评』活动征文&#xff5c;基于next.js搭建一个企业官网 授权声明&#xff1a;本篇文章授权活动官方亚马逊云科技文章转发、改写权&#xff0c;包括不限于在 Developer Centre, 知乎&#xff0c;自媒体平台&#xff0c;第三方开发者媒体等亚马逊云科技官方…...

C# Winform围棋棋盘

C# Winform简单的围棋棋盘vs2008winform小游戏C#vs2010winform棋盘C#窗体小游戏 这是一个简单的围棋棋盘小游戏&#xff0c;使用C# Winform编写棋盘界面&#xff0c;玩家可以在空白的交叉点上下棋子 项目获取&#xff1a; 项目获取&#xff1a;typora: typora/img (gitee.co…...

vue使用本地图片设置为默认图

一、引用 import imgSrc /assets/common/image/xxx.png 二、赋值给变量 defaultImg:imgSrc, 三、将变量给img标签 <img :src"defaultImg:imgSrc" alt"icon"> 注意&#xff1a;这里直接使用路径给变量是无法实现的哟...

day17-高速缓冲区的管理机制

1.目的 用户与磁盘进行文件交互时的流程 磁盘与高速缓冲区的关系 加深块设备驱动的理解 hash 循环链表 单链表的使用方法 2.高速缓冲区的工作流程 高速缓冲区中存储这对应的块设备驱动的数据 当从块设备中读取数据的时候&#xff0c;OS首先会从高速缓冲区中进行检索&#xff0…...

文心一言 VS 讯飞星火 VS chatgpt (139)-- 算法导论11.4 3题

三、用go语言&#xff0c;考虑一个采用均匀散列的开放寻址散列表。当装载因子为 3/4 和 7/8 时&#xff0c;试分别给出一次不成功查找和一次成功查找的探查期望数上界。 文心一言&#xff1a; 在开放寻址法中&#xff0c;当散列表的装载因子超过其阈值时&#xff0c;会触发重…...

Java 解压文件

maven库&#xff1a; <!--FileUtil、ZipUtil 依赖--> <dependency><groupId>cn.hutool</groupId><artifactId>hutool-all</artifactId><version>5.3.1</version> </dependency><!--IOUtils 依赖--> <depen…...

SASS/SCSS精华干货教程

目录 介绍 基本说明 特点 sass语法格式sass的语法格式一共有两种&#xff0c;一种是以".scss"作为拓展名&#xff0c;一种是以".sass"作为拓展名&#xff0c;这里我们只讲拓展名&#xff1a; 编译环境安装 Vscode安装编译插件 简单使用 sass语法扩张…...

React Native 导航系统实战(React Navigation)

导航系统实战&#xff08;React Navigation&#xff09; React Navigation 是 React Native 应用中最常用的导航库之一&#xff0c;它提供了多种导航模式&#xff0c;如堆栈导航&#xff08;Stack Navigator&#xff09;、标签导航&#xff08;Tab Navigator&#xff09;和抽屉…...

【Java学习笔记】Arrays类

Arrays 类 1. 导入包&#xff1a;import java.util.Arrays 2. 常用方法一览表 方法描述Arrays.toString()返回数组的字符串形式Arrays.sort()排序&#xff08;自然排序和定制排序&#xff09;Arrays.binarySearch()通过二分搜索法进行查找&#xff08;前提&#xff1a;数组是…...

centos 7 部署awstats 网站访问检测

一、基础环境准备&#xff08;两种安装方式都要做&#xff09; bash # 安装必要依赖 yum install -y httpd perl mod_perl perl-Time-HiRes perl-DateTime systemctl enable httpd # 设置 Apache 开机自启 systemctl start httpd # 启动 Apache二、安装 AWStats&#xff0…...

QT: `long long` 类型转换为 `QString` 2025.6.5

在 Qt 中&#xff0c;将 long long 类型转换为 QString 可以通过以下两种常用方法实现&#xff1a; 方法 1&#xff1a;使用 QString::number() 直接调用 QString 的静态方法 number()&#xff0c;将数值转换为字符串&#xff1a; long long value 1234567890123456789LL; …...

C++八股 —— 单例模式

文章目录 1. 基本概念2. 设计要点3. 实现方式4. 详解懒汉模式 1. 基本概念 线程安全&#xff08;Thread Safety&#xff09; 线程安全是指在多线程环境下&#xff0c;某个函数、类或代码片段能够被多个线程同时调用时&#xff0c;仍能保证数据的一致性和逻辑的正确性&#xf…...

在QWebEngineView上实现鼠标、触摸等事件捕获的解决方案

这个问题我看其他博主也写了&#xff0c;要么要会员、要么写的乱七八糟。这里我整理一下&#xff0c;把问题说清楚并且给出代码&#xff0c;拿去用就行&#xff0c;照着葫芦画瓢。 问题 在继承QWebEngineView后&#xff0c;重写mousePressEvent或event函数无法捕获鼠标按下事…...

C++课设:简易日历程序(支持传统节假日 + 二十四节气 + 个人纪念日管理)

名人说:路漫漫其修远兮,吾将上下而求索。—— 屈原《离骚》 创作者:Code_流苏(CSDN)(一个喜欢古诗词和编程的Coder😊) 专栏介绍:《编程项目实战》 目录 一、为什么要开发一个日历程序?1. 深入理解时间算法2. 练习面向对象设计3. 学习数据结构应用二、核心算法深度解析…...

免费数学几何作图web平台

光锐软件免费数学工具&#xff0c;maths,数学制图&#xff0c;数学作图&#xff0c;几何作图&#xff0c;几何&#xff0c;AR开发,AR教育,增强现实,软件公司,XR,MR,VR,虚拟仿真,虚拟现实,混合现实,教育科技产品,职业模拟培训,高保真VR场景,结构互动课件,元宇宙http://xaglare.c…...

华为OD最新机试真题-数组组成的最小数字-OD统一考试(B卷)

题目描述 给定一个整型数组,请从该数组中选择3个元素 组成最小数字并输出 (如果数组长度小于3,则选择数组中所有元素来组成最小数字)。 输入描述 行用半角逗号分割的字符串记录的整型数组,0<数组长度<= 100,0<整数的取值范围<= 10000。 输出描述 由3个元素组成…...

es6+和css3新增的特性有哪些

一&#xff1a;ECMAScript 新特性&#xff08;ES6&#xff09; ES6 (2015) - 革命性更新 1&#xff0c;记住的方法&#xff0c;从一个方法里面用到了哪些技术 1&#xff0c;let /const块级作用域声明2&#xff0c;**默认参数**&#xff1a;函数参数可以设置默认值。3&#x…...