html 商品展示框

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>LNG罐车</title>

<style>

body,  ul, li {

    margin: 0px;

    padding: 0px;

}

.wrapper {

    width: 1000px;

    margin:  auto;

    position: relative;

}

.nav-mod {

    position: relative;

    z-index: ;

}

h3.topic_title {

    border-bottom: 2px solid #BDCFDC;

    font-size: 14px;

    padding-left: 18px;

    margin-bottom: 20px;

}

.categoryhd {

    border-bottom: 2px solid #0759C4;}

.categoryhd { position:relative; height:40px; line-height:40px;  }

.categoryhd { border-bottom:2px solid #0759c4; }

.more-mod {

    position: absolute;

    bottom: 6px;

    right: 0px;

    padding: 0px 30px 0px 20px;

    height: 20px;

    line-height: 20px;

    display: block;

    font-family: simsun;

    color: #;

}

.goods_request{

    height: 293px;

    border-right: 1px solid #E3E3E3;

    border-width: 0px 1px 1px;

    border-style: none solid solid;

    border-color: -moz-use-text-color #E3E3E3 #E3E3E3;

    -moz-border-top-colors: none;

    -moz-border-right-colors: none;

    -moz-border-bottom-colors: none;

    -moz-border-left-colors: none;

    border-image: none;

}

.goods_request.first{

    width: 233px;

    border-left: 0px none;

}

.goods_request li {

    float: left;

    width: 234px;

    border-left: 1px solid #E3E3E3;

}

</style>

</head>

<body>

   <div class="wrapper">

    <div class="nav-mod categoryhd">

        <h3>LNG罐车需求</h3>

        <a href="#" target="_blank" class="more-mod">更多><i></i></a>

    </div>

        <ul class="goods_request">

      <li class="first">

          <img src="LNG罐车/tu.png"/>

      </li>

        <li>

          <div>

         <img src="LNG罐车/tu.png"/>

        </div>

     </li>

             <li>

          <div>

         <img src="LNG罐车/tu.png"/>

        </div>

     </li>

      <li>

          <div>

         <img src="LNG罐车/tu.png"/>

        </div>

     </li>

        </ul>

       </div>

</body>

</html>

展示图：

aaarticlea/png;base64,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" alt="" />

html 商品展示框的更多相关文章

HTML网页设计基础笔记 • 【第4章 CSS3基础】
全部章节 >>>> 本章目录 4.1 CSS 概述 4.1.1 CSS 简介 4.1.2 CSS3 基本语法 4.1.3 样式表的分类 4.2 CSS 基本选择器 4.2. ...
如何一步一步用DDD设计一个电商网站（四）—— 把商品卖给用户
阅读目录前言怎么卖领域服务的使用回到现实结语一.前言上篇中我们讲述了“把商品卖给用户”中的商品和用户的初步设计.现在把剩余的“卖”这个动作给做了.这里提醒一下,正常情况下,我们的每一步业 ...
DDD 领域驱动设计-商品建模之路
最近在做电商业务中,有关商品业务改版的一些东西,后端的架构设计采用现在很流行的微服务,有关微服务的简单概念: 微服务是一种架构风格,一个大型复杂软件应用由一个或多个微服务组成.系统中的各个微服务可被独 ...
【Machine Learning】决策树案例：基于python的商品购买能力预测系统
决策树在商品购买能力预测案例中的算法实现作者:白宁超 2016年12月24日22:05:42 摘要:随着机器学习和深度学习的热潮,各种图书层出不穷.然而多数是基础理论知识介绍,缺乏实现的深入理解.本 ...
电商系统中的商品模型的分析与设计—续
前言在<电商系统中的商品模型的分析与设计>中,对电商系统商品模型有一个粗浅的描述,后来有博友对货品和商品的区别以及属性有一些疑问.我也对此做一些研究,再次简单的对商品模型做一个介 ...
Redis命令拾遗四（集合类型）—包含简单搜索筛选商品设计实例。
本文版权,归博客园和作者吴双共同所有.转载和爬虫请注明博客园蜗牛Redis系列文章地址 http://www.cnblogs.com/tdws/tag/NoSql/ Redis数据类型之集合(Set) ...
C#开发微信门户及应用(23)-微信小店商品管理接口的封装和测试
在上篇<C#开发微信门户及应用(22)-微信小店的开发和使用>里面介绍了一些微信小店的基础知识,以及对应的对象模型,本篇继续微信小店的主题,介绍其中API接口的封装和测试使用.微信小店的相 ...
python推荐淘宝物美价廉商品
完成的目标: 输入搜索的商品以及淘宝的已评价数目.店铺的商品描述(包括如实描述.服务态度.快递的5.0打分): 按要求,晒选出要求数量的结果,并按"物美价廉算法"排序后输出思 ...
Java Web之网上购物系统（注册、登录、浏览商品、添加购物车）
眼看就要期末了,我的专业课也迎来了第二次的期末作业---------<网上购物系统>.虽然老师的意图是在锻炼我们后台的能力,但是想着还是不利用网上的模板,准备自己写,以来别人写的静态页看不 ...

随机推荐

android 37 线程通信Looper
安卓程序的主线程也叫UI线程. 工作线程和主线程的差别:安卓主线程已经调用了Looper.prepare()方法了,已经有一个MessageQueue对象了,所以才可以在工作线程用Handler发消息 ...
TCP SOCKET中backlog参数的用途是什么？ ---图解
recv_queue中的包大小,为内核的包大小,而不是ip包大小. 如果发出去的包太大,需要修改write_queue和tx_queue两个参数,tx_queue主要是流量控制. 多进程必须在sock ...
Qss
*{ font-size:13px; color:white; font-family:"宋体"; } CallWidget QLineEdit#telEdt { font-siz ...
了解ANSI编码
ANSI:American National Standards Institute:美国国家标准学会 ANSI编码:为使计算机支持更多语言,不同国家和地区分别制定了符合自身的外文字符延伸编码方式(如 ...
AS插件开发 RemoveButterKnife从构思到实现
ReomveButterKnife插件这是一个用于移除代码中对ButterKnife使用的AS插件,接下来我们将从头开始讲讲这个插件的开发过程地址是 https://github.com/u3sh ...
CakePHP的blog教程三
简单的身份验证和授权应用接着我们blog教程的例子,如果我们想要建立一个根据登录的用户身份来决定其安全访问到正确的urls. 同时我们还有其他的需求: 允许我们的blog有多个作者,每一个作者都可以 ...
含有GROUP BY子句的查询中如何显示COUNT（）为0的成果（分享）
在SQL Server数据库查询中,为了对查询成果进行对比.解析,我们经常会用到GROUP BY子句以及COUNT()函数来对查询成果进行分类.统计等.然则我们在应用的过程中往往会存在一些题目,本文我 ...
Adb工具常用操作（一）
一.启动或关闭server 1.3 Android SDK中的常用命令行工具在<Android SDK安装目录>\tools目录中带了很多命令行工具.虽然一般的开发人员并不需要完全掌握 ...
Android开发app如何设定应用图标下的应用名称为汉字以及自定义图标
一.应用名称为汉字二.自定义图标
Hash - a javascript dictionary object.
Hash,in wikipedia, may relevant to many stuffs. In javascript, hash is a group of name/value pairs w ...

html 商品展示框

html 商品展示框的更多相关文章

随机推荐

热门专题