CSS Property Value How to - border-right-width: 5px;

Question

We would like to know how to border-right-width: 5px;.

Answer


<!DOCTYPE html>
<html lang="en">
<head>
<style type="text/css">
p {<!--from w ww  .  j a v  a  2s. c  o m-->
  padding: 10px;
  border-style: solid;
}

p.one {
  border-top-width: 5px;
  border-color: #ae4fad;
}

p.two {
  border-right-width: 5px;
  border-color: #7aa309;
}

p.three {
  border-bottom-width: 5px;
  border-color: #ccb720;
}

p.four {
  border-left-width: 5px;
  border-color: #9a605f;
}
</style>
</head>
<body>
  <p class="one">This is a paragraph has top border.</p>
  <p class="two">This is a paragraph has right border.</p>
  <p class="three">This is a paragraph has bottom border.</p>
  <p class="four">This is a paragraph has left border.</p>
</body>
</html>

The code above is rendered as follows: