Скетчивые границы стилей с помощью CSS-изображения? Кто-нибудь еще идентифицировал этот вид?

Question

Назовите меня сумасшедшим, но не было бы круто применить рукописную/отрывочную границу стиля к вашим HTML-элементам? Кто-нибудь сделал это с успехом? Поделись, пожалуйста!!!

Answer 1

Я просто попробовал. Я не художник, но концепция работает. jsFiddle

div { 
    border: 15px solid transparent; 
    width: 350px; 
    padding: 10px 20px; 
} 

#round { 
    border-image: url("http://s3.amazonaws.com/dfc_attachments/images/3247065/sketchy_web.png") 30 30 round; 
} 

#stretch { 
    border-image: url("http://s3.amazonaws.com/dfc_attachments/images/3247065/sketchy_web.png") 30 30 stretch; 
}