移动Web学习04-移动端订单结算页PC端个人中心页面

5、电商结算页面案例

image-20240405171930209

css

body{
  background-color: #F2F2F2;
}
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.main{
  padding: 12px 11px 80px;
}

.pay{
  display: flex;
  height: 80px;
  background-color: #fff;
  bottom: 0;
  width: 100%;
  border-top: 1px solid #ededed;
  position: fixed;
  padding: 0 10px;
  /* 两边元素贴边 */
  justify-content: space-between;
  /* 沿侧轴居中对齐 */
  align-items: center;
}
.pay .pay-left{
  font-size: 12px;
  color: #1e1e1e;
}

.pay .pay-left span{
  color: #cf4444;
}

.pay .pay-left span i{
  font-size: 20px;
  font-style: normal;
  font-weight: 700px;
}
.pay .pay-right{
  width: 91px;
	height: 35px;
  text-align: center;
  line-height: 35px;
  color: #fff;
  background-image: linear-gradient(90deg, #6fc2aa 5%, #54b196 100%);
  border-radius: 3px;
}

.pay .pay-right a{
  width: 42px;
	height: 35px;
  font-size: 13px;
  color: #ffffff;
  line-height: 35px;
	font-family: MicrosoftYaHei;
  text-decoration: none;
  text-align: center;
	font-weight: normal;
	font-stretch: normal;
	letter-spacing: 0px;
}

.pannel{
  background-color: #fff;
  border-radius: 5px;
  margin-bottom: 10px;
}
.user_msg{
  display: flex;
  padding: 15px 0 15px 11px;
  align-items: center;
}

.user_msg .location{
  width: 30px;
  height: 30px;
  background-image: linear-gradient(90deg, 
		#6fc2aa 5%, 
		#54b196 100%);
    color: #fff;
    text-align: center;
    line-height: 30px;
    margin-right: 15px;
    border-radius: 50%;
}
.user{
 flex: 1;
}
.user .top{
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.user .top h5 {
    width: 55px;
    font-size: 15px;
    font-weight: 400;
}
.user .top p {
  font-size: 13px;
  margin-left: 15px;
}

.user .bottom{
  margin-top: 5px;
  font-size: 12px;
}
.more{
  width: 44px;
  height: 44px;
  /* background-color: #2ad1ff; */
  text-align: center;
  line-height: 44px;
  color: #808080;
  /* border: 1px solid #3a9cff; */
}

.product{
  padding: 11px 0px 11px  11px;
  display: flex;
  align-items: center;
}
.pic{
  width: 85px;
  height: 85px;
  /* background-color: pink;  */
}
.txt{
  flex: 1;
  margin: 0px 12px;
}
.txt h5{
  font-size: 13px;
  color: #262626;
  font-weight: 400;
  /* 多行文本溢出 */
  display: -webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp: 2;
  overflow:hidden;
  text-overflow: ellipsis;
}
.count{
  width: 44px;
  height: 44px;
  text-align: center;
  line-height: 44px;
  background-color: skyblue;
}
.txt .goods_style{
  display: inline;
  font-size: 11px;
	height: 16px;
	letter-spacing: 0px;
	color: #888888;
  background-color: #f1f1f1;
  padding: 0px 4px;
  border-radius: 2px;
}

/* 我这里span写错了 */
.txt .goods_style span:first-child{
  margin-right: 10px;
}

.txt .goods_price{
  color: #999;
  font-size: 12px;
  margin-top: 3px;
}
.txt .goods_price i,
.txt .goods_price em{
  font-size: 10px;
}
.txt .goods_price i{
  color: #cf4444;
}
.txt .goods_price span{
  font-size: 16px;
  color: #cf4444;
  margin-right: 12px;
}

.other{
  padding: 11px;
}

.other ul li{
    display: flex;
    align-items: center;
    margin-bottom: 25px;
    color: #262626;
    font-size: 13px;
}
.other ul li h5{
   font-weight: 400px;
}
/* 选中计数行 old */
.other ul li:nth-child(2n+1){
   justify-content: space-between;
}
/* 选中最后一行让下边距变为0  */
.other ul li:last-child{
  margin-bottom: 0;
}

.other ul li:nth-child(2) p{
  font-size: 12px;
  margin-left: 19px;
}

.other ul li i{
  color: #808080;
  font-size: 13px;
  margin-right: 2px; 
}


html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <title>填写订单</title>
    <!-- 引入初始化的css文件 -->
    <link rel="stylesheet" href="./css/base.css">
    <!-- 引入字体图标的css文件 -->
    <link rel="stylesheet" href="./lib/iconfont/iconfont.css">
    <!-- 引入自己的css文件 -->
    <link rel="stylesheet" href="./css/order.css">
</head>
<body>
    <!-- main 主体内容 start-->
    <div class="main">
        <!-- 用户信息 start -->
        <div class="pannel user_msg">
             <div class="location">
                <i class="iconfont icon-location"></i>
             </div>
             <div class="user">
                <div class="top">
                    <h5>林丽</h5>
                    <p>18500667882</p>
                </div>
                <div class="bottom">北京市  海淀区  中关村软件园   信息科技大厦1号
                    楼410#</div>
             </div>
             <div class="more">
                <i class="iconfont icon-more"></i>
             </div>
        </div>
        <!-- 用户信息 end -->

        <!-- 商品信息 start -->
        <div class="pannel product">
             <div class="pic">
                <a href=""><img src="./uploads/pic.png" alt=""></a>
             </div>
             <div class="txt">
                <h5>康尔贝 非接触式红外体温仪领券立减30元 婴儿级材质 测温测温测温测温测温</h5>
                <p class="goods_style">
                    <span class="firstSpan">粉色</span><span>红外体温计</span>
                </p>
                <p class="goods_price">
                    <i>¥</i><span>266</span> 
                    <em>¥</em><del>299</del>
                </p>
             </div>
             <div class="count">
                <i class="iconfont icon-x"></i><span>1</span>
            </div>
        </div>
        <!--  商品信息 end -->
  
        <!--  其他信息start -->
        <div class="pannel other">
            <ul>
                <li>
                    <h5>配送方式</h5>
                    <p>顺丰快递</p>
                </li>
                <li>
                    <h5>买家备注</h5>
                    <p>希望可以快点发货</p>
                </li>
                <li>
                    <h5>支付方式</h5>
                    <p>支付宝<i class="iconfont icon-more"></i></p>
                </li>
            </ul>
        </div>
        <!-- 其他信息end -->
        

        <!--  配送信息start -->
        <div class="pannel other">
            <ul>
                <li>
                    <h5>商品总价</h5>
                    <p>¥299.00</p>
                </li>
                <li>
                    <h5>运费</h5>
                    <p>¥0.00</p>
                </li>
                <li>
                    <h5>折扣</h5>
                    <p>-¥30.00</p>
                </li>
            </ul>
        </div>
        <!-- 其他信息end -->

        <!--  配送信息start -->
        <div class="pannel other">
            <ul>
                <li>
                    <h5>商品总价</h5>
                    <p>¥299.00</p>
                </li>
                <li>
                    <h5>运费</h5>
                    <p>¥0.00</p>
                </li>
                <li>
                    <h5>折扣</h5>
                    <p>-¥30.00</p>
                </li>
            </ul>
        </div>
        <!-- 其他信息end -->
    </div>
    <!-- main 主体内容 end-->



    <!-- pay底部支付 start -->
    <div class="pay">
        <div class="pay-left">
            合计:<span><i>266.00</i></span>
        </div>
        <div class="pay-right">
            <a href="#">去支付</a>
        </div>
    </div>
     <!--pay底部支付 end -->
</body>
</html>

6、PC端个人中心案例

image-20240405172136989

css代码

.xtx-boy {
    background-color: #f4f4f4;
    padding: 30px 0 85px;
}
.xtx-boy .container{
    display: flex;
    justify-content: space-between;
}
.xtx-boy .container .aside{
    width: 227px;
    height: 500px;
    background-color: palegreen;
    
}

.xtx-boy .container .main{
    width: 999px;
    /* 回头再删除 让里面的内容撑开就行 */
    /* height: 500px; */
   background-color: orange;
}

.main .overview{
    display: flex;
    background-color: #fff;
    padding: 20px 0px;
    height: 132px;
    margin-bottom: 18px;
}
/* 每个div占一份 */
.overview div{
    flex: 1;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    text-align: center;
}
.overview div a{
    display: flex;
    height: 55px;
    /* 改变主轴方式 */
    flex-direction: column;
    align-items: center;
    /* 上下居中 */
    justify-content: space-between;
}
.overview div:first-child{
    border-right: 1px solid #f1f1f1;
}

/* .overview div img{ */
    /* width: 25px;
    height: 22px; */
    /* margin-bottom: 7px;
} */
.overview  span{
    color: #e05e30;
    font-size: 25px;
    height: 30px;
    display: block;
    line-height: 25px;
}
.pannel{
  background-color: #fff;
  padding: 28px 19px;
  margin-bottom: 20px; 
}
.paner-title{
    font-size: 16px;
    color: #333;
    /* background: pink; */
    height: 45px;
    display: flex;
    justify-content: space-between;
}
.paner-title h4{
    font-size: 22px;
    font-weight: 400;
}
.paner-title a{
    color: #999;
    font-family: simsum;
    margin-top: 5px;
    margin-right: 15px;
}

.content li{
  display: flex;
  border: 1px solid #ccc;
  height: 137px;
  margin-bottom: 20px;
  font-size: 14px;
}
.content li:last-child{
    margin-bottom: 0;
}
.content .goods{
    flex:1;
    display: flex;
    align-items: center;
}
.content .goods .pic{
   width: 107px;
   height: 107px;
   background-color: pink;
   margin: 0 5px 0 12px;
}
.content .goods .pic img{
    width: 107px;
    height: 107px;
}

.content .goods .txt h5{
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 10px;
    /* 溢出隐藏 */
    width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; 
}
.content .state{
    width: 200px;
    /* line-height: 135px; */
    text-align: center;
    padding-top: 50px; 
    color: #e05e30;
}

.content .state p:nth-child(2){
    color: #999;
}
.content .price{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* text-align: center;
    padding-top: 30px; */
    width: 200px;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}
.content .price p:first-child{
    color: #9a2e1f;
}
.content .pay{
    width: 180px;
}
.content .pay{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 180px;
}
.content .pay p:nth-child(1){
    width: 100px;
    height: 30px;
    background-color:  #5eb69c;
    text-align: center;
    line-height: 30px;
    color: #fff;
    margin-bottom: 10px;
    border-radius: 2px;
}

html内容

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户中心页面-小兔鲜儿</title>
    <!-- 网站说明 -->
    <meta name="description" content="小兔鲜儿官网,致力于打造全球最大的食品、生鲜电商购物平台。">
    <!-- 关键字 -->
    <meta name="keywords" content="小兔鲜儿,食品,生鲜,服装,家电,电商,购物">
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    <!-- 引入初始化文件 css reset base.css -->
    <link rel="stylesheet" href="./css/base.css">
    <!-- 引入common.css  公共的头部和底部 -->
    <link rel="stylesheet" href="./css/common.css">
    <!--引入center.css  公共的头部和底部 -->
    <link rel="stylesheet" href="./css/cente2.css">

</head>

<body>
    <!-- 头部模块开始 -->
    <header>
        <!-- 快捷导航 -->
        <div class="xtx-shortcut">
            <div class="container">
                <ul>
                    <li><a href="#">请先登录</a></li>
                    <li class="sep">|</li>
                    <li><a href="#">免费注册</a></li>
                    <li class="sep">|</li>
                    <li><a href="#">我的订单</a></li>
                    <li class="sep">|</li>
                    <li><a href="#">会员中心</a></li>
                    <li class="sep">|</li>
                    <li><a href="#">帮助中心</a></li>
                    <li class="sep">|</li>
                    <li><a href="#">在线客服</a></li>
                    <li class="sep">|</li>
                    <li>
                        <a href="#">
                            <i></i>
                            手机版
                        </a>
                    </li>
                </ul>
            </div>
        </div>
        <!-- 导航栏 -->
        <div class="xtx-main-nav container">
            <!-- logo -->
            <div class="logo">
                <h1>
                    <a href="./index.html" title="小兔鲜儿">小兔鲜儿</a>
                </h1>
            </div>
            <!-- nav -->
            <nav class="nav">
                <ul>
                    <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>
                    <li><a href="#">居家</a></li>
                    <li><a href="#">洗护</a></li>
                    <li><a href="#">孕婴</a></li>
                    <li><a href="#">服装</a></li>
                </ul>
            </nav>
            <!-- search -->
            <div class="search">
                <input type="text" placeholder="搜一搜">
            </div>
            <!-- car -->
            <a href="#" class="car">
                <span>2</span>
            </a>
        </div>
    </header>
    <!-- 头部模块结束 -->

    <!-- 用户中心内容区域 start-->
    <div class="xtx-boy">
         <div class="container">
            <!-- 左侧内容 -->
            <div class="aside">123</div>
            <!-- 右侧内容 -->
            <div class="main">
                <!-- 右侧第一个盒子(会员中心,优惠卷) -->
                <div class="overview">
                      <div class="overview-left">
                        <a href="">
                            <img src="./images/vip.png" alt="" width="25" height="22">
                            <p>会员中心</p>
                        </a>
                        <a href="">
                            <img src="./images/safe.png" alt="" width="25" height="22">
                            <p>安全设置</p>
                        </a>
                        <a href="">
                            <img src="./images/address.png" alt=""  width="18" height="25">
                            <p>地址管理</p>
                        </a>
                      </div>
                      <div class="overview-right">
                        <a href="">
                            <span>6</span>
                            <p>优惠卷</p>
                        </a>
                        <a href="">
                           <span>70</span>
                           <p>礼品卡</p>
                        </a>
                        <a href="">
                            <span>120</span>
                            <p>积分</p></p></p>
                        </a>
                      </div>
                </div>
                <!-- 订单模块 start-->
                <div class="pannel order">
                    <!-- 我的订单头部 start -->
                   <div class="paner-title">
                        <h4>我的订单</h4>
                        <a href="#">查看全部 &gt;</a>
                   </div>
                   <!-- 我的订单头部 end -->

                   <!-- 我的订单内容 start-->
                   <div class="content">
                       <ul>
                          <li>
                            <div class="goods">
                                <div class="pic">
                                    <img src="./uploads/order_goods_1.jpg" alt="">
                                </div>
                                <div class="txt">
                                     <h5>拉夫劳伦T恤男正品圆领短袖</h5>
                                     <p>颜色: 白色 尺码: M 数量: 1</p>
                                </div>
                            </div>
                            <div class="state">
                                <p>代付款</p>
                                <p>查看物流</p>
                            </div>
                            <div class="price">
                                <p>¥99.00</p>
                                <p>(含运费:¥10.00)</p>
                                <p>在线支付</p>
                            </div>
                            <div class="pay"> 
                                <p>立即付款</p>
                                <p>查看详情</p>
                                <p>取消订单</p>
                            </div>
                          </li>
                          <li>
                            <div class="goods">
                                <div class="pic">
                                    <img src="./uploads/order_goods_1.jpg" alt="">
                                </div>
                                <div class="txt">
                                     <h5>拉夫劳伦T恤男正品圆领短袖</h5>
                                     <p>颜色: 白色 尺码: M 数量: 1</p>
                                </div>
                            </div>
                            <div class="state">
                                <p>代付款</p>
                                <p>查看物流</p>
                            </div>
                            <div class="price">
                                <p>¥99.00</p>
                                <p>(含运费:¥10.00)</p>
                                <p>在线支付</p>
                            </div>
                            <div class="pay"> 
                                <p>立即付款</p>
                                <p>查看详情</p>
                                <p>取消订单</p>
                            </div>
                          </li>
                          <li>
                            <div class="goods">
                                <div class="pic">
                                    <img src="./uploads/order_goods_1.jpg" alt="">
                                </div>
                                <div class="txt">
                                     <h5>拉夫劳伦T恤男正品圆领短袖</h5>
                                     <p>颜色: 白色 尺码: M 数量: 1</p>
                                </div>
                            </div>
                            <div class="state">
                                <p>代付款</p>
                                <p>查看物流</p>
                            </div>
                            <div class="price">
                                <p>¥99.00</p>
                                <p>(含运费:¥10.00)</p>
                                <p>在线支付</p>
                            </div>
                            <div class="pay"> 
                                <p>立即付款</p>
                                <p>查看详情</p>
                                <p>取消订单</p>
                            </div>
                          </li>
                          <li>
                            <div class="goods">
                                <div class="pic">
                                    <img src="./uploads/order_goods_1.jpg" alt="">
                                </div>
                                <div class="txt">
                                     <h5>拉夫劳伦T恤男正品圆领短袖</h5>
                                     <p>颜色: 白色 尺码: M 数量: 1</p>
                                </div>
                            </div>
                            <div class="state">
                                <p>代付款</p>
                                <p>查看物流</p>
                            </div>
                            <div class="price">
                                <p>¥99.00</p>
                                <p>(含运费:¥10.00)</p>
                                <p>在线支付</p>
                            </div>
                            <div class="pay"> 
                                <p>立即付款</p>
                                <p>查看详情</p>
                                <p>取消订单</p>
                            </div>
                          </li>
                       </ul>
                   </div>
                   <!-- 我的订单内容 end -->
                </div>
                <!-- 订单模块 end-->
            </div>
         </div>
    </div>
    <!-- 用户中心内容区域  end-->

    <!-- 底部开始 -->
    <footer>
        <!-- 上盒子 -->
        <div class="footer-t">
            <div class="container">
                <dl class="customer">
                    <dt>客户服务</dt>
                    <dd class="zaixian">
                        <a href="#">
                            <p>在线客服</p>
                        </a>
                    </dd>
                    <dd class="wenti">
                        <a href="#">
                            <p>问题反馈</p>
                        </a>
                    </dd>
                </dl>
                <dl class="us">
                    <dt>关注我们</dt>
                    <dd class="gongzhonghao">
                        <a href="#">
                            <p>公众号</p>
                        </a>
                    </dd>
                    <dd class="weibo">
                        <a href="#">
                            <p>微博</p>
                        </a>
                    </dd>
                </dl>
                <!-- 下载模块 -->
                <dl class="download">
                    <dt>下载APP</dt>
                    <dd class="qrcode">
                        <img src="./uploads/qrcode.png" alt="">
                    </dd>
                    <dd class="down">
                        <p>扫描二维码</p>
                        <p>立马下载APP</p>
                        <a href="#">下载页面</a>
                    </dd>
                </dl>
                <!-- 热线模块 -->
                <dl class="hotline">
                    <dt>服务热线</dt>
                    <dd>
                        <p>400-0000-000</p>
                        <p>周一至周日 8:00-18:00</p>
                    </dd>
                </dl>
            </div>
        </div>
        <!-- 下盒子 -->
        <div class="footer-b">
            <!-- 服务模块 -->
            <div class="xtx-service">
                <a href="#">价格亲民</a>
                <a href="#">物流快捷</a>
                <a href="#">品质新鲜</a>
            </div>
            <!-- 版权模块 -->
            <div class="xtx-copyright">
                <p>
                    <a href="#">关于我们</a> |
                    <a href="#">帮助中心</a> |
                    <a href="#">售后服务</a> |
                    <a href="#">配送与验收</a> |
                    <a href="#">商务合作</a> |
                    <a href="#">搜索推荐</a> |
                    <a href="#">友情链接</a>
                </p>
                <p>CopyRight @ 小兔鲜儿</p>
            </div>
        </div>
    </footer>
    <!-- 底部结束 -->
</body>

</html>

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

某虚假交友APP(信息窃取)逆向分析

应用初探 在群里水群的时候 群u发了一个交友APP 于是拿来分析一下 可以看到应用打开后又一个登录的界面 需要用户输入手机号与验证码进行登录 #在线云沙箱分析 将APK放入某安信云沙箱中分析 提示应用请求了过多的敏感权限 逆向分析 直接拖入Jadx分析 好在程序没有加固 也没…

vulnhub靶机: DC-9

dc-9靶机下载 将靶机设置为NAT模式&#xff0c;本次实验使用的内网网段为192.168.198.0/24&#xff0c;kali的ip为192.168.198.172 信息搜集 ip主机扫描&#xff1a; nmap -sP 192.168.198.0/24 确定靶机ip为192.168.198.171 主机端口扫描&#xff1a; nmap -T4 -A -v 192…

进程并发究竟是如何进行进程切换的?Linux内核原理解析

进程并发究竟是如何进行进程切换的&#xff1f;Linux内核原理解析 一、并发二、进程切换原理三、活跃进程、过期进程3.1分时操作系统、实时操作系统3.2 运行队列queue[140]3. 3 操作系统如何查找非空进程 一、并发 在一定时间内&#xff0c;多个进程在一个CPU中采用进程切换的方…

Memcached 教程之 PHP 连接 Memcached 服务(十)

PHP 连接 Memcached 服务 在前面章节中我们已经介绍了如何安装 Memcached 服务&#xff0c;接下来我们为大家介绍 PHP 如何使用 Memcached 服务。 PHP Memcache 扩展安装 PHP Memcache 扩展包下载地址&#xff1a;PECL :: Package :: memcache&#xff0c;你可以下载最新稳定…

商业开源MES+源码+可拖拽式数据大屏

商业开源的一套超有价值的JAVA制造执行MES系统源码 带本地部署搭建教程 教你如何在本地运行运行起来。 开发环境&#xff1a;jdk11tomcatmysql8springbootmaven 需要源码&#xff0c;私信我付费获取。 一、系统概述&#xff1a; 万界星空科技免费试用MES、开源MES、商业开…

OpenGL_Learn19(混合)

OpenGL中&#xff0c;混合(Blending)通常是实现物体透明度(Transparency)的一种技术。透明就是说一个物体&#xff08;或者其中的一部分&#xff09;不是纯色(Solid Color)的&#xff0c;它的颜色是物体本身的颜色和它背后其它物体的颜色的不同强度结合。一个有色玻璃窗是一个透…

java算法day45 | 动态规划part07 ● 70. 爬楼梯 (进阶) ● 322. 零钱兑换 ● 279.完全平方数

70. 爬楼梯 &#xff08;进阶&#xff09; 题目描述&#xff1a; 假设你正在爬楼梯。需要 n 阶你才能到达楼顶。 每次你可以爬至多m (1 < m < n)个台阶。你有多少种不同的方法可以爬到楼顶呢&#xff1f; 注意&#xff1a;给定 n 是一个正整数。 输入描述&#xff1a;输入…

【JavaSE】注解

概念解释 注解与注释 注释&#xff1a;用文字描述程序的,是给程序员看的。 注解&#xff1a;用来解释说明程序的&#xff0c;是给计算机看的。 百度百科定义&#xff1a; 注解&#xff08;Annotation&#xff09;&#xff0c;也叫元数据。一种代码级别的说明。它是JDK1.5及…

FPGA常用IP核之FIFO学习

IP核是FPGA芯片公司提供的逻辑功能块&#xff0c;在FPGA芯片中可以进行优化和预先配置&#xff0c;可以直接在用户设计的程序中使用&#xff0c;应用范围很广。在FPGA设计开发过程中使用IP核&#xff0c;可以大大的缩短开发周期&#xff0c;高度优化的IP核可以使FPG开发工程师专…

8核32G云服务器幻兽帕鲁多人联机主机价格94元/月、1362元一年

8核32G云服务器京东云轻量云主机价格94元1个月、282元3个月、673元6个月、1362元一年&#xff0c;配置8C32G-100G SSD系统盘-10M带宽-2000G月流量 华北-北京&#xff0c;京东云优惠活动 yunfuwuqiba.com/go/jd 活动链接打开如下图&#xff1a; 8核32G云服务器京东云轻量云主机价…

损失函数篇 | YOLOv8更换损失函数之MPDIoU(23年7月首发论文)

前言:Hello大家好,我是小哥谈。损失函数是机器学习中用来衡量模型预测值与真实值之间差异的函数。在训练模型时,我们希望通过不断调整模型参数,使得损失函数的值最小化,从而使得模型的预测值更加接近真实值。不同的损失函数适用于不同的问题,例如均方误差损失函数适用于回…

Codeforces Round 931 (Div. 2) D1. XOR Break — Solo Version

题目 思路&#xff1a; #include <bits/stdc.h> using namespace std; #define int long long #define pb push_back #define fi first #define se second #define lson p << 1 #define rson p << 1 | 1 const int maxn 1e6 5, inf 1e18, maxm 4e4 5; c…

机器学习综述:核心概念、方法与未来展望

一、机器学习基础 基本概念 机器学习是一门专注于开发算法来从数据中学习模式的科学。它基于这样一个假设&#xff1a;如果一个程序可以在某任务T上&#xff0c;基于经验E改善它的性能P&#xff0c;那么我们说这个程序在从经验中学习。这里的“经验”可以理解为历史数据或先前…

腾讯云服务器优惠活动价格表_CPU内存带宽报价明细

2024年最新腾讯云服务器租用优惠价格表&#xff1a;轻量应用服务器2核2G3M价格62元一年、2核2G4M价格118元一年&#xff0c;540元三年、2核4G5M带宽218元一年&#xff0c;2核4G5M带宽756元三年、轻量4核8G12M服务器646元15个月&#xff1b;轻量4核16G12M带宽32元1个月、96元3个…

基于python爬虫与数据分析系统设计

**单片机设计介绍&#xff0c;基于python爬虫与数据分析系统设计 文章目录 一 概要二、功能设计设计思路 三、 软件设计原理图 五、 程序六、 文章目录 一 概要 基于Python爬虫与数据分析系统的设计是一个结合了网络数据抓取、清洗、存储和数据分析的综合项目。这样的系统通常…

【网站项目】三省学堂-学习辅助系统

&#x1f64a;作者简介&#xff1a;拥有多年开发工作经验&#xff0c;分享技术代码帮助学生学习&#xff0c;独立完成自己的项目或者毕业设计。 代码可以私聊博主获取。&#x1f339;赠送计算机毕业设计600个选题excel文件&#xff0c;帮助大学选题。赠送开题报告模板&#xff…

Win10 下 Vision Mamba(Vim-main)的环境配置(libcuda.so文件无法找到,windows系统运行失败)

目录 1、下载NVIDIA 驱动程序、cuda11.8、cudnn8.6.0 2、在Anaconda中创建环境并激活 3、下载gpu版本的torch 4、配置环境所需要的包 5、安装causal_conv1d和mamba-1p1p1 安装causal_conv1d 安装mamba-1p1p1 6、运行main.py失败 请直接拉到最后查看运行失败的原因&am…

【C++】vector模拟实现

目录 简介&#xff1a;私有成员&#xff1a;迭代器&#xff1a; 无参构造函数&#xff1a;push_back&#xff1a;reserve&#xff1a;resize:push_back: operator[]重载&#xff1a;begin && end:size && capacity:insert&#xff1a;erase&#xff1a;带参构造…

PyQt ui2py 使用PowerShell将ui文件转为py文件并且将导入模块PyQt或PySide转换为qtpy模块开箱即用

前言 由于需要使用不同的qt环境&#xff08;PySide&#xff0c;PyQt&#xff09;所以写了这个脚本&#xff0c;使用找到的随便一个uic命令去转换ui文件&#xff0c;然后将导入模块换成qtpy这个通用库(支持pyside2-6&#xff0c;pyqt5-6)&#xff0c;老版本的是Qt.py(支持pysid…

论文阅读——Sat2Vid

Sat2Vid: Street-view Panoramic Video Synthesis from a Single Satellite Image 提出了一种新颖的方法&#xff0c;用于从单个卫星图像和摄像机轨迹合成时间和几何一致的街景全景视频。 即根据单个卫星图像和给定的观看位置尽可能真实地、尽可能一致地合成街景全景视频序列。…