<!DOCTYPE html>

<!-- 睡觉,2018-6-24 22:04:36  还有foot没弄好明天弄-->

<html>

<head>

    <meta content="text/html" charset="utf-8">

    <title>网上书城</title>

</head>

<body>

<div id="page">

    <div id="top">

        <!-- table标签指定宽度  -->

        <table width="100%">

            <tr>

                <td width="70%"><img src="bookstore/images/logo.png"></td>

                <td align="right">

                    <img alt="" src="bookstore/images/cart.gif">

                    <a>购物车</a>|<a>帮助中心</a>|<a>我的帐户</a>|<a>新用户注册</a>

                </td>

            </tr>

        </table>

    </div>

</div>

    <!-- menu菜单 -->

    <div id="menu">

        <table width="100%" bgcolor="gray">

            <tr align="center">

                <td><a href="#"></a><font color="white">语文</font></td>

                <td><a href="#"></a><font color="white">数学</font></td>

                <td><a href="#"></a><font color="white">外语</font></td>

                <td><a href="#"></a><font color="white">物理</font></td>

                <td><a href="#"></a><font color="white">化学</font></td>

                <td><a href="#"></a><font color="white">生物</font></td>

                <td><a href="#"></a><font color="white">政治</font></td>

                <td><a href="#"></a><font color="white">历史</font></td>

                <td><a href="#"></a><font color="white">地理</font></td>

                <td><a href="#"></a><font color="yellow">全部商品目录</font></td>

            </tr>

        </table>

    </div>

    <!-- search 搜索-->

    <div id="search">

        <table width="100%" bgcolor="#B4B486">

            <tr>

                <td align="right">search &nbsp; <input type="text" ><input type="button" value="搜索">&nbsp;        </td>

            </tr>

        </table>

    </div>

    <!-- content 内容 -->

    <div id="content">

        <!--访问的位置-->

        <table width="100%">

            <tr >

                <td align="right">首页 &nbsp;>旅游&nbsp;>图书列表&nbsp;</td>

            </tr>

        </table>

        <!--标题-->

        <h1>商品目录</h1>

        <hr>

        <h1>计算机类</h1>

        共有xx种商品

        <hr>

        <!--产品列表图片-->

        <img src="./bookstore/images/productlist.gif" width="100%">

        <!--图书展示-->

        <table width="100%">

            <tr >

                <td align="center">

                    <div><img src="./bookstore/bookcover/101.jpg"></div>

                    <span>书名:xxx</span><br>

                    <span>价钱:88.88</span>

                </td>

                <td align="center">

                    <div><img src="./bookstore/bookcover/102.jpg"></div>

                    <span>书名:xxx</span><br>

                    <span>价钱:88.88</span>

                </td>

                <td align="center">

                    <div><img src="./bookstore/bookcover/103.jpg"></div>

                    <span>书名:xxx</span><br>

                    <span>价钱:88.88</span>

                </td>

                <td align="center">

                    <div><img src="./bookstore/bookcover/104.jpg"></div>

                    <span>书名:xxx</span><br>

                    <span>价钱:88.88</span>

                </td>

                <td align="center">

                    <div><img src="./bookstore/bookcover/105.jpg"></div>

                    <span>书名:xxx</span><br>

                    <span>价钱:88.88</span>

                </td>

                <td align="center">

                    <div><img src="./bookstore/bookcover/106.jpg"></div>

                    <span>书名:xxx</span><br>

                    <span>价钱:88.88</span>

                </td>

            </tr>

        </table>

        <table width="100%">

            <tr >

                <td align="center">

                    <div><img src="./bookstore/bookcover/101.jpg"></div>

                    <span>书名:xxx</span><br>

                    <span>价钱:88.88</span>

                </td>

                <td align="center">

                    <div><img src="./bookstore/bookcover/102.jpg"></div>

                    <span>书名:xxx</span><br>

                    <span>价钱:88.88</span>

                </td>

                <td align="center">

                    <div><img src="./bookstore/bookcover/103.jpg"></div>

                    <span>书名:xxx</span><br>

                    <span>价钱:88.88</span>

                </td>

                <td align="center">

                    <div><img src="./bookstore/bookcover/104.jpg"></div>

                    <span>书名:xxx</span><br>

                    <span>价钱:88.88</span>

                </td>

                <td align="center">

                    <div><img src="./bookstore/bookcover/105.jpg"></div>

                    <span>书名:xxx</span><br>

                    <span>价钱:88.88</span>

                </td>

                <td align="center">

                    <div><img src="./bookstore/bookcover/106.jpg"></div>

                    <span>书名:xxx</span><br>

                    <span>价钱:88.88</span>

                </td>

            </tr>

        </table>

    </div>

    <!-- foot 顶部 -->

    <div id="foot">

        <table width="100%" bgcolor="#EFEEDC">

            <tr>

                <tb rowspan="2" width="50%" align="center">

                    <img src="./bookstore/images/logo.png">

                </tb>

                <tb>CONTACT IS</tb>

            </tr>

            <tr align="right">copyright 2018 @吾皇万岁 </tr>

        </table>

    </div>

</body>

</html>

6.24 html书城Demo的更多相关文章

  1. Bridge.NET

    块作用域闭包问题 结果正确:1 容易引入JSB:1 public class Program { static List<Action> createActions() { List< ...

  2. Greenplum 在Linux下的安装

    1.实验环境 1.1.硬件环境 Oracle VM VirtualBox虚拟机软件:三台Linux虚拟机:Centos 6.5:数据库:greenplum-db-4.3.9.1-build-1-rhe ...

  3. Xamarin.Forms入门学习路线

    Xamarin 介绍 Xamarin是一套跨平台解决方案,目的是使用C#语言创造原生的iOS,Android,Mac和Windows应用. Xamarin的三个优势: Xamarin App拥有原生A ...

  4. etrace跟踪Nginx代码+ FASTCGI

    http://blog.csdn.net/jianqiangchen/article/details/29175285 http://blog.csdn.net/jianqiangchen/artic ...

  5. JDBC与javaBean

    1.JDBC的概念: Java数据库连接技术(Java DataBase Connectivity)能实现java程序对各种数据库的访问, 由一组使用java语言编写的类 和 接口(jdbc api) ...

  6. css 动画 transform transition animation

    1.transform  transform 是通过在浏览器里面让网页元素 移动 旋转 透明 模糊 等方法来实现改变其外观的技术 -webkit-transform : translate(3em,0 ...

  7. vue.js自定义指令入门

    Vue.js 允许你注册自定义指令,实质上是让你教 Vue 一些新技巧:怎样将数据的变化映射到 DOM 的行为.你可以使用Vue.directive(id, definition)的方法传入指令id和 ...

  8. 【高德地图API】从零开始学高德JS API（三）覆盖物——标注|折线|多边形|信息窗口|聚合marker|麻点图|图片覆盖物

    原文:[高德地图API]从零开始学高德JS API(三)覆盖物——标注|折线|多边形|信息窗口|聚合marker|麻点图|图片覆盖物 摘要:覆盖物,是一张地图的灵魂.有覆盖物的地图,才是完整的地图.在 ...

  9. 更有效率的使用Visual Studio2

    PS色调均化滤镜的快捷实现(C#源代码). photoshop色调均化功能通常是在进行修片处理前期比较常用的功能之一,其对扩展图像的对比度,增强视觉效果有一定的作用.在很多课本或者文章中,也称这种处理 ...

随机推荐

  1. vscode 中使用php-cs-fixer和PHP Formatter 插件规范化PHP代码

    什么是PHP-CS-Fixer?    它是php-fig组织定义的PHP代码规范,良好的代码规范可以提高代码可读性,团队沟通维护成本    使用它可以按照指定的规范格式化您的PHP代码,此工具不仅可 ...

  2. linux下使用mingw编译NSIS-3.03

    简述 最近在研究使用NSIS做安装包,语法不算复杂,插件也很多,中文资料也不少,还挺好用的.先后用NSIS做出了安装和卸载需要输入密码,通过自定义页面实现安装时候选择多个目录.安装的时候输入配置文件信 ...

  3. C语言100个经典的算法

    C语言的学习要从基础開始.这里是100个经典的算法-1C语言的学习要从基础開始,这里是100个经典的算法 题目:古典问题:有一对兔子,从出生后第3个月起每一个月都生一对兔子.小兔 子长到第三个月后每一 ...

  4. MongoDB中MapReduce介绍与使用

    一.简介 在用MongoDB查询返回的数据量很大的情况下,做一些比较复杂的统计和聚合操作做花费的时间很长的时候,可以用MongoDB中的MapReduce进行实现 MapReduce是个非常灵活和强大 ...

  5. 阿里云日志服务采集自建Kubernetes日志(标准输出日志)

    日志服务支持通过Logtail采集Kubernetes集群日志,并支持CRD(CustomResourceDefinition)进行采集配置管理.本文主要介绍如何安装并使用Logtail采集Kuber ...

  6. [原创]茗洋AaronYang的 jquery.myselect.js 我的一次前端突破[上]

    [评论,楼层数为30的倍数的,我送你我自己的博客园的皮肤,该博客参与活动]   介绍 myselect 自己原创的js插件   这是一个可以可以支持ie6+的所有浏览器的,适应很多场景和需求的一个下拉 ...

  7. wamp设置实现本机IP或者局域网访问

    在 httpd.conf 中查找 Allow from 127.0.0.1 Order Deny,Allow Deny from all Allow from 127.0.0.1 在此下面加上 All ...

  8. webpack 使用别名（resolve.alias）解决scss @import相对路径导致的问题

    webpack.conf.js 中 resolve.alias 配置 resolve: { extensions: ['.js', '.vue'], alias: { '@': path.resolv ...

  9. 小矮人Javascript模块加载器

    https://github.com/miniflycn/webkit-dwarf 短小精悍的webkit浏览器Javascript模块加载器 Why 我们有许多仅基于webkit浏览器开发的应用 无 ...

  10. yarn 常用命令(基于vue框架)

    初始化项目 yarn add init 安装vue yarn add vue 安装webpack,webpack-dev-server(是一个小型的Node.js Express服务器) yarn a ...