AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

Bootstrap02 家居商城首页之最新上架&热门家具&分类页面

2023-10-09 36
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： Bootstrap02 家居商城首页之最新上架&热门家具&分类页面

案例1：首页最新上架&热门家居实现

①.页面内容：画像   Figure

②.组件：徽章  Badge

<!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>案例1：首页最新上架&热门家居实现</title>
    <!-- 支持手机端 -->
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <!-- 引入CSS -->
    <link rel="stylesheet" href="CSS/bootstrap.css" />
    <style>
        .navbar-collapse {
            /*1代表弹性扩大占用父容器剩余部分   0代表不占用*/
            flex-grow: 0;
        }
        .active {
            font-weight: bold;
            /*加粗*/
        }
        #carouselExampleCaptions {
            margin-top: 20px;
            /*上间距*/
        }
        .aa {
            border: solid red 2px;
        }
        .bq {
            background-image: url(img/title_bj.png);
            /*背景图片*/
            background-repeat: no-repeat;
            /*不平铺*/
            color: aliceblue;
            /*文字颜色*/
            height: 30px;
            /*高度*/
            line-height: 30px;
            /*行高  垂直居中*/
            padding-left: 15px;
            /*左内间距*/
            font-size: 20px;
            /*文字大小*/
            margin-top: 15px;
            /*上外间距*/
            margin-bottom: 10px;
            /*下内间距*/
        }
    </style>
</head>
<body>
    <!-- 导航条 -->
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
        <!-- 固定容器 -->
        <div class="container">
            <a class="navbar-brand" href="#">你好,欢迎来到集美家居</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
                aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav">
                    <!-- active激活的 -->
                    <li class="nav-item active">
                        <a class="nav-link" href="#">首页<span class="sr-only">(current)</span></a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">分类</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">登录</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link ">注册</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link ">我的购物车</a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
    <!--轮播效果 -->
    <div class="container">
        <div id="carouselExampleCaptions" class="carousel slide" data-ride="carousel">
            <ol class="carousel-indicators">
                <li data-target="#carouselExampleCaptions" data-slide-to="0" class="active"></li>
                <li data-target="#carouselExampleCaptions" data-slide-to="1"></li>
                <li data-target="#carouselExampleCaptions" data-slide-to="2"></li>
            </ol>
            <div class="carousel-inner">
                <div class="carousel-item active">
                    <img src="img/banner1.jpg" class="d-block w-100" alt="...">
                    <div class="carousel-caption d-none d-md-block">
                        <h5>雪王红红火火恍恍惚惚哈哈哈哈</h5>
                        <p>Some representative placeholder content for the first slide.</p>
                    </div>
                </div>
                <div class="carousel-item">
                    <img src="img/banner2.jpg" class="d-block w-100" alt="...">
                    <div class="carousel-caption d-none d-md-block">
                        <h5>Second slide label</h5>
                        <p>Some representative placeholder content for the second slide.</p>
                    </div>
                </div>
                <div class="carousel-item">
                    <img src="img/banner3.jpg" class="d-block w-100" alt="...">
                    <div class="carousel-caption d-none d-md-block">
                        <h5>Third slide label</h5>
                        <p>Some representative placeholder content for the third slide.</p>
                    </div>
                </div>
            </div>
            <button class="carousel-control-prev" type="button" data-target="#carouselExampleCaptions"
                data-slide="prev">
                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                <span class="sr-only">Previous</span>
            </button>
            <button class="carousel-control-next" type="button" data-target="#carouselExampleCaptions"
                data-slide="next">
                <span class="carousel-control-next-icon" aria-hidden="true"></span>
                <span class="sr-only">Next</span>
            </button>
        </div>
        <!-- 最新上架①或②-->
        <!-- 微章方式 ①-->
        <!-- <div class="h2 " style="margin-top: 10px;">
            <span class="badge badge-danger ">最新上架</span>
        </div> -->
        <!-- 背景图片方式② -->
        <div class="bq">
            最新上架
        </div>
        <div class="row">
            <div class="col">
                <!-- 画像  text-center"居中-->
                <figure class="figure  text-center">
                    <img src="img/bz01.jpg" class="figure-img img-fluid rounded" alt="...">
                    <figcaption class="figure-caption"><b>哆啦A梦的抱枕</b>&nbsp;<b>&yen;9.9</b></figcaption>
                </figure>
            </div>
            <div class="col">
                <!-- 画像  text-center"居中-->
                <figure class="figure  text-center">
                    <img src="img/bz02.jpg" class="figure-img img-fluid rounded" alt="...">
                    <figcaption class="figure-caption"><b>哆啦A梦的抱枕</b>&nbsp;<b>&yen;9.9</b></figcaption>
                </figure>
            </div>
            <div class="col">
                <!-- 画像  text-center"居中-->
                <figure class="figure  text-center">
                    <img src="img/bz03.jpg" class="figure-img img-fluid rounded" alt="...">
                    <figcaption class="figure-caption"><b>哆啦A梦的抱枕</b>&nbsp;<b>&yen;9.9</b></figcaption>
                </figure>
            </div>
            <div class="col">
                <!-- 画像  text-center"居中-->
                <figure class="figure  text-center">
                    <img src="img/bz04.jpg" class="figure-img img-fluid rounded" alt="...">
                    <figcaption class="figure-caption"><b>哆啦A梦的抱枕</b>&nbsp;<b>&yen;9.9</b></figcaption>
                </figure>
            </div>
            <div class="col">
                <!-- 画像  text-center"居中-->
                <figure class="figure  text-center">
                    <img src="img/bz05.jpg" class="figure-img img-fluid rounded" alt="...">
                    <figcaption class="figure-caption"><b>哆啦A梦的抱枕</b>&nbsp;<b>&yen;9.9</b></figcaption>
                </figure>
            </div>
        </div>
        <!-- 热门家居 -->
        <div class="bq">
            热门家居
        </div>
        <div class="row">
            <div class="col">
                <!-- 画像  text-center"居中-->
                <figure class="figure  text-center">
                    <img src="img/bz06.jpg" class="figure-img img-fluid rounded" alt="...">
                    <figcaption class="figure-caption"><b>白玫瑰的高贵</b>&nbsp;<b>&yen;89.9</b></figcaption>
                </figure>
            </div>
            <div class="col">
                <!-- 画像  text-center"居中-->
                <figure class="figure  text-center">
                    <img src="img/bz07.jpg" class="figure-img img-fluid rounded" alt="...">
                    <figcaption class="figure-caption"><b>可爱的小熊</b>&nbsp;<b>&yen;49.9</b></figcaption>
                </figure>
            </div>
            <div class="col">
                <!-- 画像  text-center"居中-->
                <figure class="figure  text-center">
                    <img src="img/bz08.jpg" class="figure-img img-fluid rounded" alt="...">
                    <figcaption class="figure-caption"><b>千纸鹤</b>&nbsp;<b>&yen;39.9</b></figcaption>
                </figure>
            </div>
            <div class="col">
                <!-- 画像  text-center"居中-->
                <figure class="figure  text-center">
                    <img src="img/bz09.jpg" class="figure-img img-fluid rounded" alt="...">
                    <figcaption class="figure-caption"><b>玻璃杯</b>&nbsp;<b>&yen;29.9</b></figcaption>
                </figure>
            </div>
            <div class="col">
                <!-- 画像  text-center"居中-->
                <figure class="figure  text-center">
                    <img src="img/bz10.jpg" class="figure-img img-fluid rounded" alt="...">
                    <figcaption class="figure-caption"><b>香薰</b>&nbsp;<b>&yen;19.9</b></figcaption>
                </figure>
            </div>
        </div>
    </div>
    <!-- 引入jQuery的类库 -->
    <!-- 再引入Bootstrap的类库 -->
    <script src="js/jquery-3.6.4.js"></script>
    <script src="js/bootstrap.js"></script>
</body>
</html>

效果图

案例2：分类页面搜索区域Bootstrap实现&栅格框架搭建

①.栅格系统-Grid system

②.表单-Forms

③.输入框组组件-Input group

<!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>案例2：分类页面搜索区域Bootstrap实现&栅格框架搭建</title>
    <!-- 支持手机端 -->
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <!-- 引入CSS -->
    <link rel="stylesheet" href="CSS/bootstrap.css" />
    <style>
        .navbar-collapse {
            /*1代表弹性扩大占用父容器剩余部分   0代表不占用*/
            flex-grow: 0;
        }
        .active {
            font-weight: bold;
            /*加粗*/
        }
        .form-group {
            width: 300px;
            /*宽度*/
            margin-left: auto;
            /*左间距自动*/
            margin-right: auto;
            /*右间距自动*/
        }
        form {
            height: 100px;
            /*高度*/
            background-color: darkgray;
            /*背景颜色*/
            padding-top: 31px;
            /*内间距 100-38=62/2*/
            margin-top: 15px;
            /*上间距*/
            margin-bottom: 15px;
            /*下间距*/
        }
    </style>
</head>
<body>
    <!-- 导航条 -->
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
        <!-- 固定容器 -->
        <div class="container">
            <a class="navbar-brand" href="#">你好,欢迎来到集美家居</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
                aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav">
                    <!-- active激活的 -->
                    <li class="nav-item active">
                        <a class="nav-link" href="#">首页<span class="sr-only">(current)</span></a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">分类</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">登录</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link ">注册</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link ">我的购物车</a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
    <div class="container">
        <!-- 第一行搜索区域 -->
        <div class="row">
            <div class="col">
                <form>
                    <div class="form-group">
                        <div class="input-group mb-3">
                            <input type="text" class="form-control" placeholder="请输入家居关键字"
                                aria-label="Recipient's username" aria-describedby="button-addon2">
                            <div class="input-group-append">
                                <button class="btn btn btn-primary" type="button" id="button-addon2">查询</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <!-- 第 二行-->
        <div class="row">
            <!-- 左侧占三份  为分类 -->
            <div class="col-3" style="background-color: pink;">
                分类
            </div>
            <!-- 右侧占9份  为商品 -->
            <div class="col-9" style="background-color:lavender">
                商品
            </div>
        </div>
    </div>
    <!-- 引入jQuery的类库 -->
    <!-- 再引入Bootstrap的类库 -->
    <script src="js/jquery-3.6.4.js"></script>
    <script src="js/bootstrap.js"></script>
</body>
</html>

效果图

案例3：分类页面分类列表实现&整合

①列表组组件-List group

<!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>案例3：分类页面分类列表实现&整合</title>
    <!-- 支持手机端 -->
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <!-- 引入CSS -->
    <link rel="stylesheet" href="CSS/bootstrap.css" />
    <style>
        .navbar-collapse {
            /*1代表弹性扩大占用父容器剩余部分   0代表不占用*/
            flex-grow: 0;
        }
        .active {
            font-weight: bold;
            /*加粗*/
        }
        .form-group {
            width: 300px;
            /*宽度*/
            margin-left: auto;
            /*左间距自动*/
            margin-right: auto;
            /*右间距自动*/
        }
        form {
            height: 100px;
            /*高度*/
            background-color: darkgray;
            /*背景颜色*/
            padding-top: 31px;
            /*内间距 100-38=62/2*/
            margin-top: 15px;
            /*上间距*/
            margin-bottom: 15px;
            /*下间距*/
        }
    </style>
</head>
<body>
    <!-- 导航条 -->
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
        <!-- 固定容器 -->
        <div class="container">
            <a class="navbar-brand" href="#">你好,欢迎来到集美家居</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
                aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav">
                    <!-- active激活的 -->
                    <li class="nav-item ">
                        <a class="nav-link" href="#">首页<span class="sr-only">(current)</span></a>
                    </li>
                    <li class="nav-item active">
                        <a class="nav-link" href="#">分类</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">登录</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link ">注册</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link ">我的购物车</a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
    <div class="container">
        <!-- 第一行搜索区域 -->
        <div class="row">
            <div class="col">
                <form>
                    <div class="form-group">
                        <div class="input-group mb-3">
                            <input type="text" class="form-control" placeholder="请输入家居关键字"
                                aria-label="Recipient's username" aria-describedby="button-addon2">
                            <div class="input-group-append">
                                <button class="btn btn btn-primary" type="button" id="button-addon2">查询</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <!-- 第 二行-->
        <div class="row">
            <!-- 左侧占三份  为分类 -->
            <div class="col-3">
                <div class="list-group">
                    <a href="#" class="list-group-item list-group-item-action active" aria-current="true">
                        所有商品
                    </a>
                    <a href="#" class="list-group-item list-group-item-action">装饰摆件</a>
                    <a href="#" class="list-group-item list-group-item-action">布艺软饰</a>
                    <a href="#" class="list-group-item list-group-item-action">墙饰壁挂</a>
                    <a href="#" class="list-group-item list-group-item-action">蜡艺香薰</a>
                    <a class="list-group-item list-group-item-action disabled">创意家居</a>
                </div>
            </div>
            <!-- 右侧占9份  为商品 -->
            <div class="col-9">
                <!--大PC一行4列  中PC一行3列  平板一行2列  -->
                <div class="row">
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <figure class="figure  text-center">
                            <img src="img/bz01.jpg" class="figure-img img-fluid rounded" alt="...">
                            <figcaption class="figure-caption"><b>白玫瑰的高贵</b>&nbsp;<b>&yen;89.9</b></figcaption>
                        </figure>
                    </div>
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <figure class="figure  text-center">
                            <img src="img/bz02.jpg" class="figure-img img-fluid rounded" alt="...">
                            <figcaption class="figure-caption"><b>白玫瑰的高贵</b>&nbsp;<b>&yen;89.9</b></figcaption>
                        </figure>
                    </div>
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <figure class="figure  text-center">
                            <img src="img/bz03.jpg" class="figure-img img-fluid rounded" alt="...">
                            <figcaption class="figure-caption"><b>白玫瑰的高贵</b>&nbsp;<b>&yen;89.9</b></figcaption>
                        </figure>
                    </div>
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <figure class="figure  text-center">
                            <img src="img/bz04.jpg" class="figure-img img-fluid rounded" alt="...">
                            <figcaption class="figure-caption"><b>白玫瑰的高贵</b>&nbsp;<b>&yen;89.9</b></figcaption>
                        </figure>
                    </div>
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <figure class="figure  text-center">
                            <img src="img/bz05.jpg" class="figure-img img-fluid rounded" alt="...">
                            <figcaption class="figure-caption"><b>白玫瑰的高贵</b>&nbsp;<b>&yen;89.9</b></figcaption>
                        </figure>
                    </div>
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <figure class="figure  text-center">
                            <img src="img/bz06.jpg" class="figure-img img-fluid rounded" alt="...">
                            <figcaption class="figure-caption"><b>白玫瑰的高贵</b>&nbsp;<b>&yen;89.9</b></figcaption>
                        </figure>
                    </div>
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <figure class="figure  text-center">
                            <img src="img/bz07.jpg" class="figure-img img-fluid rounded" alt="...">
                            <figcaption class="figure-caption"><b>白玫瑰的高贵</b>&nbsp;<b>&yen;89.9</b></figcaption>
                        </figure>
                    </div>
                    <div class="col-lg-3 col-md-4 col-sm-6">
                        <figure class="figure  text-center">
                            <img src="img/bz08.jpg" class="figure-img img-fluid rounded" alt="...">
                            <figcaption class="figure-caption"><b>白玫瑰的高贵</b>&nbsp;<b>&yen;89.9</b></figcaption>
                        </figure>
                    </div>
                </div>
            </div>
        </div>
        <!-- 引入jQuery的类库 -->
        <!-- 再引入Bootstrap的类库 -->
        <script src="js/jquery-3.6.4.js"></script>
        <script src="js/bootstrap.js"></script>
</body>
</html>

效果图


文章标签：
前端开发
关键词：
Bootstrap页面
瑶大头*^_^*
目录
相关文章
六月的雨在钉钉
|
6月前
bootstrap+thymeleaf 页面多选回显时莫名其妙多了
【1月更文挑战第5天】bootstrap+thymeleaf 页面多选回显时莫名其妙多了 问题分析处理
六月的雨在钉钉
140 0
爱吃豆的土豆
|
前端开发 JavaScript
Javascript知识【BootStrap技术实现商品页面】（下）
Javascript知识【BootStrap技术实现商品页面】
爱吃豆的土豆
69 0
可为编程
|
JSON 前端开发 JavaScript
BootStrap框架下使用JS动态加载table并点击相关列弹出二级页面
在这里记录一下，也是在公司用到的一个例子，刚刚解决，正好趁热打铁。前端页面是采用BootStrap框架搭建的，主要的样式涉及到项目，在这里就不截图了，直接上代码：
可为编程
109 1
瑶大头*^_^*
Bootstrap03购物车页面&登录注册界面&其他组件使用
Bootstrap03购物车页面&登录注册界面&其他组件使用
瑶大头*^_^*
143 0
云内容小助手
|
Web App开发 弹性计算 前端开发
实验4 利用 BootStrap 创建简单页面| 学习笔记
快速学习实验4 利用 BootStrap 创建简单页面
云内容小助手
238 0
实验4 利用 BootStrap 创建简单页面| 学习笔记
后除
|
前端开发 JavaScript 容器
Bootstrap实战 - 单页面网站
单页面结构简单、布局清晰，常常用来做手机 App 或者某个产品的下载介绍页面。现在，展示型网页整体趋向于单页网站设计，这样一次性把核心信息展现出来，对于用户来说更加直观和简单，能够快速了解一个产品。
后除
286 0
Bootstrap实战 - 单页面网站
痴者工良
|
移动开发 前端开发 JavaScript
Bootstrap 4/3 页面基础模板 与 兼容旧版本浏览器
Bootstrap 4/3 页面基础模板 与 兼容旧版本浏览器
痴者工良
453 0
程序员大阳
|
前端开发 Java Spring
Spring之路(22)–SpringMVC+Bootstrap开发博客系统实例(引入Boostrap并实现浏览博客页面)
本文目录 1.背景 2. 浏览博客功能实现 3. 导入Bootsrap 4. 利用Bootstrap样式美化表格 5. 利用Bootstrap添加导航栏 6. 添加修改、删除链接 7. 总结
程序员大阳
283 0
Spring之路(22)–SpringMVC+Bootstrap开发博客系统实例(引入Boostrap并实现浏览博客页面)
怡泽堂堂主
|
前端开发 JavaScript Android开发
快速构建网站或移动端页面：关于Bootstrap的学习笔记
最近在设计官网，并进行一些项目的原型设计和开发，寻找了很久，想找到一个更简单、快速的方式，基于一些已有的模板或框架进行快速建设，结果发现很多时间都是徒劳，走过的路分享给大家，以防再度踩坑
怡泽堂堂主
1802 0
mcy247
|
前端开发 容器
Bootstrap~页面的布局
mcy247
1179 0

热门文章

最新文章

  • 1
    start.aliyun.com 正式上线！极速构建 bootstrap 应用
  • 2
    PHPStorm中使用bootstrap3控件！
  • 3
    Bootstrap的两种引入方式，本地方式和CDN方式
  • 4
    Bootstrap系列 -- 12. 水平表单
  • 5
    Bootstrap的学习以及简单运用
  • 6
    Bootstrap-轮播图-No.2
  • 7
    使用国人的koala来重新预编译BOOTSTRAP的LESS文件
  • 8
    bootstrap51-Bootstrap 基本的输入框组
  • 9
    bootstrap-表单控件——输入框input
  • 10
    bootstrap-带有头和尾的面板
  • 1
    详细解读BootStrap智能表单系列八表单配置json详解
    33
  • 2
    Bootstrap 3.x 版本基础引入指南
    90
  • 3
    【干货】通过Bootstrap框架添加下拉框到导航栏
    43
  • 4
    基于SpringBoot+Bootstrap【爱码个人博客系统】附源码
    137
  • 5
    基于SSM+Bootstrap【爱校教务系统管理系统】附源码
    26
  • 6
    ThinkPHP+Bootstrap简约自适应网址导航网站源码
    75
  • 7
    Bootstrap-Switch开关控件使用指南
    125
  • 8
    bootstrap table 设置自定义列宽
    932
  • 9
    R语言广义线性混合模型（GLMM）bootstrap预测置信区间可视化
    99
  • 10
    【专栏：HTML与CSS实践篇】CSS框架（Bootstrap/Foundation）快速上手
    122

    • 相关课程

    更多
  • 前端开发框架Bootstrap使用教程
  • 实时数据应用：实现淘宝母婴订单实时查询和可视化

    • 相关电子书

    更多
  • 个性化app-推荐技术在手淘的全面应用
  • 爆款App小咖秀产品服务端架构设计分享
  • 爆款APP小咖秀产品服务端架构设计分享

    • 相关实验场景

    更多
  • 在PAI ArtLab一键实现欧洲杯粉丝专属贴纸制作
  • 实现淘宝母婴订单实时查询和实时大屏
  • 收银台的场景化界面实践
  • 网站用户流量分析—适用于电商网站、资讯网站、游戏主站等各类Web站点场景
  • 小试牛刀，一键部署电商商城
    • 下一篇
    阿里云OSS设置跨域访问