AAA Главная
Примеры PHP Примеры JavaScript Примеры Ajax Примеры CSS,HTML

Увеличенная ширина рамки-изображения. Свойство border-image-width

Рисунок для рамки – рисунок для рамки

Рисунок обрезался внутренними краями рамки:
Рамка заползла под контент за счет увеличенной ширины:

Исходный код этого примера:

<style>
    .wrap {
        text-align: center;
    }
    .wrap div {
        display: inline-block;
        margin: 20px 20px 0 20px;
    }
    .wrap img {
        border: 60px solid;
        border-radius: 50%;
        border-image: url(border_strange.jpg) 60 round;
        margin-top: 10px;
    }
</style>
<div class="wrap">
    <div>
        Рисунок обрезался внутренними краями рамки:<br>
        <img src="flower1.jpg" alt="">
    </div>
    <div>
        Рамка заползла под контент за счет увеличенной ширины:<br>
        <img src="flower1.jpg" style="border-image-width: 100px;" alt="">
    </div>
</div>



.

© Copyright 2008-2018 by KDG



Rambler's Top100