Bordas arredondadas CSS

 Bordas arredondadas CSS

border-radius é a propriedade usada para adicionar borda arredonda em um elemento.

<!DOCTYPE html>

<html>

<head>

<style>

p.normal {

  border: 2px solid blue;

  padding: 5px;

}

 

p.borda1 {

  border: 2px solid blue;

  border-radius: 5px;

  padding: 5px;

}

p.borda2 {

  border: 2px solid blue;

  border-radius: 8px;

  padding: 5px;

}

p.borda3 {

  border: 2px solid blue;

  border-radius: 12px;

  padding: 5px;

}

</style>

</head>

<body>

<h2>A propriedade border-radius</h2>

<p>Esta propriedade é usada para adicionar bordas arredondadas a um elemento:</p>

<p class="normal">borda normal.</p>

<p class="borda1">borda aredondada 1</p>

<p class="borda2">borda aredondada 2</p>

<p class="borda3">borda aredondada 3r</p>

</body>

</html>