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

2024-4-12-实战:商城首页(下)


个人主页:学习前端的小z
个人专栏:HTML5和CSS3悦读
本专栏旨在分享记录每日学习的前端知识和学习笔记的归纳总结,欢迎大家在评论区交流讨论!


文章目录

  • 作业
    • 小结

作业

在这里插入图片描述

.bg-backward {width: 60px; height: 60px;background: url('../images/css_sprites.png') -187px -10px;
}.bg-cart {width: 25px; height: 25px;background: url('../images/css_sprites.png') -10px -183px;
}.bg-envelope {width: 26px; height: 20px;background: url('../images/css_sprites.png') -10px -228px;
}.bg-dribble {width: 20px; height: 21px;background: url('../images/css_sprites.png') -267px -109px;
}.bg-facebook {width: 11px; height: 20px;background: url('../images/css_sprites.png') -10px -268px;
}.bg-forward {width: 60px; height: 60px;background: url('../images/css_sprites.png') -187px -90px;
}.bg-logo {width: 157px; height: 153px;background: url('../images/css_sprites.png') -10px -10px;
}.cart {width: 13px; height: 20px;background: url('../images/css_sprites.png') -267px -188px;
}.bg-msn {width: 16px; height: 16px;background: url('../images/css_sprites.png') -100px -228px;
}.bg-phone {width: 21px; height: 29px;background: url('../images/css_sprites.png') -267px -10px;
}.bg-rss {width: 16px; height: 16px;background: url('../images/css_sprites.png') -136px -228px;
}.bg-telephone {width: 18px; height: 30px;background: url('../images/css_sprites.png') -267px -59px;
}.bg-slider {width: 48px; height: 9px;background: url('../images/css_sprites.png') -55px -183px;
}.bg-vimeo {width: 21px; height: 18px;background: url('../images/css_sprites.png') -267px -150px;
}.bg-twitter {width: 24px; height: 16px;background: url('../images/css_sprites.png') -56px -228px;
}.bg-founder-team {width: 13px; height: 20px;background: url('../images/css_sprites.png') -267px -188px;
}.bg-dribble {width: 20px; height: 21px;background: url('../images/css_sprites2.png') -10px -10px;
}.bg-msn {width: 16px; height: 16px;background: url('../images/css_sprites2.png') -51px -51px;
}.bg-twitter {width: 24px; height: 16px;background: url('../images/css_sprites2.png') -50px -10px;
}.bg-vimeo {width: 21px; height: 18px;background: url('../images/css_sprites2.png') -10px -51px;
}.bg-facebook {width: 11px; height: 20px;background: url('../images/css_sprites2.png') -94px -46px;
}.bg-rss {width: 16px; height: 16px;background: url('../images/css_sprites2.png') -94px -10px;
}.bg-envelope {width: 26px; height: 20px;background: url('../images/css_sprites3.png') -51px -10px;
}.bg-phone {width: 21px; height: 29px;background: url('../images/css_sprites3.png') -10px -10px;
}.bg-telephone {width: 18px; height: 30px;background: url('../images/css_sprites3.png') -10px -59px;
}
* {margin: 0;padding: 0;
}body {font-family: "Microsoft YaHei", "Heiti SC", tahoma, arial, "Hiragino Sans GB", "宋体", sans-serif;
}a {color: white;text-decoration: none;
}ul {list-style: none;
}.auto-center {width: 1000px;margin-left: auto;margin-right: auto;
}.full-center {min-width: 1000px;
}.pull-left {float: left;
}.pull-right {float: right;
}.clearfix::after {content: '';display: block;clear: both;
}.text-ellipsis {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;
}.text-left {text-align: left;
}.text-right {text-align: right;
}

在这里插入图片描述

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><meta name="keywords" content="商城首页"><meta name="description" content="商城首页"><title>商城首页</title><link rel="stylesheet" href="./css/common.css"><link rel="stylesheet" href="./css/sprites.css"><style>.header, .copy{background-color: #2a2b2c;font-size: 14px;}.header .item {display: inline-block;line-height: 44px;margin-left: 40px;}.header .item>* {vertical-align: middle;}.header .icon {display: inline-block;}.banner {background-color: #35c3d9;}.banner>.auto-center {position: relative;height: 500px;}.banner .logo {width: 180px;height: 106px;background: url("./images/1.png") center / cover no-repeat;box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.1);}.banner .nav {box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.1);}.banner .nav a{display: inline-block;width: 103px;text-align: center;line-height: 106px;}.banner .nav>li {float: left;}.banner .clothes {position: absolute;bottom: 18px;left: 0;}.banner .title {position: absolute;width: 413px;bottom: 141px;right: 0;font-size: 60px;font-weight: normal;color: white;text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.4);text-align: center;}.banner .backward, .banner .forward{position: absolute;top: 50%;margin-top: -30px;}.banner .backward {left: -128px;}.banner .forward {right: -128px;}.big-title {margin-top: 30px;}.big-title>.pull-left {padding-left: 49px;font-weight: normal;color: #434343;font-size: 60px;}.big-title>.pull-right {width: 175px;line-height: 73px;background-color: #35c3d9;font-size: 60px;text-align: center;margin-right: 30px;}.category {margin-top: 30px;width: 1050px;font-size: 36px;color: #ffffff;}.category>.pull-left {position: relative;width: 300px;height: 150px;margin-left: 25px;margin-right: 25px;}.category>.pull-left>span {position: absolute;line-height: 40px;left: 24px;top: 50%;margin-top: -40px;}.products, .brands {margin-top: 50px;}.products .title, .brands .title{position: relative;padding-bottom: 26px;border-bottom: 1px solid #e5e4e4;font-size: 30px;color:#1e1e20;}.brands .title {border-bottom: none;}.products .title-btn,  .brands .title-btn{color: white;background-color: #35c4da;padding: 0 28px;margin-left: 30px;}.products h3 {font-size: inherit;}.products .bottom-icon {position: absolute;left: 0;bottom: -10px;width: 60px;height: 20px;background: #35c4da url(./images/6.png) center / 80% no-repeat;}.products .product-list {margin-top: 30px;width: 1068px;margin-left: -34px;font-size: 0;}.products .product-list>li {display: inline-block;width: 288px;margin: 0 34px 44px;font-size: 24px;border: 1px solid #e7e7e7;box-sizing: border-box;color: #858585;    }.products .img-box {padding: 19px 38px;border-bottom: 1px solid #e5e4e4;} .products .img-box > .img {display: block;height: 210px;background-color: black;}.products .desc {display: block;padding: 13px 16px 0;font-size: 24px;color: #858585;}.products .action {padding: 22px 21px 28px;}.products .price, .products .add-cart-btn {display: inline-block;vertical-align: middle;}.products .price {font-size: 30px;}.products .add-cart-btn {color: white;background-color: #35c4da;padding: 9px 6px;font-size: 18px;border-radius: 5px;}.fotter {box-shadow: 0px -3px 15px 0px rgba(0,0,0,0.1);margin-top: 65px;}.footer .column {float: left;padding-top: 34px;width: 250px;box-sizing: border-box;font-size: 13px;}.footer .title {font-size: 24px;color: #858585;line-height: 50px;}.footer .desc {padding: 10px 0;}.footer .icons {letter-spacing: 10px;}.footer .icons>span {display: inline-block;vertical-align: middle;}.footer .column {float: left;padding-top: 34px;width: 250px;box-sizing: border-box;font-size: 13px;   }.footer .title {font-size: 24px;color: #858585;line-height: 50px;}.footer .date-list>li {padding: 15px 0;border-bottom: 1px dashed #e5e4e4;}.footer .concat-list>li {line-height: 40px;}.footer .icon {display: inline-block;vertical-align: middle;}.footer .input-row {margin-top: 10px;}.footer .input {display: block;width: 100%;outline: none;border: none;line-height: 36px;font-size: 20px;padding-left: 18px;border-bottom: 1px solid #ccc;background-color: #fafafa;box-sizing: border-box;}.footer .submit {background-color: #35c4da;padding: 12px 38px;outline: none;border: none;color: white;}.bottom {display: inline-block;padding: 13px 13px 1px 4px;font-size: 14px;line-height: 50px;box-shadow: 0px 1px 0px 0px }.bottom>span {line-height: 13px;margin-right: 15px;}.copy {color:white;/* width: 1400px; *//* height: 27px; */}</style></head><body><div class="header full-center"><div><div class="auto-center"><div class="pull-right"><a class="item" href="#"><span>结账</span></a><a class="item" href="#"><span class="icon bg-founder-team"></span><span>我的账户</span></a><a class="item" href="#"><span class="icon bg-cart"></span><span>购物车(3)</span></a></div></div></div></div><div class="banner full-center"><div class="auto-center clearfix"><a class="logo pull-left" href="#"></a><ul class="nav pull-right clearfix"><li><a href="#">主页</a></li><li><a href="#">新闻</a></li><li><a href="#">产品</a></li><li><a href="#">特征</a></li><li><a href="#">联系人</a></li></ul><img class="clothes" src="./images/2.png"><h2 class="title">查看我们最新的时装</h2><img class="backward" src="./images/backward.png" height="60"><img class="forward" src="./images/forward.png" height="60"></div></div><div class="big-title auto-center clearfix"><h1 class="pull-left">查看我们独特的时尚</h1><a class="pull-right" href="#">方法</a></div><div class="category auto-center clearfix"><div class="pull-left" style="background: #35c3d9 url(./images/3.png) 90% center no-repeat;"><span>出售<br>60%</span></div><div class="pull-left" style="background: #91b900 url(./images/4.png) 90% center no-repeat;"><span>自由<br>航运的</span></div><div class="pull-left" style="background: #f356b3 url(./images/5.png) 90% center no-repeat;"><span>24/7<br>支持</span></div></div><div class="products auto-center"><div class="title"><h3><span>特色</span><span class="title-btn">商品</span></h3><div class="bottom-icon"></div></div><ul class="product-list"><li><div class="img-box"><div class="img"></div></div><a class="desc text-ellipsis" href="#">女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤</a><div  class="clearfix action"> <span class="price pull-left">¥35.99</span><span class="add-cart-btn pull-right">加入购物车</span></div></li><li><div class="img-box"><div class="img"></div></div><a class="desc text-ellipsis" href="#">女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤</a><div  class="clearfix action"> <span class="price pull-left">¥35.99</span><span class="add-cart-btn pull-right">加入购物车</span></div></li><li><div class="img-box"><div class="img"></div></div><a class="desc text-ellipsis" href="#">女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤</a><div  class="clearfix action"> <span class="price pull-left">¥35.99</span><span class="add-cart-btn pull-right">加入购物车</span></div></li></ul></div><div><div class="products auto-center"><div class="title"><h3><span>最新上架的</span><span class="title-btn">商品</span></h3><div class="bottom-icon"></div></div><ul class="product-list"><li><div class="img-box"><div class="img"></div></div><a class="desc text-ellipsis" href="#">女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤</a><div  class="clearfix action"> <span class="price pull-left">¥35.99</span><span class="add-cart-btn pull-right">加入购物车</span></div></li><li><div class="img-box"><div class="img"></div></div><a class="desc text-ellipsis" href="#">女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤</a><div  class="clearfix action"> <span class="price pull-left">¥35.99</span><span class="add-cart-btn pull-right">加入购物车</span></div></li><li><div class="img-box"><div class="img"></div></div><a class="desc text-ellipsis" href="#">女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤</a><div  class="clearfix action"> <span class="price pull-left">¥35.99</span><span class="add-cart-btn pull-right">加入购物车</span></div></li><li><div class="img-box"><div class="img"></div></div><a class="desc text-ellipsis" href="#">女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤</a><div  class="clearfix action"> <span class="price pull-left">¥35.99</span><span class="add-cart-btn pull-right">加入购物车</span></div></li><li><div class="img-box"><div class="img"></div></div><a class="desc text-ellipsis" href="#">女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤</a><div  class="clearfix action"> <span class="price pull-left">¥35.99</span><span class="add-cart-btn pull-right">加入购物车</span></div></li><li><div class="img-box"><div class="img"></div></div><a class="desc text-ellipsis" href="#">女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤</a><div  class="clearfix action"> <span class="price pull-left">¥35.99</span><span class="add-cart-btn pull-right">加入购物车</span></div></li><li><div class="img-box"><div class="img"></div></div><a class="desc text-ellipsis" href="#">女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤</a><div  class="clearfix action"> <span class="price pull-left">¥35.99</span><span class="add-cart-btn pull-right">加入购物车</span></div></li><li><div class="img-box"><div class="img"></div></div><a class="desc text-ellipsis" href="#">女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤女式T恤</a><div  class="clearfix action"> <span class="price pull-left">¥35.99</span><span class="add-cart-btn pull-right">加入购物车</span></div></li></ul></div><div class="brands auto-center"><div class="title"><h3><span>主要的</span><span class="title-btn">品牌</span></h3></div><div class="clearfix"><a class="pull-left" href="#"><img src="./images/brand1.png" height="131"></a><a class="pull-left" href="#"><img src="./images/brand2.png" height="131"></a><a class="pull-left" href="#"><img src="./images/brand3.png" height="131"></a><a class="pull-left" href="#"><img src="./images/brand4.png" height="131"></a><a class="pull-left" href="#"><img src="./images/brand5.png" height="131"></a><a class="pull-left" href="#"><img src="./images/brand6.png" height="131"></a></div></div><div class="footer full-center"><div class="auto-center clearfix"><div class="column"><h4 class="title">关于我们的点点滴滴</h4><p class="desc">但让我们想想。<br>没有一个生命是来自国外的精英儿童。<br>所以让他受苦吧。<br>他很荣幸能帮助他。</p><h4 class="title">跟着我们</h4><div class="icons"><span class="bg-facebook"></span><span class="bg-twitter"></span><span class="bg-rss"></span><span class="bg-vimeo"></span><span class="bg-dribble"></span><span class="bg-msn"></span></div></div><div class="column"><h4 class="title">档案</h4><ul class="date-list"><li>2012年3月</li><li>2012年3月</li><li>2012年3月</li><li>2012年3月</li></ul></div><div class="column"><h4 class="title">联系我们</h4><ul class="concat-list"><li><span class="icon bg-envelope"></span><span>info@premiumcoding.com</span></li><li><span class="icon bg-phone"></span><span>800 756 156</span></li><li><span class="icon bg-telephone"></span><span>+386408007561</span></li></ul></div><div class="column"><h4 class="title">签署新闻稿</h4><form action="#" method="post"><div class="input-row"><input class="input" type="text" name="name" placeholder="名字"></div><div class="input-row"><input class="input" type="text" name="email1" placeholder="电子邮件"></div><div class="input-row"><input class="submit" type="submit" value="订阅"></div></form></div></div></div><div class="copy full-center"><div class="auto-center clearfix"><div class= "bottom pull-right">Elegantica &copy;2012 by PremiumCoding | All Rights Reserved</div><div class= "bottom pull-left"><span>主页</span><span>投资组合</span><span>网站地图</span><span>联系人</span></div></div>           </div></body>
</html>

小结

从给定的一个ui设计图中,可以找到对应的一些css样式,主要利用布局思维将盒子一层层嵌套实现,还包括了定位、浮动以及精灵图。

相关文章:

2024-4-12-实战:商城首页(下)

个人主页&#xff1a;学习前端的小z 个人专栏&#xff1a;HTML5和CSS3悦读 本专栏旨在分享记录每日学习的前端知识和学习笔记的归纳总结&#xff0c;欢迎大家在评论区交流讨论&#xff01; 文章目录 作业小结 作业 .bg-backward {width: 60px; height: 60px;background: url(..…...

一、flask入门和视图

run启动参数 模板渲染 后端给前端页面传参 前端页面设置css from flask import Flask, render_template,jsonify# 创建flask对象 app Flask(__name__)# 视图函数 路由route app.route("/") def hello_world():# 响应&#xff0c;返回给前端的数据return "h…...

Selenium+Chrome Driver 爬取搜狐页面信息

进行selenium包和chromedriver驱动的安装 安装selenium包 在命令行或者anaconda prompt 中输入 pip install Selenium 安装 chromedriver 先查看chrome浏览器的版本 这里是 123.0.6312.106 版 然后在http://npm.taobao.org/mirrors/chromedriver/或者https://googlechrom…...

SpringBoot:一个注解就能帮你下载任意对象

介绍 下载功能应该是比较常见的功能了&#xff0c;虽然一个项目里面可能出现的不多&#xff0c;但是基本上每个项目都会有&#xff0c;而且有些下载功能其实还是比较繁杂的&#xff0c;倒不是难&#xff0c;而是麻烦。 所以结合之前的下载需求&#xff0c;我写了一个库来简化…...

oracle全量、增量备份

采用0221222增量备份策略,7天一个轮回 也就是周日0级备份&#xff0c;周1 2 4 5 6 采用2级增量备份&#xff0c;周3采用1级增量备份 打开控制文件自动备份 CONFIGURE CONTROLFILE AUTOBACKUP ON; 配置控制文件备份路径 CONFIGURE CONTROLFILE AUTOBACKUP FORMAT FOR DEVI…...

React Router 5 vs 6:使用上的主要差异与升级指南

React Router 5 的一些API 在 React Router 6 上有时可能找不到&#xff0c;可能会看到如下画面&#xff1a;export ‘useHistory’ was not found in ‘react-router-dom’ … React Router目前有两个大的版本&#xff0c;即React Router 5、6。React Router 6 在设计上更加简…...

基于LNMP部署wordpress

目录 一.环境准备 二.配置源并安装 三.配置Nginx 四.配置数据库 五.上传源码并替换 六.打开浏览器&#xff0c;输入虚拟机ip访问安装部署 七.扩展增加主题 一.环境准备 centos7虚拟机 关闭防火墙和seliunx stop firewalld #关闭防火墙 setenforce 0 …...

openGauss_5.1.0 企业版快速安装及数据库连接:单节点容器化安装

目录 &#x1f4da;第一章 官网信息&#x1f4da;第二章 安装&#x1f4d7;下载源码&#x1f4d7;下载安装包&#x1f4d7;修改版本&#x1f4d7;解压安装包&#x1f4d7;运行buildDockerImage.sh脚本&#x1f4d7;docker操作&#x1f4d5;查看docker镜像&#x1f4d5;启动dock…...

微信小程序 uniapp+vue城市公交线路查询系统dtjl3

小程序Android端运行软件 微信开发者工具/hbuiderx uni-app框架&#xff1a;使用Vue.js开发跨平台应用的前端框架&#xff0c;编写一套代码&#xff0c;可编译到Android、小程序等平台。 前端&#xff1a;HTML5,CSS3 VUE 后端&#xff1a;java(springbootssm)/python(flaskdja…...

2024年MathorCup数模竞赛B题问题一二三+部分代码分享

inputFolderPath E:\oracle\images\; outputFolderPath E:\oracle\process\; % 获取文件夹中所有图片的文件列表 imageFiles dir(fullfile(inputFolderPath, *.jpg)); % 设置colorbar范围阈值 threshold 120; % 遍历每个图片文件 for i 1:length(imageFiles) % 读…...

Ubuntu日常配置

目录 修改网络配置 xshell连不上怎么办 解析域名失败 永久修改DNS方法 临时修改DNS方法 修改网络配置 1、先ifconfig确认本机IP地址&#xff08;刚装的机子没有ifconfig&#xff0c;先apt install net-tools&#xff09; 2、22.04版本的ubuntu网络配置在netplan目录下&…...

GMSSL-通信

死磕GMSSL通信-C/C++系列(一) 最近再做国密通信的项目开发,以为国密也就简单的集成一个库就可以完事了,没想到能有这么多坑。遂写下文章,避免重复踩坑。以下国密通信的坑有以下场景 1、使用GMSSL guanzhi/GmSSL进行通信 2、使用加密套件SM2-WITH-SMS4-SM3 使用心得 ​…...

linux 磁盘分区Inode使用率达到100%,导致网站无法创建文件报错 failed:No space leftondevice(

linux 磁盘分区Inode使用率达到100%&#xff0c;导致网站无法创建文件报错 failed:No space left on device 由于这问题直接导致了&#xff0c;网站无法正常运行&#xff01; 提交工单求助阿里后&#xff0c;得到了答案&#xff01; 工程师先让我执行 df -h 和 df -i 通过分析…...

探索Python库的奇妙世界

探索Python库的奇妙世界 Python作为一种流行的编程语言&#xff0c;因其简洁的语法、强大的库支持和广泛的应用场景而备受开发者青睐。在这篇文章中&#xff0c;我们将深入探讨Python库的世界&#xff0c;了解它们如何帮助我们更高效地编写代码&#xff0c;并展示一些最有用的…...

SQL Server 存储函数(funGetId):唯一ID

系统测试时批量生成模拟数据&#xff0c;通过存储函数生成唯一ID。 根据当前时间生成唯一ID&#xff08;17位&#xff09; --自定义函数&#xff1a;根据当前时间组合成一个唯一ID字符串:yearmonthdayhourminutesecondmillisecond drop function funGetId;go--自定义函数&…...

当你的项目体积比较大?你如何做性能优化

在前端开发中&#xff0c;项目体积优化是一个重要的环节&#xff0c;它直接影响到网页的加载速度和用户体验。随着前端项目越来越复杂&#xff0c;引入的依赖也越来越多&#xff0c;如何有效地减少最终打包文件的大小&#xff0c;成为了前端工程师需要面对的挑战。以下是一些常…...

第6章:6.3.2 一张表总结正则表达式的语法 (MATLAB入门课程)

讲解视频&#xff1a;可以在bilibili搜索《MATLAB教程新手入门篇——数学建模清风主讲》。​ MATLAB教程新手入门篇&#xff08;数学建模清风主讲&#xff0c;适合零基础同学观看&#xff09;_哔哩哔哩_bilibili 本节我们用一张表来回顾和总结MATLAB正则表达式的基本语法。这个…...

VBA 实现outlook 当邮件设置category: red 即触发自动创建jira issue

1. 打开: Outlook VBA&#xff08;Visual Basic for Applications&#xff09; 方法一: 在邮件直接搜索:Visual Basic editor 方法二: File -> Options -> Customize Ribbon-> 打钩 如下图: 2.设置运行VBA 脚本: File -> Options -> Trust center -> Trus…...

办公软件巨头CCED、WPS迎来新挑战,新款办公软件已形成普及之势

办公软件巨头CCED、WPS的成长经历 CCED与WPS&#xff0c;这两者均是中国办公软件行业的佼佼者&#xff0c;为人们所熟知。 然而&#xff0c;它们的成功并非一蹴而就&#xff0c;而是经过了长时间的积累与沉淀。 CCED&#xff0c;这款中国大陆早期的文本编辑器&#xff0c;在上…...

架构设计-订单系统之订单系统的架构进化

1、单数据库架构 产品初期&#xff0c;技术团队的核心目标是&#xff1a;“快速实现产品需求&#xff0c;尽早对外提供服务”。 彼时的专车服务都连同一个 SQLServer 数据库&#xff0c;服务层已经按照业务领域做了一定程度的拆分。 这种架构非常简单&#xff0c;团队可以分开…...

性能升级,INDEMIND机器人AI Kit助力产业再蜕变

随着机器人进入到越来越多的生产生活场景中&#xff0c;作业任务和环境变得更加复杂&#xff0c;机器人需要更精准、更稳定、更智能、更灵敏的自主导航能力。 自主导航技术作为机器人技术的核心&#xff0c;虽然经过了多年发展&#xff0c;取得了长足进步&#xff0c;但在实践…...

2024年妈妈杯数学建模C题思路分析-物流网络分拣中心货量预测及人员排班

# 1 赛题 C 题 物流网络分拣中心货量预测及人员排班 电商物流网络在订单履约中由多个环节组成&#xff0c;图 ’ 是一个简化的物流 网络示意图。其中&#xff0c;分拣中心作为网络的中间环节&#xff0c;需要将包裹按照不同 流向进行分拣并发往下一个场地&#xff0c;最终使包裹…...

prometheus\skywalking\splunk功能的区别

Prometheus、SkyWalking和Splunk这三个工具在功能上各有特色&#xff0c;以下是它们各自的主要功能特点&#xff1a; Prometheus是一个开源的系统监控和警报工具。它的主要功能包括&#xff1a; 实时监控与警报&#xff1a;Prometheus可以实时监控各种指标&#xff0c;并根据…...

Harmony鸿蒙南向驱动开发-SPI接口使用

功能简介 SPI指串行外设接口&#xff08;Serial Peripheral Interface&#xff09;&#xff0c;是一种高速的&#xff0c;全双工&#xff0c;同步的通信总线。SPI是由Motorola公司开发&#xff0c;用于在主设备和从设备之间进行通信。 SPI接口定义了操作SPI设备的通用方法集合…...

芒果YOLOv7改进96:检测头篇DynamicHead动态检测头:即插即用|DynamicHead检测头,尺度感知、空间感知、任务感知

该专栏完整目录链接: 芒果YOLOv7深度改进教程 该创新点:在原始的Dynamic Head的基础上,对核心部位进行了二次的改进,在 原论文 《尺度感知、空间感知、任务感知》 的基础上,在 通道感知 的层级上进行了增强,关注每个像素点的比重。 在自己的数据集上改进,有效涨点就可以…...

独一无二:探索单例模式在现代编程中的奥秘与实践

设计模式在软件开发中扮演着至关重要的角色&#xff0c;它们是解决特定问题的经典方法。在众多设计模式中&#xff0c;单例模式因其独特的应用场景和简洁的实现而广受欢迎。本文将从多个角度详细介绍单例模式&#xff0c;帮助你理解它的定义、实现、应用以及潜在的限制。 1. 什…...

centos7 安装 rabbitmq3.8.5

1.首先安装 erlang 环境&#xff1a; curl -s https://packagecloud.io/install/repositories/rabbitmq/erlang/script.rpm.sh | sudo bash sudo yum install erlang-21.3.8.14-1.el7.x86_64 yum install socat -y 2.安装 rabbitmq https://github.com/rabbitmq/rabbitmq-s…...

利用SOCKS5代理和代理IP提升网络安全与匿名性

一、引言 随着网络技术的迅猛发展&#xff0c;数据安全和隐私保护已成为业界关注的热点。企业和个人用户越来越依赖于各种网络技术来保护敏感信息免受未授权访问。本文将探讨SOCKS5代理、代理IP以及HTTP协议在提升网络安全和匿名性方面的作用和实践应用。 二、基础技术概述 2.…...

C++list模拟实现

Clist模拟实现 list接口总结结点类的模拟实现迭代器的模拟实现迭代器模板参数迭代器类中的构造函数迭代器类中的运算符重载operator和operator - -operator&#xff01; 和operatoroperator*operator->总览 list 类构造函数拷贝构造函数赋值运算符重载operatorclear&#xf…...

设计模式(22):解释器模式

解释器 是一种不常用的设计模式用于描述如何构成一个简单的语言解释器&#xff0c;主要用于使用面向对象语言开发的解释器和解释器设计当我们需要开发一种新的语言时&#xff0c;可以考虑使用解释器模式尽量不要使用解释器模式&#xff0c;后期维护会有很大麻烦。在项目中&…...

廊坊智能模板建站/海南网站制作

D3.js力导向图(适用于其他类型图)中后添加元素遮盖已有元素的问题解决参考文章&#xff1a; &#xff08;1&#xff09;D3.js力导向图(适用于其他类型图)中后添加元素遮盖已有元素的问题解决 &#xff08;2&#xff09;https://www.cnblogs.com/lmou/p/10896801.html &#…...

虚拟机网站建设/单页网站seo如何优化

死信队列 DLX&#xff08;Dead-Letter-Exchange&#xff09;&#xff0c;可以称为死信交换器。当消息在一个队列中变成死信&#xff08;dead message&#xff09;之后&#xff0c;它能被重新发送到另一个交换器中&#xff0c;这个交换器就是DLX&#xff0c;绑定DLX的队列就称为…...

网站模板的缺点/免费网页设计制作网站

ShareSDK&#xff1b; 友盟&#xff1b; 百度分享&#xff1b; //支付宝支付 1&#xff0c;seller id&#xff1a; 2&#xff0c;partner id: 3&#xff0c;加密文件(公钥、私钥) 4&#xff0c;下载SDK&#xff08;网页版、无线版--支付宝论坛&#xff09; 5&#xff0c;scheme…...

国内专门做酒的网站/百度app下载

题目&#xff1a;Remove Nth Node From End of List 删除链表从尾部到头部第N的节点。 思路&#xff1a; 两个指针&#xff0c;一个从头开始前移N个节点后&#xff0c;第二个指针开始移动&#xff0c;当第一指针移动到末尾时&#xff0c;第二个指针指向的是从尾部到头部的第N个…...

建网站 北京/产品推广网站

今天我们讲讲利用sessionStorage来做数据字典的存储&#xff0c;不需要每个页面都要请求接口&#xff0c;获取字典值。老规矩先来了解一下什么是sessionStorage&#xff1f;sessionStorage用于本地存储一个会话(session)当中的数据&#xff0c;这些数据只有在同一个会话当中的页…...

设计网站用什么软件/电商seo是什么

/**弹性菜单 加了透视效果,类似滚动歌词的效果 *运动过程中,背景色和颜色都会改变,实现原理见 滚动歌词篇 * 小bug 当设置字体为 微软雅黑时,运动过程中菜单中的字体会有小抖动,修复方法,left值不能直接赋值,先存起来**/ 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.…...