web前端入门到实战：制作仿京东商城-商品列表商品筛选功能

原创

于 2019-10-30 14:06:31 发布 · 1.8k 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#web前端 #前端 #前端开发 #前端基础 #编程语言

本文将介绍如何使用web前端技术实现一个仿京东商城的商品列表筛选功能，涵盖HTML和CSS代码实现细节。

这次实现一个仿京东商城-商品列表商品筛选的功能

一、html代码

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>

<div class='container'>
    <div class='filter'>
        <span>已选条件：</span>
        <div class='itme'>
            <!-- <a>
                ×  <span>惠普</span>
            </a> -->
        </div>
    </div>
    <div class='store'>
        <dl>
            <dt>品牌：</dt>
            <dd><div><a>全部</a></div></dd>
            <dd><div><a>惠普(hp)</a></div></dd>
            <dd><div><a>联想(Lenovo)</a></div></dd>
            <dd><div><a>联想(ThinkPad)</a></div></dd>
            <dd><div><a>宏基(acer)</a></div></dd>
            <dd><div><a>华硕</a></div></dd>
            <dd><div><a>戴尔</a></div></dd>
            <dd><div><a>三星</a></div></dd>
            <dd><div><a>索尼</a></div></dd>
            <dd><div><a>东芝</a></div></dd>

最低0.47元/天解锁文章