1回答

• 

  飞鸟与射手

  2016-10-21 19:42:40

  * {
      margin: 0;
      padding: 0;
  }
  a {
      color: #666;
      text-decoration: none;
  }
  body {
      padding: 20px;
      color: #666;
  }
  .fl{
      float: left;
  }
  .fr {
      float: right;
  }
  table {
      border-collapse: collapse;
      border-spacing: 0;
      border: 0;
      text-align: center;
      width: 937px;
  }
  th, td {
      border: 1px solid #CADEFF;
  }
  th {
      background: #e2f2ff;
      border-top: 3px solid #a7cbff;
      height: 30px;
  }
  td {
      padding: 10px;
      color: #444;
  }
  tbody tr:hover {
      background: RGB(238,246,255);
  }
  .checkbox {
      width: 60px;
  }
  .goods {
      width: 300px;
  }
  .goods span {
      width: 180px;
      margin-top: 20px;
      text-align: left;
      float: left;
  }
  .price {
      width: 130px;
  }
  .count {
      width: 90px;
  }
  .count .add, .count input, .count .reduce {
      float: left;
      margin-right: -1px;
      position: relative;
      z-index: 0;
  }
  .count .add, .count .reduce {
      height: 23px;
      width: 17px;
      border: 1px solid #e5e5e5;
      background: #f0f0f0;
      text-align: center;
      line-height: 23px;
      color: #444;
  }
  .count .add:hover, .count .reduce:hover {
      color: #f50;
      z-index: 3;
      border-color: #f60;
      cursor: pointer;
  }
  .count input {
      width: 50px;
      height: 15px;
      line-height: 15px;
      border: 1px solid #aaa;
      color: #343434;
      text-align: center;
      padding: 4px 0;
      background-color: #fff;
      z-index: 2;
  }
  .subtotal {
      width: 150px;
      color: red;
      font-weight: bold;
  }
  .operation {
      width: 80px;
  }
  .operation span:hover, a:hover {
      cursor: pointer;
      color: red;
      text-decoration: underline;
  }
  img {
      width: 100px;
      height: 80px;
      /*border: 1px solid #ccc;*/
      margin-right: 10px;
      float: left;
  }
  
  .foot {
      width: 935px;
      margin-top: 10px;
      color: #666;
      height: 48px;
      border: 1px solid #c8c8c8;
      background-color: #eaeaea;
      background-image:linear-gradient(RGB(241,241,241),RGB(226,226,226));
      position: relative;
      z-index: 8;
  }
  .foot div, .foot a {
      line-height: 48px;
      height: 48px;
  }
  .foot .select-all {
      width: 100px;
      height: 48px;
      line-height: 48px;
      padding-left: 5px;
      color: #666;
  }
  .foot .closing {
      border-left: 1px solid #c8c8c8;
      width: 100px;
      text-align: center;
      color: #000;
      font-weight: bold;
      background: RGB(238,238,238);
      cursor: pointer;
  }
  .foot .total{
      margin: 0 20px;
      cursor: pointer;
  }
  .foot  #priceTotal, .foot #selectedTotal {
      color: red;
      font-family: "Microsoft Yahei";
      font-weight: bold;
  }
  .foot .selected {
      cursor: pointer;
  }
  .foot .selected .arrow {
      position: relative;
      top:-3px;
      margin-left: 3px;
  }
  .foot .selected .down {
      position: relative;
      top:3px;
      display: none;
  }
   .show .selected .down {
      display: inline;
  }
   .show .selected .up {
      display: none;
  }
  .foot .selected:hover .arrow {
      color: red;
  }
  .foot .selected-view {
      width: 935px;
      border: 1px solid #c8c8c8;
      position: absolute;
      height: auto;
      background: #ffffff;
      z-index: 9;
      bottom: 48px;
      left: -1px;
      display:none;
  }
  .show .selected-view {
      display: block;
  }
  .foot .selected-view div{
      height: auto;
  }
  .foot .selected-view .arrow {
      font-size: 16px;
      line-height: 100%;
      color:#c8c8c8;
      position: absolute;
      right: 330px;
      bottom: -9px;
  }
  .foot .selected-view .arrow span {
      color: #ffffff;
      position: absolute;
      left: 0px;
      bottom: 1px;
  }
  #selectedViewList {
      padding: 20px;
      margin-bottom: -20px;
  }
  #selectedViewList div{
      display: inline-block;
      position: relative;
      width: 100px;
      height: 80px;
      border: 1px solid #ccc;
      margin: 10px;
  }
  #selectedViewList div span {
      display: none;
      color: #ffffff;
      font-size: 12px;
      position: absolute;
      top: 0px;
      right: 0px;
      width: 60px;
      height: 18px;
      line-height: 18px;
      text-align: center;
      background: RGBA(0,0,0,.5);
      cursor: pointer;
  }
  #selectedViewList div:hover span {
      display: block;
  }
  .on{
      background-color: #e2f2ff;
  }
  
  

  0 0