1. Toy模板网首页
  2. > Toy博客

小兔鲜儿-商城APP（静态网页）

7月前 作者：爱好是吃的蓝胖 分类：Toy博客 阅读(31) 违法举报

这篇具有很好参考价值的文章主要介绍了小兔鲜儿-商城APP（静态网页）。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

渲染：

小兔鲜儿-商城APP（静态网页）

 小兔鲜儿-商城APP（静态网页）

小兔鲜儿-商城APP（静态网页） 

小兔鲜儿-商城APP（静态网页） 1.快捷导航：

<!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" />

    <meta

      name="description"

      content="小兔鲜儿官网，致力于打造全球最大的食品、生鲜电商购物平台。"

    />

    <meta name="keywords" content="小兔鲜儿,食品,生鲜,服装,家电,电商,购物" />

    <title>小兔鲜儿-新鲜、惠民、快捷！</title>

    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />

    <link rel="stylesheet" href="./css/base.css" />

    <link rel="stylesheet" href="./css/common.css" />

    <link rel="stylesheet" href="./css/index.css" />

  </head>

  <body>

    <!-- 快捷导航 -->

    <div class="shortcut">

      <div class="wrapper">

        <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="#"><span></span>请先登录</a>

          </li>

        </ul>

      </div>

    </div>

2.头部：

<!-- 头部 -->

    <div class="header wrapper">

      <div class="logo">

        <h1><a href="#">小兔鲜儿</a></h1>

      </div>

      <div 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>

      </div>

      <div class="search">

        <input type="text" placeholder="搜一搜" />

        <span></span>

      </div>

      <div class="car">

        <span>2</span>

      </div>

    </div>

 3.banner

<!-- banner -->

    <div class="banner">

      <div class="wrapper">

        <!-- 有几张图就有几个小li -->

        <ul>

          <li>

            <a href="#"><img src="./uploads/banner_1.png" alt="" /></a>

          </li>

        </ul>

        <!-- 侧导航 -->

        <div class="aside">

          <ul>

            <li>

              <a href="#">生鲜<span>水果 蔬菜</span></a>

            </li>

            <li>

              <a href="#">美食<span> 面点 干果</span></a>

            </li>

            <li>

              <a href="#">数码<span>手机 产品</span></a>

            </li>

            <li>

              <a href="#">居家<span>床品 四件套 被枕</span></a>

            </li>

            <li>

              <a href="#">电器<span>电视 冰箱 洗衣机</span></a>

            </li>

            <li>

              <a href="#">洗护<span>洗发 洗护 美妆</span></a>

            </li>

            <li>

              <a href="#">孕婴<span> 奶粉 玩具</span></a>

            </li>

            <li>

              <a href="#">服饰 <span>女装 男装</span></a>

            </li>

            <li>

              <a href="#">杂货<span>户外 图书</span></a>

            </li>

            <li>

              <a href="#">品牌<span>品牌制造</span></a>

            </li>

          </ul>

        </div>

        <!-- 箭头 -->

        <a href="#" class="prev"></a>

        <a href="#" class="next"></a>

        <!-- 小圆点：如果是当前状态：current / active  -->

        <ol>

          <li></li>

          <li class="current"></li>

          <li></li>

          <li></li>

          <li></li>

        </ol>

      </div>

    </div>

4.新鲜好物

<!-- 新鲜好物 -->

    <div class="goods wrapper">

      <!-- hd: header 头部-->

      <div class="hd">

        <h2>新鲜好物<span>新鲜出炉 品质靠谱</span></h2>

        <a href="#">查看全部</a>

      </div>

      <!-- bd body 身体 -->

      <div class="bd clearfix">

        <ul>

          <li>

            <a href="#"><img src="./uploads/new_goods_1.jpg" alt="" /></a>

            <h3>睿米无线吸尘器F8</h3>

            <p>¥<span>899</span></p>

            <b>新品</b>

          </li>

          <li>

            <a href="#"><img src="./uploads/new_goods_2.jpg" alt="" /></a>

            <h3>智能环绕3D空调</h3>

            <p>¥<span>1299</span></p>

            <b>新品</b>

          </li>

          <li>

            <a href="#"><img src="./uploads/new_goods_3.jpg" alt="" /></a>

            <h3>广东软软糯米煲仔饭</h3>

            <p>¥<span>129</span></p>

            <b>新品</b>

          </li>

          <li>

            <a href="#"><img src="./uploads/new_goods_4.jpg" alt="" /></a>

            <h3>罗西机械智能手表</h3>

            <p>¥<span>3399</span></p>

            <b>新品</b>

          </li>

        </ul>

      </div>

    </div>

5.生鲜

 <!-- 生鲜 -->

    <div class="shengxian wrapper">

      <div class="hd">

        <h2>生鲜</h2>

        <a href="#" class="more">查看更多</a>

        <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="#">T恤</a></li>

          <li><a href="#">内衣</a></li>

        </ul>

      </div>

      <div class="bd clearfix">

        <div class="left">

          <a href="#"><img src="./uploads/fresh_goods_cover.png" alt="" /></a>

        </div>

        <div class="right">

          <ul>

            <li>

              <a href="#"><img src="./uploads/fresh_goods_1.jpg" alt="" /></a>

              <h3>美威 智利原味三文鱼排 <br />240g/袋 4片装</h3>

              <p>￥<span>59</span></p>

            </li>

            <li>

              <a href="#"><img src="./uploads/fresh_goods_2.jpg" alt="" /></a>

              <h3>红功夫 麻辣小龙虾1.5kg <br />4-6钱/25-32只</h3>

              <p>￥<span>59</span></p>

            </li>

            <li>

              <a href="#"><img src="./uploads/fresh_goods_3.jpg" alt="" /></a>

              <h3>

                三都港 冷冻无公害黄花鱼 <br />

                700g 2条 袋装

              </h3>

              <p>￥<span>59</span></p>

            </li>

            <li>

              <a href="#"><img src="./uploads/fresh_goods_4.jpg" alt="" /></a>

              <h3>渔公码头 大连鲜食入味<br />即食海参 辽参刺参</h3>

              <p>￥<span>59</span></p>

            </li>

            <li>

              <a href="#"><img src="./uploads/fresh_goods_5.jpg" alt="" /></a>

              <h3>越南白心火龙果4个装<br />标准果400-550g新鲜水果</h3>

              <p>￥<span>59</span></p>

            </li>

            <li>

              <a href="#"><img src="./uploads/fresh_goods_6.jpg" alt="" /></a>

              <h3>广西沃柑 新鲜水果 柑橘<br />1.5kg 新鲜水果</h3>

              <p>￥<span>59</span></p>

            </li>

            <li>

              <a href="#"><img src="./uploads/fresh_goods_7.jpg" alt="" /></a>

              <h3>进口 牛油果 6个装 单果<br />重约130-180g新鲜水果</h3>

              <p>￥<span>59</span></p>

            </li>

            <li>

              <a href="#"><img src="./uploads/fresh_goods_8.jpg" alt="" /></a>

              <h3>泰国进口山竹5A级 500g<br />新鲜水果</h3>

              <p>￥<span>59</span></p>

            </li>

          </ul>

        </div>

      </div>

    </div>

6.版权

    <!-- 版权 -->

    <div class="footer">

      <div class="wrapper">

        <div class="top">

          <ul>

            <li>

              <!-- 通过伪元素添加标签实现精灵图 -->

              <span>价格亲民</span>

            </li>

            <li><span>物流快捷</span></li>

            <li><span>品质新鲜</span></li>

          </ul>

        </div>

        <div class="bottom">

          <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>

    </div>

部分css：文章来源地址https://www.toymoban.com/news/detail-513338.html

/* 清除默认样式 */
/* 去除常见标签默认的 margin 和 padding */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
dl,
dt,
dd,
input {
  margin: 0;
  padding: 0;
}

/* 內减模式 */
* {
  box-sizing: border-box;
}

/* 设置网页统一的字体大小、行高、字体系列相关属性 */
body {
  font: 16px/1.5 'Helvetica Neue', Helvetica, Arial, 'Microsoft Yahei',
    'Hiragino Sans GB', 'Heiti SC', 'WenQuanYi Micro Hei', sans-serif;
  color: #333;
}

/* 去除列表默认样式 */
ul,
ol {
  list-style: none;
}

/* 去除默认的倾斜效果 */
em,
i {
  font-style: normal;
}

/* 去除a标签默认下划线，并设置默认文字颜色 */
a {
  text-decoration: none;
  color: #333;
}

/* 设置img的垂直对齐方式为居中对齐，去除img默认下间隙 */
img {
  vertical-align: middle;
}

/* 去除input默认样式 */
input {
  border: none;
  outline: none;
  color: #333;
}

/* 左浮动 */
.fl {
  float: left;
}

/* 右浮动 */
.fr {
  float: right;
}

/* 双伪元素清除法 */
.clearfix::before,
.clearfix::after {
  content: '';
  display: table;
}
.clearfix::after {
  clear: both;
}

/* 各个页面相同样式表：eg：头部，底部 */
/* 版心 */
.wrapper {
  width: 1240px;
  margin: 0 auto;
}

/* 快捷导航 */
.shortcut {
  height: 52px;
  background-color: #333;
}

.shortcut .wrapper {
  height: 52px;
}

.shortcut .wrapper ul {
  float: right;
}

.shortcut .wrapper ul li {
  float: left;
  line-height: 52px;
}

.shortcut .wrapper ul li a {
  padding: 0 16px;
  font-size: 14px;
  color: #dcdcdc;
  border-right: 1px solid #ccc;
}

.shortcut .wrapper a span {
  display: inline-block;
  width: 11px;
  height: 16px;
  background-image: url(../images/sprites.png);
  background-position: -160px -70px;
  margin-right: 8px;
  vertical-align: middle;
}

/* 头部 */
.header {
  margin: 30px auto;
  height: 70px;
}

.header .logo {
  float: left;
  width: 207px;
  height: 70px;
}

/* logo 搜索引擎优化做法 */
.header .logo h1 {
  width: 207px;
  height: 70px;
}

.header .logo h1 a {
  display: block;
  width: 207px;
  height: 70px;
  background-image: url(../images/logo.png);
  background-size: contain;
  font-size: 0;
}

.header .nav {
  float: left;
  margin-left: 48px;
  height: 70px;
  line-height: 70px;
}

.header .nav ul li {
  float: left;
  margin-right: 48px;
  line-height: 70px;
}

.header .nav ul li a {
  padding-bottom: 7px;
}

.header .nav ul li a:hover {
  color: #27ba9b;
  border-bottom: 1px solid #27ba9b;
}

.header .search {
  position: relative;
  float: left;
  margin-top: 24px;
  margin-left: 34px;
  width: 172px;
  height: 30px;
  border-bottom: 1px solid #e7e7e7;
}

.header .search input {
  margin-left: 30px;
  width: 172px;
  height: 28px;
}

.header .search span {
  position: absolute;
  left: 2px;
  top: 0;
  display: inline-block;
  width: 18px;
  height: 18px;
  background-image: url(../images/sprites.png);
  background-position: -79px -69px;
  vertical-align: middle;
}

.header .car {
  position: relative;
  float: left;
  margin-top: 28px;
  margin-left: 30px;
  width: 23px;
  height: 23px;
  background-image: url(../images/sprites.png);
  background-position: -119px -69px;
}

.header .car span {
  position: absolute;
  right: -13px;
  top: -6px;
  width: 20px;
  height: 15px;
  border-radius: 8px;
  background-color: #e26237;
  font-size: 13px;
  text-align: center;
  line-height: 15px;
  color: #fff;
}

/* 版权 */

.footer {
  height: 340px;
  background-color: #333;
}

.footer .wrapper {
  width: 1393px;
}

.footer .top {
  padding: 60px 0 0 135px;
  height: 175px;
  border-bottom: 1px solid #434343;
}

.footer .top ul li {
  float: left;
  margin-right: 300px;
  width: 195px;
  height: 58px;
  /* background-color: pink; */
}

.footer .top li:last-child {
  margin-right: 0;
}

.footer .top li ::before {
  display: inline-block;
  content: '';
  width: 58px;
  height: 58px;
  background-image: url(../images/sprites.png);
  vertical-align: middle;
}

.footer .top li span {
  font-size: 28px;
  color: #fff;
}

/* 第二个li里面berfore添加背景图位置属性 */
.footer .top li:nth-child(2)::before {
  background-position: -64px 0;
}

.footer .bottom {
  padding-top: 40px;
  font-size: 14px;
  color: #999999;
  text-align: center;
}

.footer .bottom a {
  font-size: 14px;
  color: #999999;
}

.footer .bottom p {
  margin-bottom: 20px;
}

/* index.css的样式 */

.banner {
  height: 500px;
  background-color: #f5f5f5;
}

.banner .wrapper {
  position: relative;
  height: 500px;
}

/* 侧导航 */
.banner .aside {
  position: absolute;
  left: 0;
  top: 0;
  width: 250px;
  height: 500px;
  background-color: rgba(0, 0, 0, 0.8);
}

.banner .aside ul li {
  height: 50px;
  line-height: 50px;
}

.banner .aside a {
  position: relative;
  /*  	display: block 和父级的宽度是一样的*/
  display: block;
  padding-left: 35px;
  padding-right: 19px;
  height: 50px;
  color: #fff;
  font-size: 16px;
}

.banner .aside a span {
  margin-left: 15px;
  color: #fff;
  font-size: 14px;
}
.banner .aside a:hover {
  background-color: #27ba97;
}

/* a的里面最后位置加箭头 */
.banner .aside a::after {
  position: absolute;
  right: 19px;
  top: 19px;
  content: '';
  width: 6px;
  height: 11px;
  background-image: url(../images/sprites.png);
  background-position: -80px -110px;
}

/* 箭头 */
.banner .prev,
.next {
  position: absolute;
  top: 228px;
  width: 45px;
  height: 45px;
  background-image: url(../images/sprites.png);
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 50%;
}

.banner .prev {
  left: 260px;
  background-position: 14px -60px;
}

.banner .next {
  right: 10px;
  background-position: -23px -60px;
}

/* 小圆点 */
.banner ol {
  position: absolute;
  left: 680px;
  bottom: 30px;
  height: 10px;
}

/* cursor: pointer;  箭头变手指样式
   border-radius: 50%;圆角50% */

.banner ol li {
  float: left;
  margin-right: 24px;
  width: 10px;
  height: 10px;
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  cursor: pointer;
}

.banner ol .current {
  background-color: #fff;
}

/* 新鲜好物 */
.goods .hd {
  height: 114px;
  line-height: 114px;
}

.goods .hd h2 {
  float: left;
  height: 114px;
  font-size: 29px;
  font-weight: 400;
}

.goods .hd h2 span {
  margin-left: 34px;
  font-size: 16px;
  color: #999;
}

.goods .hd a,
.shengxian .hd .more {
  float: right;
  margin-right: 16px;
  color: #999;
}

.goods .hd a::after,
.shengxian .hd .more::after {
  content: ' ';
  display: inline-block;
  margin-left: 13px;
  width: 7px;
  height: 13px;
  background-image: url(../images/sprites.png);
  background-position: 0 -110px;
  vertical-align: middle;
}

/* 身体 */
.goods .bd ul li {
  position: relative;
  float: left;
  margin-right: 8px;
  width: 304px;
  height: 405px;
  text-align: center;
  background-color: #f0f9f4;
}

.goods .bd ul li:last-child {
  margin-right: 0;
}

.goods .bd ul li img {
  width: 304px;
}

.goods .bd ul li h3 {
  margin: 20px 0 10px 0;
  font-size: 20px;
  font-weight: 400;
}

.goods .bd ul li p,
.shengxian .bd .right ul li p {
  font-size: 17px;
  color: #9a2e1f;
}

.goods .bd ul li p span,
.shengxian .bd .right ul li p span {
  font-size: 23px;
  font-weight: 400;
  color: #9a2e1f;
}

.goods .bd ul li b {
  position: absolute;
  left: 17px;
  top: 18px;
  width: 28px;
  height: 51px;
  font-size: 18px;
  color: #27ba97;
  font-weight: 400;
  border: 1px solid #27ba97;
  border-radius: 2px;
  line-height: 24px;
}

/* 生鲜 */
.shengxian .hd {
  height: 96px;
  line-height: 96px;
}

.shengxian .hd h2 {
  float: left;
  font-size: 29px;
  font-weight: 400;
}

.shengxian .hd .more {
  float: right;
}

.shengxian .hd ul {
  margin-right: 145px;
}
.shengxian .hd ul li {
  float: right;
}

.shengxian .hd ul li a {
  padding: 2px 7px;
  margin-left: 6px;
}
.shengxian .hd ul li a:hover {
  color: #fff;
  background-color: #27ba97;
}

.shengxian .bd .left {
  float: left;
  width: 240px;
  background-color: pink;
}

.shengxian .bd .right {
  float: right;
  width: 1000px;
  height: 610px;
}

.shengxian .bd .right ul li {
  float: left;
  margin-left: 8px;
}
.shengxian .bd .right ul li a img {
  width: 242px;
  height: 218px;
}

.shengxian .bd .right ul li h3 {
  margin-left: 30px;
  font-size: 18px;
  font-weight: 400;
}
.shengxian .bd .right ul li p {
  margin-left: 30px;
}

到了这里，关于小兔鲜儿-商城APP（静态网页）的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处： 如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：
领支付宝红包 赞助服务器费用

相关文章

  • 登录页的具体实现 (小兔鲜儿)【Vue3】

    登录页的具体实现 (小兔鲜儿)【Vue3】

    整体认识 登录页面的主要功能就是 表单校验和登录登出业务 准备模板 配置路由跳转 为什么需要校验 作用：前端提前校验可以 省去一些错误的请求提交 ，为后端节省接口压力 表单如何进行校验 ElementPlus表单组件内置了表单校验功能，只需要 按照组件要求配置必要参数 即

    2024年02月15日
    浏览(43)
  • 【前端Vue】Vue3+Pinia小兔鲜电商项目第4篇：静态结构搭建和路由配置,1. 准备分类组件【附代码文档】

    【前端Vue】Vue3+Pinia小兔鲜电商项目第4篇：静态结构搭建和路由配置,1. 准备分类组件【附代码文档】

    Vue3+ElementPlus+Pinia开发小兔鲜电商项目完整教程（附代码资料）主要内容讲述：认识Vue3，使用create-vue搭建Vue3项目1. Vue3组合式API体验,2. Vue3更多的优势,1. 认识create-vue,2. 使用create-vue创建项目,1. setup选项的写法和执行时机,2. setup中写代码的特点。什么是pinia，创建空Vue项目并安装

    2024年04月11日
    浏览(34)
  • 小兔鲜商03

    小兔鲜商03

    进入可视区加载数据： 首页有很多模块，如果一次性加载所有数据，很卡，，当移动到要显示的地方，才加载数据 使用 vueuse 库中 useIntersectionObserver 方法，， 传入要监听的元素 target 和监听到这个target去加载的数据api，，， 返回api请求的数据 vue3中获取dom节点： 先声明一个

    2024年02月10日
    浏览(26)
  • css小兔鲜项目搭建

    css小兔鲜项目搭建

    目录 精灵图 精灵图的使用步骤 背景图片大小 background连写 文字阴影 盒子阴影 过渡 骨架标签 SEO三大标签 版心的介绍 css书写顺序  项目结构搭建 精灵图  场景：项目中将多张小图片，合并成一张大图片，这张大图片称之为精灵图   优点：减少服务器发送次数，减轻服务器

    2024年02月09日
    浏览(30)
  • 小兔鲜项目 uniapp （1）

    小兔鲜项目 uniapp （1）

    目录 项目架构 uni-app小兔鲜儿电商项目架构  小兔鲜儿电商课程安排 创建uni-app项目 1.通过HBuilderX创建 2.通过命令行创建 pages.json和tabBar案例 uni-app和原生小程序开发区别  用VS Code开发uni-app项目  拉取小兔鲜儿项目模板代码  基础架构–引入uni-ui组件库 操作步骤 安装类型声明

    2024年02月14日
    浏览(51)
  • web前端综合案例——小兔鲜首页（html+css）

    web前端综合案例——小兔鲜首页（html+css）

    前言：我这里只使用了html和css，js没有使用 项目源代码：https://pan.baidu.com/s/1alnekYEu5F9XwHTW7dO5RA?pwd=qjhd 页面效果：   1.准备项目相应的图片素材，设计稿。 2.创建项目: 2.1 项目名字为：xtx-pc-client 2.2 css里面创建了三个分别为         base.css 这个是全局设置的元素       

    2024年02月07日
    浏览(35)
  • 黑马程序员前端 Vue3 小兔鲜电商项目——（七）详情页

    黑马程序员前端 Vue3 小兔鲜电商项目——（七）详情页

    模板代码 创建 srcviewsDetailindex.vue 文件，添加以下代码： 配置路由 在 srcrouterindex.js 中添加对应路由【 /detail/{goodId} 】： 链接跳转 对 srcviewsHomecomponentsHomeNew.vue 文件及其他涉及商品信息的页面修改路由跳转： 封装接口 在 srcapisdetail.js 文件中封装接口用于获取商品信息

    2024年02月10日
    浏览(47)
  • 黑马程序员前端 Vue3 小兔鲜电商项目——（八）登录页面

    黑马程序员前端 Vue3 小兔鲜电商项目——（八）登录页面

    登录页面的主要功能就是表单校验和登录登出业务。 account password cdshi0080 123456 cdshi0081 123456 cdshi0082 123456 cdshi0083 123456 cdshi0084 123456 cdshi0085 123456 cdshi0086 123456 cdshi0087 123456 cdshi0088 123456 模版代码 在 srcviewsLoginindex.vue 中添加登录页代码： 配置路由跳转 修改 srcviewsLayoutcompon

    2024年02月10日
    浏览(41)
  • 黑马程序员前端 Vue3 小兔鲜电商项目——（二）初始化项目

    黑马程序员前端 Vue3 小兔鲜电商项目——（二）初始化项目

    Vue3是Vue.js最新的主要版本，它已经于2020年9月18日发布。它提供了许多新功能和性能改进，这些改进使得Vue更易于使用和更具可扩展性。 以下是Vue3的一些主要特性： 更快的渲染：Vue3使用重写的响应式系统，它使用Proxy对象来解决Vue2中的性能瓶颈问题。这使得Vue3的渲染速度比

    2024年02月11日
    浏览(34)
  • 黑马程序员前端 Vue3 小兔鲜电商项目——（一）初始化项目

    黑马程序员前端 Vue3 小兔鲜电商项目——（一）初始化项目

    Vue3是Vue.js最新的主要版本，它已经于2020年9月18日发布。它提供了许多新功能和性能改进，这些改进使得Vue更易于使用和更具可扩展性。 以下是Vue3的一些主要特性： 更快的渲染：Vue3使用重写的响应式系统，它使用Proxy对象来解决Vue2中的性能瓶颈问题。这使得Vue3的渲染速度比

    2024年02月15日
    浏览(67)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包，优惠每天领

二维码1

领取红包

二维码2

领红包