HTML+CSS仿写京东页面附代码（web前端大作业）

2023-05-16

学习前端时间不多，看了两晚上就开始赶实训作业，大家看看就行

先来看看效果：

<!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>
    <style>
        *{
            /* margin: 0px auto; */
            padding: 0px;
            list-style: none;
            text-decoration: none
        }
        .clear::after{
            content: "";
            display: block;
            clear: both;
        }
        .top{
            width: 1580px;
            /* border: 2px solid red; */
            background-color: #e5e3e5;
            
        }

        .top_left{
            width: 40px;
            /* border: 2px solid rgb(255, 81, 0); */
            display:inline;
            float: left;
            padding-left:100px;
            
        }
     

        .top_left .one {
            display: none;
            /* border: 2px solid rgb(253, 17, 0); */
            position: absolute;
        }
        .top_left:hover .one{
            display: block;
            background-color:#e3e4e5;
            
        }



        .top_right{
            /* border: 2px solid blue; */
            border: 0px,0px,0px,0px;
            float: right;
            padding-right:100px;
            display:inline;
        }
        .ul1 .li1{
            float: left;
            width: 100px;
            position: relative;
        }
         .ul1 .one{
            display: none;
            position: absolute; 
         }
        .li1:hover .one{
            display: block;
            background-color:#e3e4e5;
        }





        .bottom{
            width: 1580px;
            height: 180px;
            background-color: rgb(255, 255, 255);
        }
        .bottom .bottom_left{
            float: left;
            /* border: 2px solid blue;  */
            padding-top:50px;
            padding-left:180px;
       }
       
       .bottom .bottom_middle{
            /* border: 2px solid blue;  */
            float: left;
    
            padding-top:40px;
            /* padding-left:150px; */
            padding-right:200px;
       }
       .bottom .bottom_right{
            float: left;
            /* border: 2px solid blue;  */
            padding-top:50px;
            padding-right:100px;
       }
       
       /* 外边距 margin */
       /* 内边距 padding */

       .bottom_middle input{
            width:454px;
            height:32px;
            border:2px solid #c62020;
            padding-left: 4px;
            color:rgb(104, 103, 103);
            font:14px/32px "microsoft yahei";
            float:left;
        }
       .bottom_middle button{
            width:80px;
            height:35px;
            background-color:#e1251b; 
            float:left;
            font:16px/36px "microsoft yahei";
            color:#fff;
            cursor:pointer;
        }
        .bottom_middle .button1{
            width:150px;
            height:35px;
            background-color:#ffffff; 
            float:left;
            font:16px/36px "microsoft yahei";
            color:#e1251b;
            cursor:pointer;
        }
        
        .bottom .bottom_middle .bottom_middle_1{
            /* border: 2px solid rgb(255, 0, 0); */
            margin-left: 80px;
        }
        .bottom .bottom_middle .bottom_middle_2{
            border: 2px solid rgb(255, 255, 255);
            margin-top: 20px;
            margin-left: 80px;
        }
        .bottom_middle_2_1{
            font:16px/36px "microsoft yahei";
            color:#999999;
        }
        .bottom .bottom_middle .bottom_middle_3{
            /* border: 2px solid rgba(0, 0, 0, 0.396); */
            margin-left: 60px;
            padding-top: 0px;
        }

       


        section{
            background-color: #f4f4f4;
            padding-top: 12px;
            width: 1580px;
            height: 580px;
            /* border: 2px solid blue; */
        }
       

        section .div2{
            background-color: rgb(255, 255, 255);
            margin-left: 120px;
            
            padding-left: 10px;
            width: 200px;
            height: 580px;
            /* border: 2px solid blue; */
            float: left;
        }


        section .div3{
            width: 650px;
            height: 580px;
            /* border: 2px solid blue; */
            margin-left: 5px;
            margin-right: 5px;
            float: left;
        }




        section .div4{
            width: 200px;
            height: 580px;
            /* border: 2px solid blue; */
            float: left;
        }
        section .div4 .div4-1{
            margin-bottom: 3px;
        }
        section .div4 .div4-2{
            margin-bottom: 3px;
        }

        section .div5{
            width: 240px;
            height: 580px;
            background-color: rgb(255, 255, 255);
            margin-left:  5px;
            /* border: 2px solid blue; */
            float: left;
        }

        
        section .div5 .div5-3{
            
            /* border: 2px solid blue; */
            display: inline-block;
        }
        section .div5 .div5-4{
            
            /* border: 2px solid blue; */
            display: inline-block;
        }
        section .div5 .div5-4 .table1{
            border-spacing: 24px 0px;
        }
        .r_top_banner {
	height:115px;
	border-bottom:1px solid #ccc;
}

.r_top_banner .top_user {
	padding-top:15px;
	padding-left:10px;
}


.r_top_banner .top_user img {
	width:45px;
	height:45px;
	border-radius:25px;
}

.r_top_banner .top_user a{
	float:left;
}

.r_top_banner .top_user .userinfo {
	float:left;
	margin-left:15px;
	line-height:20px;
}

.r_top_banner .userinfo a {
	margin-right:5px;
} 

.bot_btns {
	padding-left:10px;
	padding-top:15px;
}

.bot_btns a {
	width:80px;
	height:20px;
	border:2px solid red;
	display:block;
	float:left;
	text-align:center;
	line-height:20px;
	margin-right:10px;
}



        /* 外边距 margin */
        /* 内边距 padding */
        footer{
            background-color: #f4f4f4;
            padding-top: 12px;
            width: 1580px;
            height: 700px;
            /* border: 2px solid blue; */
        }
        .footer_1{
            /* border: 2px solid blue; */
            width: 1580px;
            height: 350px;
        }
        .footer_1_1{
            /* border: 2px solid blue; */
            margin-left: 115px;
            width: 215px;
            float: left;
        }
        .footer_1_2{
            /* border: 2px solid blue; */
            margin-left: 0px;
            width: 850px;
            height: 298px;
            float: left;
        }
        .footer_1_3{
            /* border: 2px solid blue; */
            margin-left: 0px;
            width: 242px;
            height: 298px;
            float: left;
        }
        .footer_1_4{
            /* border: 2px solid blue; */
            background-color: #ffffff;
            margin-left: 30px;
            width: 80px;
            height: 330px;
            float: left;
        }
        .footer_1_4_1{
            border-spacing: 18px 15px;
        }

      
        .footer_2{
            /* border: 2px solid blue; */
            width: 1580px;
            height: 350px;
        }
        .footer_2_1{
             /* border: 2px solid blue; */
             margin-left: 115px;
            width: 160px;
            height: 210px;
            float: left;
        }
        .footer_2_2{
             /* border: 2px solid blue; */
             margin-left: 65px;
            width: 160px;
            height: 210px;
            float: left;
        }
        .footer_2_3{
             /* border: 2px solid blue; */
             margin-left: 65px;
            width: 160px;
            height: 210px;
            float: left;
        }
        .footer_2_4{
             /* border: 2px solid blue; */
             margin-left: 65px;
            width: 160px;
            height: 210px;
            float: left;
        }
        .footer_2_5{
             /* border: 2px solid blue; */
             margin-left: 65px;
            width: 160px;
            height: 210px;
            float: left;
        }
        .footer_2_6{
             /* border: 2px solid blue; */
             margin-left: 65px;
            width: 200px;
            height: 210px;
            float: left;
        }
        .footer_2_7{
             /* border: 2px solid blue; */
             margin-left: 115px;
            width: 1350px;
            height: 130px;
            float: left;
        }
        .footer_2_7_1{
            /* border: 2px solid blue; */
             margin-left: 80px;
            width: 1100px;
            height: 50px;
            float: left;
        }
        .footer_2_7_2{
            /* border: 2px solid rgb(255, 0, 0); */
             margin-left: 20px;
             margin-top: 0px;
            width:100px;
            height: 100px;
            float: left;
        }
        .footer_2_7_3{
            /* border: 2px solid rgb(255, 0, 0); */
             margin-right: 22px;
             margin-top: 0px;
            width:120px;
            height: 30px;
            float: right ;
        }
    </style>
</head>
<body>
    <header>
        <div class="top clear">
            <div class="top_left ">
                <p class="top_left_1"><a href="">甘肃</a></p>
            
                <div class="one">
                    <ul>
                        <div class="li5">&nbsp&nbsp&nbsp北京 &nbsp&nbsp&nbsp&nbsp&nbsp上海 &nbsp&nbsp&nbsp天津 &nbsp&nbsp&nbsp重庆 &nbsp&nbsp&nbsp河北</div>
                        <div class="li5">&nbsp&nbsp&nbsp山西 &nbsp&nbsp&nbsp&nbsp&nbsp河南 &nbsp&nbsp&nbsp辽宁 &nbsp&nbsp&nbsp吉林 &nbsp&nbsp&nbsp黑龙江    </div>
                        <div class="li5">&nbsp&nbsp&nbsp内蒙古 &nbsp&nbsp江苏 &nbsp&nbsp&nbsp山东 &nbsp&nbsp&nbsp安徽 &nbsp&nbsp&nbsp浙江    </div>
                        <div class="li5">&nbsp&nbsp&nbsp福建 &nbsp&nbsp&nbsp&nbsp&nbsp湖北 &nbsp&nbsp&nbsp湖南 &nbsp&nbsp&nbsp广东 &nbsp&nbsp&nbsp广西    </div>
                        <div class="li5">&nbsp&nbsp&nbsp江西 &nbsp&nbsp&nbsp&nbsp&nbsp四川 &nbsp&nbsp&nbsp海南 &nbsp&nbsp&nbsp贵州 &nbsp&nbsp&nbsp云南    </div>
                        <div class="li5">&nbsp&nbsp&nbsp西藏 &nbsp&nbsp&nbsp&nbsp&nbsp陕西 &nbsp&nbsp&nbsp甘肃 &nbsp&nbsp&nbsp青海 &nbsp&nbsp&nbsp宁夏   </div>
                        <div class="li5">&nbsp&nbsp&nbsp新疆 &nbsp&nbsp&nbsp&nbsp&nbsp港澳 &nbsp&nbsp&nbsp台湾 &nbsp&nbsp&nbsp钓鱼岛 &nbsp&nbsp海外    </div>
                    </ul>
                    
                </div>
            </div>    
                
                
            

            <div class="top_right">
                <ul class="ul1 "  >
                    <li class="li1">
                        <a href="">你好，请登录 </a>
                    </li>
                    <li class="li1">
                        <a href="">免费注册 |</a>                        
                    </li>
                    <li class="li1">
                        <a href="">我的京东 |</a>
                        <div class="one">
                            <ul>
                                <li>待处理订单</li>
                                <li>我的问答</li>
                                <li>降价商品</li>
                                <li>返修退换货</li>
                                <li>我的商品</li>
                            </ul>
                        </div>
                    </li>
                    <li class="li1">
                        <a href="">京东会员 |</a>                        
                    </li>
                    <li class="li1">
                        <a href="">企业采购 |</a>
                        <div class="one">
                            <ul>
                                <li>企业购</li>
                                <li>公共采购</li>
                                <li>工业品</li>
                                <li>商用场景馆</li>
                                <li>微信企业购</li>
                                <li>礼品卡</li>
                            </ul>
                        </div>
                    </li>
                    <li class="li1">
                        <a href="">商家服务 |</a>                        
                    </li>
                    <li class="li1">
                        <a href="">商家服务 |</a>                        
                    </li>
                    <li class="li1">
                        <a href="">手机京东 |</a>                        
                    </li>
                    <li class="li1">
                        <a href="">网站无障碍</a>                        
                    </li>
                   
                </ul>
               
                </div>
        </div>
        
        <div class="bottom">

        
            <div class="bottom_left">
                <img src="img/logo.png" width="100px" height="100px" alt="logo">
            </div>
            
            <div class="bottom_middle">
                
                <div class="bottom_middle_1">
                    
                    <input type="text" value="图书开抢">
                    <button>搜索 </button>
                    <button class="button1" style="margin-left:30px;"><img src="img/gwc.png" width="30px" height="20px">我的购物车</button>
                </div>
                
                <div class="bottom_middle_2">
                    <p class="bottom_middle_2_1">100减99 一加手机 京东京造 健康服务 镇店电脑 加氛生活 三星盛典 </p>
                    
                </div>
                
                <!-- <br> -->
                
                <div class="bottom_middle_3">
                    <p>京东超市 &nbsp&nbsp&nbsp&nbsp优惠劵 &nbsp&nbsp&nbsp&nbsp秒杀 &nbsp&nbsp&nbsp&nbsp京东家电 &nbsp&nbsp&nbsp&nbsp京东生鲜 &nbsp&nbsp&nbsp&nbspPLUS会员 &nbsp&nbsp&nbsp&nbsp进口好物 &nbsp&nbsp&nbsp&nbsp品牌闪购 &nbsp&nbsp&nbsp&nbsp拍卖 &nbsp&nbsp&nbsp&nbsp京东五金城</p>
                    
                </div>

               
           </div>
                
            <div class="bottom_right">
                <img src="img/jingdong.png" width="100px" height="100px" alt="京东网站二维码">
            </div>

        </div>    
    </header>
    <section >
        
        <div class="div2">
            
           <ul class="ul4">
            <li class="li4" style="margin-bottom:10px;"><a href="">家用电器</a></li>
            <li class="li4" style="margin-bottom:10px;">手机/运营商/数码</li>
            <li class="li4" style="margin-bottom:10px;">电脑/办公</li>
            <li class="li4" style="margin-bottom:10px;">家居/家具/家装/厨具</li>
            <li class="li4" style="margin-bottom:10px;">男装/女装/童装/内衣</li>
            <li class="li4" style="margin-bottom:10px;">美妆/个护/清洁/宠物</li>
            <li class="li4" style="margin-bottom:10px;">女鞋/箱包/钟表/珠宝</li>
            <li class="li4" style="margin-bottom:10px;">男鞋/运动/户外</li>
            <li class="li4" style="margin-bottom:10px;">房产/汽车/汽车用品</li>
            <li class="li4" style="margin-bottom:10px;">母婴/玩具乐器</li>
            <li class="li4" style="margin-bottom:10px;">食品/酒类/生鲜/特产</li>
            <li class="li4" style="margin-bottom:10px;">艺术/礼品鲜花/农资绿植</li>
            <li class="li4" style="margin-bottom:10px;">医疗保健/计生用品</li>
            <li class="li4" style="margin-bottom:10px;">图书/文娱/教育/电子书</li>
            <li class="li4" style="margin-bottom:10px;">机票/酒店/旅游/生活</li>
            <li class="li4" style="margin-bottom:10px;">众筹/白条/保险/企业金融</li>
            <li class="li4" style="margin-bottom:10px;">安装/维修/清洗/二手</li>
            <li>工业品</li>
           </ul>
            
        </div>
        <div class="div3">
            <img src="img/zhu.png"  width="650px" height="580px" alt="logo">    
        </div>
        <div class="div4">
            <div class="div4-1"><img src="img/4-1.png" width="200px" height="188px" alt="图片4-1"></div>
            <div class="div4-2"><img src="img/4-2.jpg" width="200px" height="188px"alt="图片4-2"></div>
            <div class="div4-3"><img src="img/4-3.png" width="200px" height=" 188px"alt="图片4-3"></div>
                
        </div>
        <div class="div5">
            <div class="div5-1">
                <!-- <img src="img/5-1.png" width="240px" height="150px" alt="图片5-1"> -->
                <div class="r_top_banner">
                    <div class="top_user clearfix">
                           <a href="#">
                                <img src="img/no_login.png">
                           </a>

                           <div class="userinfo">
                                <p class="p1">hi~欢迎逛京东！</p>

                                <p class="p2">
                                      <a href="#">登入</a>

                                      <a href="#">注册</a>
                                </p>
                           </div>
                    </div>
                    
                    <div class="bot_btns">

                           <a href="#">新人福利</a>
                           <a href="#">PLUS会员</a>
                    </div>
             </div>
            
            
            </div>
            <div class="div5-2">
                <div5-2-1>
                   <a href="" style="margin-right: 100px;">京东日报</a> 
                   <a href="">更多></a>
                </div5-2-1>
            </div>
            <div class="div5-3">
                <ul>
                    <li><a href="" style="margin-left: 70px;">360度旋转安全座......</a></li>
                    <li><a href="" style="margin-left: 70px;">边拖边洗，一步到位....</a></li>
                    <li><a href="" style="margin-left: 70px;">嘘！以内家用洗衣机...</a></li>
                    <li><a href="" style="margin-left: 70px;">精准避障仿跌落，以...</a></li>
                </ul>
            </div>
            <div class="div5-4">
                <table border="0"  class="table1">
                    <tr >
                        <td><img src="img/礼品卡.png" width="45px" height="45px"alt=""></td>
                        <td><img src="img/企业购.png" width="45px" height="45px" alt=""></td>
                        <td><img src="img/话费.png"  width="45px" height="45px"alt=""></td>
                    </tr>
               
                    <tr>
                        <td>礼品卡</td>
                        <td>企业购</td>
                        <td>&nbsp话费</td>
                    </tr>
                    <tr>
                        <td><img src="img/游戏.png" width="45px" height="45px"></td>
                        <td><img src="img/白条.png" width="45px" height="45px"alt=""></td>
                        <td><img src="img/加油卡.png" width="45px" height="45px"alt=""></td>
                    </tr>
                    <tr>
                        <td>游戏</td>
                        <td>白条</td>
                        <td>加油卡</td>
                    </tr>
                    <tr>
                        <td><img src="img/五金城.png" width="45px" height="45px"alt=""></td>
                        <td><img src="img/机票.png" width="45px" height="45px"alt=""></td>
                        <td><img src="img/火车票.png" width="45px" height="45px"alt=""></td>
                    </tr>
                    <tr>
                        <td>五金城</td>
                        <td>机票</td>
                        <td>火车票</td>
                    </tr>
                    <tr>
                        <td><img src="img/电影票.png" width="45px" height="45px"alt=""></td>
                        <td><img src="img/酒店.png" width="45px" height="45px"alt=""></td>
                        <td><img src="img/云主机.png" width="45px" height="45px"alt=""></td>
                    </tr>
                    <tr>
                        <td>电影票</td>
                        <td>酒店</td>
                        <td>云主机</td>
                    </tr>
                    
                </table>
            </div>
        </div>
        
    </section>

    <footer>
        <div class="footer_1">
            <div class="footer_1_1">
                <img src="img/京东秒杀.png" width="215px" height="298"alt="">
            </div>
            <div class="footer_1_2">
                <img src="img/商品.png" width="850px" height="298"alt="">
            </div>
            <div class="footer_1_3">
                <img src="img/美妆.png" width="242px" height="298" alt="">
            </div>
            <div class="footer_1_4">
                <table table border="1" class="footer_1_4_1">
                    <tr>
                        <td><a href="">京东秒杀</a></td>
                    </tr>
                    <tr>
                        <td><a href="">特色优选</a></td>
                    </tr>
                    <tr>
                        <td><a href="">频道广场</a></td>
                    </tr>
                    <tr>
                        <td><a href="">为你推荐</a></td>
                    </tr>
                    <tr>
                        <td><a href="">客服</a></td>
                    </tr>
                    <tr>
                        <td><a href="">反馈</a></td>
                    </tr>
                </table>
            </div>
        </div>
        <div class="footer_2">
            <div class="footer_2_1">
                <ul>
                    
                    <li>购物指南</li>
                    <br>
                    <li>购物流程</li>
                    <li>会员介绍</li>
                    <li>生活旅行</li>
                    <li>常见问题</li>
                    <li>大家电</li>
                    <li>联系客服</li>
                </ul>
            </div>
            <div class="footer_2_2">
                <ul>
                    <li>配送方式</li>
                    <br>
                    <li>上门自提</li>
                    <li>211限时达</li>
                    <li>配送服务查询</li>
                    <li>配送费收取标准</li>
                </ul>
            </div>
            <div class="footer_2_3">
                <ul>
                    <li>支付方式</li>
                    <br>
                    <li>货到付款</li>
                    <li>在线支付</li>
                    <li>分期付款</li>
                    <li>公司转账</li>
                </ul>
            </div>
            <div class="footer_2_4">
                <ul>
                    <li>售后服务</li>
                    <br>
                    <li>售后政策</li>
                    <li>价格保护</li>
                    <li>退款说明</li>
                    <li>返修\退换货</li>
                    <li>取消订单</li>
                </ul>
            </div>
            <div class="footer_2_5">
                <ul>
                    <li>特色服务</li>
                    <br>
                    <li>夺宝岛</li>
                    <li>DIY装机</li>
                    <li>延保服务</li>
                    <li>京东E卡</li>
                    <li>京东通信</li>
                    <li>京鱼座智能</li>
                </ul>
            </div>
            <div class="footer_2_6">
                <ul>
                    <li>京东自营覆盖区县</li>
                    <br>
                    <li>京东已向全国2661个区县提供自营配送服务，支持货到付款、POS机刷卡和售后上门服务。</li>
                </ul>
            </div>
            <div class="footer_2_7">
                <div class="footer_2_7_1">
                    <p>关于我们 | 联系我们 | 联系客服 | 合作招商 | 商家帮助 | 营销中心 | 手机京东 | 友情链接 | 销售联盟 | 京东社区 | 风险监测 | 隐私政策 | 京东公益 | Media & IR</p>
                </div>
                <div class="footer_2_7_2">
                    <img src="img/公众号二维码.png" width="100px" height="100"alt="">
                </div>
                <div class="footer_2_7_3">
                    <p>欢迎关注作者</p>

                </div>
            </div>
        </div>
        
    </footer>
</body>
</html>

HTML+CSS仿写京东页面附代码（web前端大作业）的相关文章

嵌入式服务器boa移植

移植嵌入式服务器boa的过程 xff0c 在论坛里面可以搜到好多 xff0c 其中也会有出现错误时对应的解决方法 xff0c 在这里就不赘述了在这里我介绍一下我移植过程中出现的问题 xff1a boa not found 总结一下这个问题
数据架构简介

01 数据架构的起源追根溯源是一个数据人的底层思维逻辑 xff0c 因此 xff0c 我们先说一说数据架构的起源 xff08 来源也行 xff0c 一个意思 xff09 其实 xff0c 我们现在IT行业经常说的软件架构系统架构 XX架
【Python基础教程】print语法的使用

大家好 xff0c 这里是万瑞科技今天我们来学习一下Python中最基础的语法 print语法首先我们来看一下print语法该怎样写 xff1a print 34 34 上面的语法是输出打印某段文字的语法但要注意 xff1a 语法中
STM32驱动步进电机梯形算法库函数版

关于梯形算法的原理查看 xff1a AVR446 Linear speed control of stepper motor 里面有原理和代码 xff08 库函数版F4 xff09 废话不多说直接上链接 xff1a 梯形算法驱动步进电机 z
VC6.0下载和安装教程

Microsoft Visual C 43 43 xff0c xff08 简称Visual C 43 43 MSVC VC 43 43 或VC xff09 是Microsoft公司推出的以C 43 43 语言为基础的开发Windows环境程
Code::Blocks使用教程

使用之前我们先准备一段代码 include lt stdio h gt include lt stdlib h gt int main printf 34 欢迎进入www dotcpp com编程网站 xff01 34 system 34
Dev-C++下载和安装教程

Dev C 43 43 是一个Windows环境下的一个适合于初学者使用的轻量级 C C 43 43 集成开发环境 xff08 IDE xff09 它是一款自由软件 xff0c 遵守GPL许可协议分发源代码它集合了MinGW中的GCC编译
Dev C++使用教程

我们在使用之前先准备一段C语言代码 include lt stdio h gt int main printf 34 欢迎进入C语言网 xff01 34 return 0 初步使用这款软件 xff0c 我们先选择源文件进行创建 xff0c
Altium Designer安装教程

Altium Designer 21软件简介 xff1a Altium Designer 21是一款由Altium开发团队全新推出的简单易用 xff0c 与时俱进 xff0c 功能强大的PCB设计软件 xff0c 可以方便用户快速完成各类原
Matlab 2021b安装教程-Matlab分析软件下载方法

MATLAB是美国MathWorks公司出品的商业数学软件 xff0c 用于算法开发数据可视化数据分析以及数值计算的高级技术计算语言和交互式环境 xff0c 主要包括MATLAB和Simulink两大部分下载方法 https docs
STM32嵌入式面试知识点总结

一 STM32F1和F4的区别 xff1f 解答 xff1a 参看 xff1a STM32开发 STM32初识内核不同 xff1a F1是Cortex M3内核 xff0c F4是Cortex M4内核 xff1b 主频不同 xff1a
Keil系列教程01_Keil介绍、下载、安装与注册

1写在前面对于学习单片机和嵌入式开发的朋友来说 xff0c 掌握Keil这款软件可以说是必备的技能鉴于目前网上没有完整的Keil教程 xff0c 因此我打算整理一套完整的Keil系列教程目前Keil有四种产品 xff08 软件 xff
Keil系列教程02_新建基础软件工程

1写在前面目前Keil的四款产品 xff08 软件 xff09 xff1a MDK ARM C51 C251 C166 xff0c 在用法上极为相似 xff0c 包括本文讲述的新建软件工程本文以目前 xff08 2018年10月 xff
机器学习多分类器有哪些

常见的有 xff1a 决策树分类器 xff08 Decision Tree Classifier xff09 支持向量机分类器 xff08 Support Vector Machine Classifier xff09 朴素贝叶斯分类器 x
Keil系列教程03_主窗口和工具栏详细说明

1写在前面本文先让大家简单认识一下Keil的主窗口界面 xff0c 然后再进一步认识Keil的文件编译和调试工具栏 Toolbars工具栏就是在菜单下面的两行快捷图标按钮 xff0c 这些快捷按钮之所以在工具栏里面 xff0c 在于它们
【Linux驱动】Linux--V4L2视频驱动框架

Linux V4L2视频驱动框架 Linux V4L2驱动框架一 V4L2 框架二 V4L2驱动主要数据结构三 V4L2提供的外部接口四 V4L2驱动框架模板五虚拟摄像头驱动参考资料 Linux V4L2驱动框架一 V4L2 框架 v
PostMan——安装使用教程（图文详解）

为了验证接口能否被正常访问 xff0c 我们常常需要使用测试工具 xff0c 来对数据接口进行检测好处 xff1a 接口测试工具能让我们在不写任何代码的情况下 xff0c 对接口进行调用和调试下载并安装PostMan 首先 xff0c
c++中::和:的区别

在 C 43 43 中 xff0c 34 34 和 34 34 都是类成员初始化的运算符 34 34 是域运算符 xff0c 用于访问类的静态成员 xff0c 如静态变量和静态函数在这里我们给出一个例子 xff1a class A pub
程序=算法+数据结构

JAVA 数据结构及基础算法算法 xff1a 解决问题的流程步骤 xff08 分支循环顺序 xff09 数据结构 xff1a 将数据按照某种特定的结构来保存设计良好的数据结构会导致好的算法凭借一句话获得图灵奖的Pascal之
【嵌入式】stm32+freeRTOS移植与应用

freeRTOS 源码移植手动移植 xff1a freeRTOS官网点击Download FreeRTOS点击Download解压zip文件 FreeRTOS是内核文件夹 xff0c 只需关注这个 FreeRTOS Demo 示例程序

随机推荐

benchmark

一定义 xff1a benchmark译为基准测试 xff0c 基准测试是指通过设计科学的测试方法测试工具和测试系统 xff0c 实现对一类测试对象的某项性能指标进行定量的和可对比的测试二基准的特征 xff1a 相关性基准应该度量
在 Linux Ubuntu / Windows 10配置 RealSense 开发环境开发预处理以及了解树莓派3

Linux Ubuntu 首先 xff0c 打开Intel Realsense 官网 Intel RealSense Computer Vision Depth and Tracking cameras intelrealsense com
Docker的安装（基于windows的安装）

在安装windows前需要有几个准备工作 1 启用Hyper V以在 Windows 10上创建虚拟机 xff1a a 使用 PowerShell 启用 Hyper V 在windows中搜索powerShell 使用管理员身份打开控制台
提交代码前未拉取代码，导致冲突及解决办法

前提 xff1a 和同事协作开发代码 xff0c 用git管理的项目 xff0c 在vscode可视化工具里面拉取项目代码 xff0c 没有反应 xff0c 然后在git里git pull xff0c 也没拉到远端的代码 xff0c 就提交
static 静态成员变量静态成员函数类中使用

关于在类中使用static的一些情况 xff1a 静态成员函数和静态成员变量的调用格式 xff0c 尽量采用类名成员的格式 xff0c 不要以对象来调用 1 static func静态成员函数 1 其地址可以直接由函数指针来存储 xff0
ucosii消息队列学习

近期在学习ucosii的内容使用的平台为STM32F103C8T6最小系统板今日关于消息队列的使用遇到了一些问题基本情况 xff1a 移植代码为正点原子ucosiii消息队列信号量集和软件定时器例程主要新建两个任务post task
day41—编程题

文章目录 1 第一题1 1题目1 2思路1 3解题 2 第二题2 1题目2 2思路2 3解题 1 第一题 1 1题目描述 xff1a Emacs号称神的编辑器 xff0c 它自带了一个计算器与其他计算器不同 xff0c 它是基于后缀表达
SLAM学习笔记

编译环境参考之前的笔记 cmake文件 cmake minimum required VERSION 3 0 project odometry set CMAKE BUILD TYPE 34 Release 34 add definitio
eclipse配置Tomcat

文章目录前言一预先工作1 Tomcat是什么 xff1f 2 Tomcat下载3 安装Eclipse for Java EE 二在eclipse中配置Tomcat 前言目前开始了j2ee的学习 xff0c 为了给以后的学习做准备 x
MATLAB学习笔记（一）上：MATLAB基础知识

笔记配套课程 xff1a 科学计算与MATLAB语言中国大学MOOC 慕课 icourse163 org PART ONE xff1a MATLAB系统环境 1 命令行窗口中 xff0c 如果一条命令很长 xff0c 我们可以分成两行来输
H3C路由器基本配置命令

1 system view 进入系统视图 2 sysname R1 配置路由器名字为R1 3 display clock 查看当前系统时间 4 clock datetime 00 00 00 2 26 2023 用户模式下修改系统时间配置
ubuntu18.04双系统卸载并重装

卸载ubuntu18 04 原文档 xff08 稍作整理 xff0c 方便自己使用 xff09 下载diskgenius工具 xff1a diskgenius 删除Ubuntu系统使用的几个分区 xff08 包括EFI分区 xff09 xf
安装zed-ros-wrapper 并解决一些报错

创建工作空间如果没有工作空间 xff0c 先根据如下命令建立工作空间 source opt ros melodic setup bash mkdir p catkin ws src cd catkin ws catkin make cat
rtabmap+orbslam2+D435i建图

配置rtabmap 参考 xff1a rtabmap安装与使用配置orbslam2参考 xff1a ubuntu18 04 安装orb slam2并结合ZED运行建图参考 xff1a Rtabmap 43 ORB SLAM2 43 D4
matlab2018a帮助文档设置为中文

版本 xff1a matlab2018a 1 主页预设 2 帮助文档位置 xff08 第二个 xff09 简体中文应用确定 3 结果展示
Vue2与Vue3的生命周期一览

Vue2与Vue3的生命周期生命周期前言介绍Vue2的生命周期钩子函数Vue3的生命周期钩子函数setup函数Vue3新增生命周期生命周期前言介绍生命周期也称生命周期回调函数生命周期函数生命周期钩子每个 Vue 组件实例在创建
FreeRTOS入门

文章目录一 FreeRTOS简介二学习任务三学习内容多任务程序实现1 相关文件2 头文件的添加3 路径添加4 修改主函数main c 中代码5 将程序烧录到stm32开发板中6 最终结果四参考资料一 FreeRTOS简介 Fre
嘉立创SMT贴片打板流程

说明 xff1a 打板平台嘉立创下单助手使用嘉立创EDA画板可参考以下过程使用AD画板 xff0c 不同点是 xff08 1 xff09 导出的文件是PCB源文件压缩包 43 BOM表 43 坐标文件 xff08 2 xff09 确保
Android Studio安装超详细步骤（包括SDK安装不成功，模拟器无法创建等问题）

本文主要介绍CPU 为AMD锐龙和英特尔两种类型在安装中出现的一些问题 xff0c 两种解决的方案不同 xff0c 所以首先查看属于哪种 xff0c 然后找相对应的安装方法 Android Studio的安装需要准备两个安装文件 xff
HTML+CSS仿写京东页面附代码（web前端大作业）

学习前端时间不多 xff0c 看了两晚上就开始赶实训作业 xff0c 大家看看就行先来看看效果 xff1a lt DOCTYPE html gt lt html lang 61 34 en 34 gt lt head gt lt meta

HTML+CSS仿写京东页面附代码（web前端大作业）

HTML+CSS仿写京东页面附代码（web前端大作业） 的相关文章

随机推荐

热门标签

HTML+CSS仿写京东页面附代码（web前端大作业）的相关文章