Question

我有这个网站：

http://test2.dac-proiect.ro/wp/?page_id=6

我想删除下图中的箭头。

http://i61.tinypic.com/rhvgxh.png

您必须将产品添加到购物车才能看到这些箭头

代码HTML：

    <div class="cart-number">
    <span></span>
    <div class="quantity buttons_added"><input type="button" value="-" class="minus"><input type="number" step="1" name="cart[d3d9446802a44259755d38e6d163e820][qty]" value="1" title="Quantity" class="input-text qty text" size="4"><input type="button" value="+" class="plus"></div>
</div>

代码CSS：

 .quantity {
  width: auto;
  position: relative;
  margin: 0 auto;
  overflow: hidden;
  zoom: 1;
}
.quantity input.qty {
  float: left;
  width: 45px;
  height: 38px;
  text-align: center;
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  padding: 0;
  font-weight: bold;
  -moz-appearance: textfield;
}
.quantity input.qty:focus:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.quantity .plus, .quantity .minus {
  background: #fff;
  float: left;
  display: block;
  padding: 0;
  margin: 0;
  vertical-align: text-top;
  text-decoration: none;
  overflow: visible;
  text-decoration: none;
  cursor: pointer;
  line-height: 13px;
  font-size: 12px;
  color: #666666;
  border: 1px solid #e5e5e5;
  text-align: center;
  width: 45px;
  height: 38px;
}
.quantity .plus {
  border-left: none;
  top: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
  right: 0;
}
.quantity .minus {
  border-right: none;
  bottom: 0;
  right: 0;
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}

我该如何解决这个问题？我无法弄清楚它们来自那些箭头

提前致谢！

Answer 1

这一切都取决于输入类型，你想用这个CSS来隐藏它。

    input[type="number"]::-webkit-outer-spin-button,
    input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;}
    input[type="number"] {
    -moz-appearance: textfield;}

干杯

如何删除这些箭头？

1 个答案: