公司技术博客布局例子代码(HTML+CSS)

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>公司技术博客布局例子代码</title>
</head>
<style type="text/css">
  body {
    padding: 0px;
    margin: 0px;
  }

  .header {
    width: 100%;
    height: 100px;
    background-color: green;
  }

  .menu {
    width: 1200px;
    margin: 0 auto;
    height: 100px;
    background-color: #00aaaa;
  }

  .menu ul {
    padding-top: 50px;
  }

  .menu li {
    float: left;
    width: 100px;
    list-style: none;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background-color: yellow;
    margin-right: 10px;
  }

  .menu li:hover {
    background-color: #ff2a08;
    color: white;
  }

  .content {
    width: 1200px;
    height: auto;
    margin: 0 auto;
    background-color: #2c84f5;
  }

  .content .left {
    height: 800px;
    background-color: red;
    width: 75%;
    float: left;
  }

  .content .right {
    width: 25%;
    height: 800px;
    float: left;
    background-color: rebeccapurple;
  }

  .footer .left {
    height: 200px;
    background-color: #ff8d48;
    width: 75%;
    float: left;
  }

  .footer .right {
    width: 25%;
    height: 200px;
    float: left;
    background-color: #609969;
  }

  .footer {
    width: 100%;
    height: 200px;
    background-color: orange;
  }

  .bottom {
    width: 100%;
    height: 50px;
    background-color: grey;
  }
</style>
<body>
<div class="header">
  <div class="menu">
    <ul>
      <li>菜单</li>
      <li>菜单</li>
      <li>菜单</li>
      <li>菜单</li>
      <li>菜单</li>
      <li>菜单</li>
    </ul>
  </div>
</div>
<div class="content">
  <div class="left">
    文章列表
  </div>
  <div class="right">
    快捷菜单栏
  </div>
</div>
<div style="clear: both;"></div>
<div class="footer">
  <div class="left">
    底部左
  </div>
  <div class="right">
    底部右
  </div>
</div>
<div class="bottom"></div>
</body>
</html>

 

JS移除数组中某一个对象。

deleteItem(item) {
  this.list2 = this.removeAaary(this.list2, item);
  this.list1.push(item);
}
addItem(item) {
  this.list2.push(item);
  this.list1 = this.removeAaary(this.list1, item);
}
removeAaary(_arr, _obj) {
  var length = _arr.length;
  for (var i = 0; i < length; i++) {
    if (_arr[i] === _obj) {
      if (i === 0) {
        _arr.shift(); //删除并返回数组的第一个元素
        return _arr;
      } else if (i === length - 1) {
        _arr.pop();  //删除并返回数组的最后一个元素
        return _arr;
      } else {
        _arr.splice(i, 1); //删除下标为i的元素
        return _arr;
      }
    }
  }
}

统计SQL编写实例

根据时间查询当前季度数据,再进行分组统计数量,SQL与JPA写法。

SELECT
  a.organization_id
FROM
  zn_safe_manager_staff a
WHERE
  QUARTER (a.date_created) = QUARTER ('2018-12-01')
GROUP BY
  a.organization_id;
@Query("select a.organization.id,a.organization.name,count (a) from Staff a where quarter(a.dateCreated) = quarter(?1) group by a.organization.id")
List<Object[]> findHomeStateResult(String date);

 

SQL例子

数据库左连接查询SQL例子:

SELECT
  shaya_bs_water_meter.id,
  shaya_bs_water_meter.`name`
FROM
  shaya_bs_water_meter
LEFT JOIN (
  SELECT DISTINCT
    shaya_bs_automatic_record.water_meter_id
  FROM
    shaya_bs_automatic_record
) b ON shaya_bs_water_meter.id = b.water_meter_id
WHERE
  shaya_bs_water_meter.if_automatic = 'automatic'

数据库分组统计

select name,sum(number) from zn_safe_manager_fire_equipment GROUP BY name;