HTML5+CSS3实现小米商城（完整）

对面小米商城这个首页，我想肯定是很多在校学生在学习前端课程的时候，老师经常布置的一个作业。
这个页面整体结构不算复杂，下面是我的分析，我想一定会对你产生一些帮助。
话不多说，先展示一下网页实现效果，看是否符合你的要求，如果不符合，也可以私信我！（有些图片可能已经产生了一些变动，莫慌！联系我，帮你解决）

一、网页效果展示

二、部分代码展示

  <div class="head2">
                <img class="head2_img" src="../imgs/logo.png" alt="">
                <div class="head2_div1">
                    <div class="head2_div1_1">
                        <span class="tou2_s">Xiaomi手机</span>
                        <div class="head2_x1">
                            <div class="x1">
                                <div class="x1_1">
                                    <a href="#">
                                        <img src="../imgs/shouji1.webp">
                                        <p class="x1_p1">Xiaomi 12S Ultra</p>
                                        <p class="x1_p2">5999元起</p>
                                    </a>
                                </div>
                                <div class="x1_2">
                                    <a href="#">
                                        <img src="../imgs/shouji2.webp">
                                        <p class="x1_p1">Xiaomi 12S Pro</p>
                                        <p class="x1_p2">5999元起</p>
                                    </a>
                                </div>
                                <div class="x1_3">
                                    <a href="#">
                                        <img src="../imgs/shouji3.webp">
                                        <p class="x1_p1">Xiaomi 12S</p>
                                        <p class="x1_p2">3999元起</p>
                                    </a>
                                </div>
                                <div class="x1_4">
                                    <a href="#">
                                        <img src="../imgs/shouji4.webp">
                                        <p class="x1_p1">Xiaomi 12Pro 天玑版</p>
                                        <p class="x1_p2">3999元起</p>
                                    </a>
                                </div>
                                <div class="x1_5">
                                    <a href="#">
                                        <img src="../imgs/shouji5.webp">
                                        <p class="x1_p1">Xiaomi Civi 1S</p>
                                        <p class="x1_p2">2299元起</p>
                                    </a>
                                </div>
                                <div class="x1_6">
                                    <a href="#">
                                        <img src="../imgs/shouji6.webp">
                                        <p class="x1_p1">Xiaomi 12 Pro</p>
                                        <p class="x1_p2">4699元起</p>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="head2_div1_2">
                        <span class="tou2_s">Redmi手机</span>
                        <div class="head2_x2">

                            <div class="x2">
                                <div class="x1_1">
                                    <a href="#">
                                        <img src="../imgs/yundong1.webp">
                                        <p class="x1_p1">Redmi Note 11T Pro+</p>
                                        <p class="x1_p2">1999元起</p>
                                    </a>
                                </div>
                                <div class="x1_2">
                                    <a href="#">
                                        <img src="../imgs/yundong2.webp">
                                        <p class="x1_p1">Redmi Note 11T Pro</p>
                                        <p class="x1_p2">1699元起</p>
                                    </a>
                                </div>
                                <div class="x1_3">
                                    <a href="#">
                                        <img src="../imgs/yundong3.png">
                                        <p class="x1_p1">Redmi Note 11SE</p>
                                        <p class="x1_p2"