<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<br>
<div class="box">пример рамки</div>
<br>
</body>
</html>
/* Styles go here */
.box{
text-align: center;
width: 300px;
border: 1px solid transparent;
-moz-border-image: -moz-linear-gradient(left, #FFFFFF 0%, #00CCFF 50%, #FFFFFF 100%);
-webkit-border-image: -webkit-linear-gradient(left, #FFFFFF 0%, #00CCFF 50%, #FFFFFF 100%);
border-image: linear-gradient(to left, #FFFFFF 0%, #00CCFF 50%, #FFFFFF 100%);
border-image-slice: 1;
}