p {
  padding: 10px;
  color: white;
  width: 230px;
  margin: 0 0 10px 0;
  }
  .first{
  background: #f66;
  box-shadow: inset 0 0 0 1px white, 0 0 0 1px #f66;
  }
  .second{
  background: #fc3;
  border: 1px solid white;
  box-shadow: 0 0 0 1px #fc3;
  }
  .third {
  background: #c3c;
  border: 1px solid white;
  outline: 1px solid #c3c;
  }
  .fourth {
  background: #00f;
  box-shadow: 0 0 0 1px white, 0 0 0 2px #00f;
  }
  .fifth {
  background: #0c0;
  box-shadow: inset 0 0 0 1px white;
  border: 1px solid #0c0;
  }

<p class="first">Один box-shadow внутрь, второй наружу</p>
  <p class="second">Border затем box-shadow наружу</p>
  <p class="third">Border, затем outline</p>
  <p class="fourth">Два box-shadow наружу</p>
  <p class="fifth">Box-shadow внутрь, затем border</p>