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之网上购物系统（注册、登录、浏览商品、添加购物车）
眼看就要期末了,我的专业课也迎来了第二次的期末作业---------<网上购物系统>.虽然老师的意图是在锻炼我们后台的能力,但是想着还是不利用网上的模板,准备自己写,以来别人写的静态页看不 ...

随机推荐

APP切图那些事儿-Android ios
Android Studio学习随笔-UI线程阻塞以及优化
我们在使用手机的时候,经常会遇到一个问题:先是卡死,然后跳出该程序无响应,是否关闭的提示(当然有可能是我们手机性能太差=.=)这是因为线程的阻塞引起的,在这里我讲述一下UI线程,一般处理程序会在UI线 ...
oracle中的层级递归查询操作
oracle中的层级操作非常方便,在使用之后爱不释手,以前要实现该种数据查询操作,需要非常复杂的实现过程.在oracle中通过connect by可以实现前面的目的,通常情况下层级查询基本都能实现递归 ...
date和long的相互转换
import java.text.SimpleDateFormat; import java.util.Date; public class T { public static void main(S ...
快速记忆JavaScript中exec和match的使用
JS模式匹配中exec,match用得非常多,所以掌握其用法对我们进行字符串的处理帮助非常大 1.exec的定义其用法 exec与match主要的不同是,exec是正则表达式里面的方法. ...
编程基础-msdn编程指南笔记
此博仅为笔记,摘自msdn编程指南文档,链接地址:http://msdn.microsoft.com/zh-cn/library/67ef8sbd.aspx 注释:// 单行注释 /* 多行注释*/ ...
Android开发手记(28) Handler和Looper
Android的消息处理有三个核心类:Looper,Handler和Message.其实还有一个Message Queue(消息队列),但是MQ被封装到Looper里面了,我们不会直接与MQ打交道.平 ...
点击文字可以选中相应的checkbox
<html><head><title>中国站长天空-网页特效-表单特效-点击文字选中的复选框</title><meta http-equiv=&q ...
C#中邮件的发送基本操作
本地配置的邮箱:http://localhost:6080/index.php //邮件的收发需要用到两个类 //1.用来创建一封邮件对象 //1.MailMessage 添加对 usin ...
【转】 UINavigationItem UINavigationBar 关系分析
原文:http://blog.csdn.net/luoyeffcs/article/details/16106707 目录 1.关系分析 2.关系综述 3.概念点 4.疑问 1.关系分析 UIBarI ...

html 商品展示框

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

随机推荐

热门专题