<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>淘宝购物界面</title>

    </head>

    <body>

        <div style="width: 800px;height: 200px;margin: 300px;">

            <div style="width: 200px;height: 200px;float: left;line-height: 2em;">

                <img src="img/pic_1.jpg"/>

                家用超大式儿童洗澡桶

                <p>￥44</p>

            </div>

            <div style="width: 200px;height: 200px;float: left;line-height: 2em;">

                <img src="img/pic_3.jpg"/>

                实木躺椅

                <p>￥4000</p>

            </div>

            <div style="width: 200px;height: 200px;float: left;line-height: 2em;">

                <img src="img/pic_4.jpg"/>

                高档收藏书法包装字画盒

                <p>￥10</p>

            </div>

            <div style="width: 200px;height: 200px;float: left;line-height: 2em;">

                <img src="img/pic_5.jpg"/>

                2018春夏新款百搭

                <p>￥208</p>

            </div>

        </div>

    </body>

</html>

结果：

Html学习之五（嵌套之简单购物界面设计）的更多相关文章

  1. 我的Android 4 学习系列之创建用户基本界面

    目录 使用视图和布局 理解Fragment 优化布局 创建分辨率无关的用户界面 扩展.分组.创建和使用视图 使用适配器将数据绑定到视图 使用视图和布局 1. Android UI 几个基本概念 视图: ...

  2. day 83 Vue学习之五DIY脚手架、webpack使用、vue-cli的使用、element-ui

      Vue学习之五DIY脚手架.webpack使用.vue-cli的使用.element-ui   本节目录 一 vue获取原生DOM的方式 二 DIY脚手架 三 vue-cli脚手架的使用 四 we ...

  3. .Net程序员安卓学习之路1：登陆界面

    任何编程学习起步均是HelloWorld,作为稍有>net编程经验的我们来说就跳过这步吧,咱们且从简单登录界面开始.先看看效果: 一.准备知识: 1. 安卓环境:安装好JDK,直接去官网下载AD ...

  4. Linux第三周学习总结——构造一个简单的Linux系统MenuOS

    第三周学习总结--构造一个简单的Linux系统MenuOS 作者:刘浩晨 [原创作品转载请注明出处] <Linux内核分析>MOOC课程http://mooc.study.163.com/ ...

  5. Win32简单图形界面程序逆向

    Win32简单图形界面程序逆向 前言 为了了解与学习底层知识,从 汇编开始 -> C语言 -> C++ -> PE文件 ,直至今天的Win32 API,着实学的令我头皮发麻(笑哭). ...

  6. phpunit测试学习 1：一点简单的扼要有用的东西的总结 一点入门认识

    16:45 2015/12/8phpunit测试学习 1:一点简单的扼要有用的东西的总结  一点入门认识 具体的入门安装和入门实践请参照文中的推荐博客或网上其他博客推荐博客,我感觉这几篇博客写得很不错 ...

  7. Quartz定时任务学习（一）简单任务

    学习quartz首先了解三个概念: 调度器:负责调度作业和触发器: 触发器:设置作业执行的时间.参数.条件等:(简单触发器和Cron触发器) 作业:定时任务内容,被执行的程序: 下载必要的jar包,直 ...

  8. python_day2_homework_1（简单购物商城）

    '''简单购物商城(要求):1,商品展示,价格2,买,加入购物车3,付款,钱不够''' 1 #_*_ coding: utf-8 _*_ __author__ = 'A-rno' meu_list_1 ...

  9. C++学习之嵌套类和局部类

    C++学习之嵌套类和局部类 局部类 在一个函数体内定义的类称为局部类. 局部类中只能使用它的外围作用域中的对象和函数进行联系,因为外围作用域中的变量与该局部类的对象无关.在定义局部类时需要注意:局部类 ...

随机推荐

  1. manjaro安装后的配置

    1.添加中科大源 参考https://blog.csdn.net/liyunfu233/article/details/87381017 sudo nano /etc/pacman.conf 在文末添 ...

  2. RabbitMQ学习笔记（五、RabbitMQ集群）

    目录: RabbitMQ集群 镜像队列 RabbitMQ服务日志 RabbitMQ分布式部署 高可用集群 RabbitMQ集群: 1.集群中组件的状态 首先MQ一定要是一个高可用的中间件所以集群肯定是 ...

  3. acwing 55. 连续子数组的最大和

    地址  https://www.acwing.com/problem/content/50/ 输入一个 非空 整型数组,数组里的数可能为正,也可能为负. 数组中一个或连续的多个整数组成一个子数组. 求 ...

  4. 更新GitHub项目出现There is no tracking information for the current branch. Please specify which branch you want to merge with. 怎么解决

    git pull命令用于从另一个存储库或本地分支获取并集成(整合).git pull命令的作用是:取回远程主机某个分支的更新,再与本地的指定分支合并,它的完整格式稍稍有点复杂. 如果当前分支只有一个追 ...

  5. Educational Codeforces Round 76 (Rated for Div. 2) D. Yet Another Monster Killing Problem 贪心

    D. Yet Another Monster Killing Problem You play a computer game. In this game, you lead a party of

  6. 从零开始的微信小程序入门教程(一)

    之前说要和同事一起开发个微信小程序项目,现在也在界面设计,功能定位等需求上开始实施了.所以在还未正式写项目前,打算在空闲时间学习下小程序.本意是在学习过程中结合实践整理出一个较为入门且不是很厚的教程, ...

  7. 【Linux命令】系统状态检测命令8个（ifconfig、uname、uptime、free、who、last、history、sosreport）

    目录 ifconfig获取网卡配置信息 uname查看系统内核版本 uptime查看系统的负载信息 free查看内存信息 who查看当前主机用户的终端信息 last查看系统的登录记录 history查 ...

  8. Mac下如何复制webp图片

      将 WebP 格式图片拖到 Chrome 浏览器标签栏中(浏览器是肯定支持查看的,而且是 Google 自家的),这个时候图片是能够正常查看的.我们右键选中图片,选择「复制图片」. 打开 macO ...

  9. ASH裸数据dba_hist_active_sess_history的分析

    之前在一则案例<记录一则enq: TX - row lock contention的分析过程>使用过这种方法. 因为最近故障处理经常会用到这类查询进行ASH裸数据的分析,下面以m_ash0 ...

  10. IDEA maven设置配置

    IDEA Maven配置 1. 下载maven 下载地址 从官网上,下载一个压缩包,然后解压到任意的文件夹 Maven的安装必须需要jdk1.7+ 2. 环境变量设置 M2_HOME改为具体的路径,其 ...