.divLSG {
background-color: #EEEEEE;
height: 40px;
width: 400px;
padding: 10px;
-moz-border-radius: 15px 15px 15px 15px; /* Firefox */
-webkit-border-radius: 15px 15px 15px 15px; /* Chrome */
border-radius: 15px 15px 15px 15px; /* opera */
}
-----------------------------------------
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="bordesLSG.css">
</head>
<body>
<div class="bordes1"></div><br>
<div class="bordes2"></div><br>
<div class="bordes3"></div><br>
<div class="bordes4"></div><br>
</body>
</html>
-----------------------------------------
bordesLSG.css:
.bordes1 {
background: #e39d3e;
width: 585px;
height: 110px;
margin-left: 15px;
-webkit-border-radius: 20px;
moz-border-radius: 20px;
ms-border-radius: 20px;
border-radius: 20px 550px 5px;
}
.bordes2{
background: #e39d3e;
width: 585px;
height: 110px;
margin-left: 15px;
-webkit-border-radius: 20px;
moz-border-radius: 20px;
ms-border-radius: 20px;
border-radius: 550px 20px 5px;
}
.bordes3 {
background: #e39d3e;
width: 585px;
height: 110px;
margin-left: 15px;
-webkit-border-radius: 20px;
moz-border-radius: 20px;
ms-border-radius: 20px;
border-radius: 550px 550px 550px;
}
.bordes4 {
background: #e39d3e;
width: 585px;
height: 110px;
margin-left: 15px;
-webkit-border-radius: 20px;
moz-border-radius: 20px;
ms-border-radius: 20px;
border-radius: 1000px 200px 5px;
}
--------------------------------------
RESULTADO:
Más información en: http://html5tutoriales.com/85-css/128-border-radius-de-css3.html
No hay comentarios:
Publicar un comentario