小米耳机页面

 <style>

       * {

            margin: 0;

            padding: 0;

        }

        body {

            width: 1226px;

            background-color: #f5f5f5;

            margin: 0 auto;

        }

        .clearfix:after {

            /*伪元素是行内元素 正常浏览器清除浮动方法*/

            content: "";

            display: block;

            height: 0;

            clear: both;

            visibility: hidden;

        }

        .clearfix {

            *zoom: 1;

            /*ie6清除浮动的方式 *号只有IE6-IE7执行，其他浏览器不执行*/

        }

        li {

            list-style: none;

        }

        a {

            text-decoration: none;

        }

        .header {

            height: 58px;

            line-height: 58px;

        }

        h2 {

            float: left;

        }

        .type li a {

            float: right;

            margin-left: 30px;

            color: black;

        }

        .type li a:hover {

            color: orange;

            padding: 3px 0;

            border-bottom: 1px solid orange;

        }

        .erji .item {

            float: left;

            width: 234px;

            height: 300px;

            margin-right: 14px;

            margin-bottom: 14px;

            background-color: red;

        }

        .erji {

            margin-right: -14px;

        }

        .erji .item.items1 {

            height: 614px;

        }

        .erji .item.items9,

        .item.items10 {

            height: 143px;

        }

</style>


<body>

    <div class="header clearfix">

        <h2>智能穿戴</h2>

        <ul class="type">

            <li><a href="#">耳机</a></li>

            <li><a href="#">穿戴</a></li>

        </ul>

    </div>

    <div>

        <ul class="erji">

            <li class="item items1"></li>

            <li class="item items2"></li>

            <li class="item items3"></li>

            <li class="item items4"></li>

            <li class="item items5"></li>

            <li class="item items6"></li>

            <li class="item items7"></li>

            <li class="item items8"></li>

            <li class="item items9"></li>

            <li class="item items10"></li>

        </ul>

    </div>

</body>





.type 中的耳机，穿戴的border没写好，不知道为啥下边框离文字那么远，把下面的盒子都订下去了。。。。

mi的更多相关文章

  1. Oracle中把一个DateTime的字符串转化成date类型。to_date('2016/12/8 18:55:43','yyyy/MM/dd hh24:mi:ss'),

    Oracle中把一个DateTime或者该形态字符串转化成date类型. to_date('2016/12/8 18:55:43','yyyy/MM/dd hh24:mi:ss'), 或者: sele ...

  2. 小米2000万买域名mi.com

    来源:互联网的一些事   移动互联网之下,域名对于企业的吸引力将会越来越低,因为网站的入口多元化,不再仅凭域名.小米用超2000万人民币的代价购买mi.com域名,仅仅是为了所谓的国际化吗?小米此举, ...

  3. GDB 的MI接口

    背景介绍: libgdb过时了,目前的GDB调试前端都不用libgdb 目前有两种比较流行:- MI接口,现在应该是MI II接口,是Eclipse CDT所采用的方式- emac输出接口,这个似乎有 ...

  4. 多重继承，虚继承，MI继承中虚继承中构造函数的调用情况

    先来测试一些普通的多重继承.其实这个是显而易见的. 测试代码: //测试多重继承中派生类的构造函数的调用顺序何时调用 //Fedora20 gcc version=4.8.2 #include < ...

  5. oracle 插入记录，字段自动获取当前系统时间（YYYY-MM-DD HH24:MI:SS）

    需求: 插入一条记录,要求自动获取当前日期,并且格式为(YYYY-MM-DD HH24:MI:SS) sql语句: insert into SY_COMM_CONFIG(CONF_ID, S_MTIM ...

  6. PCB NOSQL MongoDb MI流程指示数据存储结构

    一.MI流程指示结构 二.产品型号树结构(即盲埋孔板型号结构) 三.MI流程指示UI 小结:1.MI流程指示使用的表非常之多(30多张表),存储的数据分散到各个表中,而NOSQL 一个产品型号一条记录 ...

  7. 【图像配准】基于互信息的图像配准算法：MI、EMI、ECC算法

    简单介绍: 基于互信息的图像配准算法以其较高的配准精度和广泛的适用性而成为图像配准领域研究的热点之中的一个.而基于互信息的医学图像配准方法被觉得是最好的配准方法之中的一个.基于此.本文将介绍简单的基于 ...

  8. oracle日期格式和java日期格式区别 HH24:mm:ss和HH24:mi:ss的区别

    转载自:https://blog.csdn.net/yubin_yubin/article/details/18655553 在日期数据库数据查询出来的时候经常会to_char()一下,格式化一下日期 ...

  9. [代码质量] Maintainability Index (MI)

    转载自: http://www.projectcodemeter.com/cost_estimation/help/GL_maintainability.htm ProjectCodeMeter Ma ...

  10. 双目立体匹配经典算法之Semi-Global Matching（SGM）概述：匹配代价计算之互信息（Mutual Information，MI）

      半全局立体匹配算法Semi-Global Matching,SGM由学者Hirschmüller在2005年所提出1,提出的背景是一方面高效率的局部算法由于所基于的局部窗口视差相同的假设在很多情况 ...

随机推荐

  1. webgl 系列 —— 绘制一个点（版本2、版本3、版本4、版本5）

    绘制一个点 我们初步认识了 webgl,本篇主要围绕绘制一个点的示例,逐步实现下面功能: 点的位置从 js 传入着色器 点的大小由 js 传入着色器 通过鼠标点击绘点 通过鼠标点击绘点,并改变点的颜色 ...

  2. C语言学习--指针大小端

    // 大端存储:  数据的高位存储在内存的低地址位置 //数据0x12345678,  四字节地址0x0, 0x1,0x2,0x3 //存储方式: 0x0: 存储12, 0x1:存34 0x2: 存5 ...

  3. fabric学习笔记5

    fabric学习笔记5 20201303张奕博 2023.1.15 fabric中的docker命令 1.查看本机的镜像列表 docker images 2.拉取镜像 docker pull hype ...

  4. js 页面小数相加精度问题

    解决方法:把需要计算的数字升级(乘以10的n次幂)成计算机能够精确识别的整数,等计算完毕再降级(除以10的n次幂),这是大部分编程语言处理精度差异的通用方法. 比如计算0.33和5.2的和,则需要把( ...

  5. 两个jsp界面之间使用window.location.href使用?传递参数以及接受参数

    这篇文章如果能给你带来帮助,不胜荣幸,如果有不对的地方也欢迎批评指正. 网上有很多方法是讲怎么截取字符串啊等等的方法来获取参数,说实话,看着我就觉得费劲,咱们可以换一种思路来思考.一般跳转界面多为前段 ...

  6. centos系统时间与硬件时间不一致

    centos系统时间与硬件时间设置.同步 将系统时间设置成2018年7月31日 12:00:00 date -s "07/31/18  12:00:00" hwclock -s 将 ...

  7. 087_VS load codes for Salesforce

    1. 下载VShttps://code.visualstudio.com/ ,安装后:Extensions 安装Salesforce Extension Pack .Salesforce Packag ...

  8. 宝塔404 Not Found的解决方法-重启大法也适合服务器

    本来以为服务器不是随时重启的,浪费了好几的时间配置ssl一直无法成功,后来处理404问题重启后,发现ssl也好使了. 以下引自连接 https://www.chichisvip.com/post/37 ...

  9. 利用canvas合并两个海报

    图片1 是个海报,图片2是个二维码,把这个二维码镶嵌到图片1 的指定位置上 function drawAndShareImage(opt, cb) { if (!opt) { console.erro ...

  10. BT做种

    BT方式:BT方式属于P2P传输,客户机之间可互传数据,大大提高传输效率,推荐使用.此处以qBittorrent做种为示例,主要有以下几个要点1.启用内置Tracker(或用其他同类软件代替)2.启用 ...