通过使用border-radius,我们可以通过px、em或者百分比为单位统一设置圆角。下面,我们来设置Get Hardboiled网站商店的链接,来让它看起来更像一个按钮。

Add to cart

现在,我们将链接转化为一个按钮。我们加入内边距(当用户改变其浏览器的文字大小时,可以适当地缩放)、背景色和深色边框。

.btn { 
padding : 1rem 1.25rem .75rem; 
background-color: rgb(188, 103, 108); 
border: 5px solid rgb(140, 69, 73); }

通过设置border-radius,来使四个边角统一。

.btn { 
border-radius : 1rem; }