HTML静态网页成品作业(HTML+CSS)——手机电子商城网页(4个页面)

🎉不定期分享源码,关注不丢失哦

文章目录

  • 一、作品介绍
  • 二、作品演示
  • 三、代码目录
  • 四、网站代码
    • HTML部分代码
  • 五、源码获取


一、作品介绍

🏷️本套采用HTML+CSS,未使用Javacsript代码,共有4个页面

二、作品演示

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码

<div class="nav"><div class="base"><div class="logo fl"><a href="index.html"><img src="./img/logo.png" height="55" alt=""></a></div><ul class="fr"><li><a href="index.html" class="this">首页</a></li><li><a href="detail.html">商品详情</a></li><li><a href="login.html">我要登录</a></li><li><a href="reg.html">我要注册</a></li></ul><div class="cl"></div></div></div><div class="banner"><div class="base"><img src="./img/1.png"></div></div><div class="prolist"><div class="protit">热卖专区</div><div class="probox"><div class="proi fl"><a href=""><img src="./img/p1.png"><div class="pro_name">Redmi Note 12T Pro</div><div class="pro_jiage">1999</div></a></div><div class="proi fl"><a href=""><img src="./img/p2.png"><div class="pro_name">Xiaomi 13 Ultra</div><div class="pro_jiage">5999</div></a></div><div class="proi fl"><a href=""><img src="./img/p3.png"><div class="pro_name">HUAWEI P60 Pro 8GB+256GB</div><div class="pro_jiage">6188</div></a></div><div class="proi fl"><a href=""><img src="./img/p4.png"><div class="pro_name">HUAWEI Pocket S 256GB</div><div class="pro_jiage">5488</div></a></div><div class="proi fl"><a href=""><img src="./img/p5.png"><div class="pro_name">vivo X Note 12GB+256GB</div><div class="pro_jiage">4999</div></a></div><div class="proi fl"><a href=""><img src="./img/p6.png"><div class="pro_name">vivo S17 Pro 12GB+512GB</div><div class="pro_jiage">3499</div></a></div></div>

五、源码获取

🥇 ~ 关注我,点赞博文~ 每天带你涨知识!
🎁1.看到这里了就[点赞+好评+收藏]三连 支持下吧,你的「点赞,好评,收藏」是我创作的动力。
💙2.想要获取本文源码,点击前往吧

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/355306.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【面试干货】抽象类与接口的区别

【面试干货】抽象类与接口的区别 &#x1f496;The Begin&#x1f496;点点关注&#xff0c;收藏不迷路&#x1f496; 在Java编程中&#xff0c;抽象类和接口是两个非常重要的概念&#xff0c;它们都为代码的可扩展性和复用性提供了基础。但是&#xff0c;它们之间也有一些明显…

linux精通 4.1

2.1.3 http服务器实现 目的 reactor应用——webserver webclient 每次上课前 看大纲down code 复习&#xff1a; 不行啊 编译给的代码报错啊 给的最新的不是0430那一版就不行啊 reactor.c:(.text0x254): relocation truncated to fit: R_X86_64_PC32 against symbol begin de…

基于微信共享充电桩小程序毕业设计作品成品(3)开发技术文档_充电桩小程序前端技术栈

后台管理系统文件 所在路径&#xff1a;后台源码ht目录是后台 绿色显示的是系统框架&#xff0c;不要动 位置程序名说明源码根目录login.php后台登录页面源码根目录check_u_login.php后台登录处理程序ht 后台根目录index.php后台首页left.php后台左侧菜单u_logout.php退出登…

【数据分析】用Python做事件抽取任务-快速上手方案

目录 方法一&#xff1a;使用OmniEvent库安装OmniEvent使用OmniEvent进行事件抽取OmniEvent优点缺点 方法二&#xff1a;使用大模型使用GPT网页版进行事件抽取事件类型列表 大模型优点缺点 总结 在自然语言处理&#xff08;NLP&#xff09;领域&#xff0c;事件抽取是一项关键任…

工程施工安全检测嵌入式解决方案

工程施工安全检测嵌入式解决方案 1 范围1.1 引言1.2 系统概述1.3 文档概述 2 工程施工安全检测系统应用场景2.1 作业操作安全检查2.2 受限空间作业安全检测2.3 应急设备操作行为检测2.4 动火作业安全检测 3 工程施工安全检测系统设计方案概述3.1 AI识别系统3.2 AI关键技术介绍3…

武汉工程大学24计算机考研数据,有学硕招收调剂,而专硕不招收调剂!

武汉工程大学是一所以工为主&#xff0c;覆盖工、理、管、经、文、法、艺术、医学、教育学等九大学科门类的多科性教学研究型大学&#xff0c;是湖北省重点建设高校、湖北省国内一流学科建设高校&#xff0c;入选卓越工程师教育培养计划、中西部高校基础能力建设工程、“新工科…

【计算机网络篇】数据链路层(11)在数据链路层扩展以太网

文章目录 &#x1f354;使用网桥在数据链路层扩展以太网&#x1f95a;网桥的主要结构和基本工作原理&#x1f388;网桥的主要结构&#x1f50e;网桥转发帧的例子&#x1f50e;网桥丢弃帧的例子&#x1f50e;网桥转发广播帧的例子 &#x1f95a;透明网桥&#x1f50e;透明网桥的…

深圳学区房断崖式跌价,3年跌去10万元,更可怕的还在后面

就在房市回暖之际&#xff0c;深圳的学区房却传来让人震惊的消息&#xff0c;深圳八卦岭有小区的房价三年时间从14万元每平方跌至4万元每平方&#xff0c;这对于当下的楼市无疑是重磅炸弹&#xff0c;对人们的购房行为将产生重要影响。 深圳这个受到关注的小区为一个宿舍小区&a…

【鸿蒙】HUAWEI DevEco Studio安装

HUAWEI DevEco Studio介绍 面向HarmonyOS应用及元服务开发者提供的集成开发环境(IDE)&#xff0c; 助力高效开发。 DevEco Studio当前最新版本是&#xff1a; 3.1。 DevEco Studio计划里程碑 版本类型说明 下载 下载网址&#xff1a;DevEco Studio安装包官⽅下载 双击运行…

数据结构—排序、查找、图论和字符串算法之Java实例

一&#xff1a;引言 在编程的海洋中&#xff0c;算法是程序员的灵魂之光。它们不仅指引着代码的前进方向&#xff0c;更能解决难题&#xff0c;提升效率。虽然各式各样的算法琳琅满目&#xff0c;但其中有一些却是每位程序员必定会遇到且应当深刻掌握的。本文将带您走进这些至…

信息打点-协议应用_内网资产_CDN_WAF_负载均衡_防火墙

服务信息获取-协议应用&内网资产 常见端口默认对应的服务&#xff1a; 特殊服务端口&#xff1a; 端口扫描工具&#xff1a; 旁注查询 旁注查询&#xff0c;又称为旁站查询或同服务器网站查询&#xff0c;是一种信息安全和网络侦查技术&#xff0c;主要用于发现与目标网站…

java实现一个LRU缓存算法。

//LRU&#xff08;Least Recently Used&#xff09;缓存算法是一种常见的缓存淘汰策略&#xff0c; // 它的基本思想是保留最近被访问过的数据&#xff0c;淘汰最久未被访问的数据。下面是一个使用Java实现的简单LRU缓存算法&#xff1a; import java.util.LinkedHashMap; impo…

电脑上使用备忘录怎么查看编辑时间?能显示时间的备忘录

在快节奏的生活中&#xff0c;很多人喜欢使用备忘录来记录日常事项和重要信息。备忘录不仅能帮助我们捕捉灵感&#xff0c;还能确保重要任务不被遗漏。然而&#xff0c;有时候我们需要知道某条记录的编辑时间&#xff0c;以便于回溯和整理信息。如果备忘录不能显示编辑时间&…

SpringBoot复习

第一章 SpringBoot开发入门 1.Springboot的优点。 ① 可快速构建独立的Spring应用。 ② 直接嵌入Tomcat、Jetty和Undertow服务器&#xff08;无须部署WAR文件&#xff09; ③ 通过依赖启动器简化构建配置 ④ 自动化配置Spring和第三方库 ⑤ 提供生产就绪功能 ⑥ 极少的代码生成…

【Mybatis-plus】查询及更新为null或空字符串

前言 查询为 null 或者 空字符串时&#xff0c;可以使用 or() 关键字。 提示&#xff1a;以下是本篇文章正文内容&#xff0c;下面案例可供参考 查询 使用 LambdaQueryWrapper 查询 parentCode 为 null 或者 空字符串 的数据。 LambdaQueryWrapper<CompanyEntity> qu…

视频集市新增支持多格式流媒体拉流预览

流媒体除了常用实时流外还有大部分是以文件的形式存在&#xff0c;做融合预览必须要考虑多种兼容性能力&#xff0c;借用现有的ffmpeg生态可以迅速实现多种格式的支持&#xff0c;现在我们将按需拉流预览功能进行了拓展&#xff0c;正式支持了ffmpeg的功能&#xff0c;可快捷方…

探索FlowUs息流:个人和团队知识管理解决方案|FlowUs稳定保障你的笔记安全无忧

FlowUs息流&#xff1a;稳定运营保障你的笔记安全无忧 在知识管理工具的选择上&#xff0c;稳定性是用户最关心的问题之一。FlowUs息流以其稳定的运营记录&#xff0c;为用户提供了一个可靠的工作环境。我们深知&#xff0c;一个知识管理平台的稳定性直接影响到团队的生产力和…

后端不提供文件流接口,前台js使用a标签实现当前表格数据(数组非blob数据)下载成Excel

前言&#xff1a;开发过程中遇到的一些业务场景&#xff0c;如果第三方不让使用&#xff0c;后端不提供接口&#xff0c;就只能拿到table数据(Array)&#xff0c;实现excel文件下载。 废话不多说&#xff0c;直接上代码&#xff0c;方法后续自行封装即可&#xff1a; functio…

Retrofit类型安全的HTTP客户端库

简介 Retrofit是Square公司开发的一个类型安全的HTTP客户端库&#xff0c;用于Android和Java平台&#xff0c;它使得与Web服务的交互变得更加简单快捷。Retrofit将HTTP API转换成Java接口&#xff0c;让你可以用更简洁的代码形式调用RESTful API&#xff0c;Android网络编程重点…

物联网设备安装相关知识整理

拓扑图 对于ADAM-4150先接设备的整体的供电。 ADAM-4150就涉及到几个电子元器件的连接&#xff0c;一个是485-232的转换器&#xff0c;一个是将RS-232转换为USB的转接口&#xff0c;因为现在的计算机很多都去掉了RS-232接口而使用USB接口。 4150右侧有个拨码&#xff0c;分别两…