ジャンゴ06ショッピングモールプロジェクトは、（設定データテーブルaxf_shop、axf_mainshow、店のバー、好ましくは商品コラム）

1、データテーブルaxf_shop

テンプレート：

移行：

#生成迁移文件：
python manage.py makemigrations
#执行迁移文件：
python manage.py migrate

データを挿入します。

2、列ストア

見ます：

#这里提示一个快捷键：Ctrl + Shift + Alt + j  pycharm一键选择、修改多个相同变量、符号、值

home.html

home.css

/*商店*/
.shop_container h2 img {
    width: 100%;
}

.shop_container fieldset {
    border: none;
    padding: 0;
}

.shop_container fieldset > a {
    display: inline-block;
    width: 49%;
}

.shop_container fieldset img {
    width: 100%;
}

.shop_container ul {
    display: flex;
}

.shop_container ul li {
    width: 2.5rem;
    text-align: center;
    font-size: 0.35rem;
}

.shop_container ul li img {
    width: 2.5rem;
}

.shop_container ol {
    display: flex;
    flex-wrap: wrap;
}

.shop_container > ol a {
    display: block;
}

.shop_container ol li {
    list-style: none;
    width: 5rem;
}

.shop_container ol a img {
    width: 100%;
}

アクセス：

3、好ましくは商品コラム

新しいデータ表axf_mianshow
テンプレートアプリケーション/モデル：

class MainShow(Main):
    # 分类的id
    categoryid = models.IntegerField(default=1)
    # 名称
    brandname = models.CharField(max_length=64)
    # 图片
    img1 = models.CharField(max_length=255)
    # 分类
    childcid1 = models.IntegerField(default=1)
    # 商品编码
    productid1 = models.IntegerField(default=1)
    # 长名字
    longname1 = models.CharField(max_length=128)
    # 价格
    price1 = models.FloatField(default=1)
    # 超市价格
    marketprice1 = models.FloatField(default=0)

    img2 = models.CharField(max_length=255)
    childcid2 = models.IntegerField(default=1)
    productid2 = models.IntegerField(default=1)
    longname2 = models.CharField(max_length=128)
    price2 = models.FloatField(default=1)
    marketprice2 = models.FloatField(default=0)

    img3 = models.CharField(max_length=255)
    childcid3 = models.IntegerField(default=1)
    productid3 = models.IntegerField(default=1)
    longname3 = models.CharField(max_length=128)
    price3 = models.FloatField(default=1)
    marketprice3 = models.FloatField(default=0)

    class Meta:
        db_table = 'axf_mainshow'

データを挿入します。

INSERT INTO `axf`.`axf_mainshow`(`main_ptr_id`, `categoryid`, `brandname`, 
`img1`, `childcid1`, `productid1`, `longname1`, `price1`, `marketprice1`, `img2`, 
`childcid2`, `productid2`, `longname2`, `price2`, `marketprice2`, `img3`, `childcid3`, 
`productid3`, `longname3`, `price3`, `marketprice3`) VALUES (25, 1003, '水果特卖', 
'/static/axf/img/1001.png', 10011, 100111, '红石榴', 25.8, 26.6, 
'/static/axf/img/1002.png', 10021, 10012, '绿番茄', 1.5, 1.5, 
'/static/axf/img/1003.png', 10031, 10013, '迷你南瓜', 3.66, 3.65);

视图：

home.html

        {#    首页主显示#}
        <div>
            <ul>
                {% for main_show in main_shows %}
                    <li class="mainInfo">
                        <section>
                            <h3>
                                {{ main_show.name }}
                                <a>更多&gt;</a>
                                <span></span>
                            </h3>
                            <div><a><img src="{{ main_show.img }}" alt="{{ main_show.name }}"></a></div>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="{{ main_show.img1 }}" alt="{{ main_show.longname1 }}">
                                        <p class="description">{{ main_show.longname1 }}</p>
                                        <span>{{ main_show.price1 }}</span>
                                        <s>{{ main_show.marketprice1 }}</s>
                                    </a>
                                    <button>
                                        <span>+</span>
                                    </button>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="{{ main_show.img2 }}" alt="{{ main_show.longname2 }}">
                                        <p class="description">{{ main_show.longname2 }}</p>
                                        <span>{{ main_show.price2 }}</span>
                                        <s>{{ main_show.marketprice2 }}</s>
                                    </a>
                                    <button>
                                        <span>+</span>
                                    </button>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="{{ main_show.img3 }}" alt="{{ main_show.longname3 }}">
                                        <p class="description">{{ main_show.longname3 }}</p>
                                        <span>{{ main_show.price3 }}</span>
                                        <s>{{ main_show.marketprice3 }}</s>
                                    </a>
                                    <button>
                                        <span>+</span>
                                    </button>
                                </li>
                            </ul>
                        </section>
                    </li>
                {% endfor %}

            </ul>
        </div>

home.css

/*主显示*/
.mainInfo {
    background-color: white;
}

.mainInfo > section {
    margin: 0.2rem auto 0;
    padding: 0.2rem 0;
    width: 9.2rem;
}

.mainInfo > section h3 {
    text-align: center;
    height: 1.2rem;
    position: relative;

}

.mainInfo > section h3 a {
    color: grey;
    font-size: 0.3rem;
    line-height: 0rem;
    position: absolute;
    right: 0.1rem;
    display: block;
}

.mainInfo > section h3 > span {
    background-color: yellow;
    width: 0.6rem;
    height: 0.1rem;
    position: absolute;
    bottom: 0.25rem;
    left: 4.3rem;
}

.mainInfo > section > div > a > img {
    width: 100%;
}

.mainInfo > section > ul {
    display: flex;
    justify-content: space-around;
}

.mainInfo > section > ul > li {
    width: 2.6rem;
    position: relative;

}

.mainInfo > section > ul > li > a > span:before {
    color: red;
    content: "￥";
}

.mainInfo > section > ul > li > a {
    font-size: 0.4rem;
    color: red;
    display: block;
}

.mainInfo > section > ul > li > a > img {
    width: 100%;
}

.mainInfo > section > ul > li > a > s {

    color: gray;
    font-size: 0.3rem;
}

.mainInfo > section > ul > li > a > s:before {

    color: gray;
    content: "￥";
}

.mainInfo .description {
    font-size: 0.37rem;
    color: black;
    display: block;
    line-height: 1.2rem;
    height: 2.4rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;

}

.mainInfo > section > ul > li > button {
    border: 1px solid lightgray;
    border-radius: 1111px;
    width: 0.6rem;
    height: 0.6rem;
    display: block;
    line-height: 0.0rem;
    text-align: center;
    color: orange;
    font-size: 0.6rem;
    position: absolute;
    right: 0;
    top: 3.6rem;
    background: white;
}

.mainInfo > section > ul > li > button > span {
    position: relative;
    margin: auto;
}

アクセス：