Rasmlarni doira shaklida qilib beradigan kod CSS [code=css] [class^=circle] { wi...

3339

Yangi formatda davom etish uchun: https://uzfor.net/view.php?act=post&id=83188

Postga havola

UZtim [98] [off]

Rasmlarni doira shaklida qilib beradigan kod

CSS

[class^=circle] {
        width: 150px;
        height: 150px;
        border-radius: 50%;
        text-align: center;
        display: inline-block;
        font-size: 100px;
        background-size: cover;
    }
 
    [class^=circle] span {
        display: block;
        margin-top: 155px;
        font-size: 20px;
        line-height: normal;
    }
 
    .circle1 {
        background-image: url(//sayt.nomi/img/rasmnomi.jpg);
        [/url]
    }
 
    .circle2 {
        background-image: url(//sayt.nomi/img/rasmnomi.jpg);
        [/url]
    }
 
    .circle3 {
        background-image: url(//sayt.nomi/img/rasmnomi.jpg
);
        [/url]
    }
 
    .circle4 {
        background-image: url(//sayt.nomi/img/rasmnomi.jpg);
        [/url]
    }
 
    .circle5 {
        background-image: url(http://sayt.nomi/img/rasmnomi.jpg);
        [/url]
    }

Html

<body>
    <div class="circle1"><span>namuna.uz</span></div>
    <div class="circle2"><span>namuna.uz</span></div>
    <div class="circle3"><span>namuna.uz</span></div>
    <div class="circle4"><span>namuna.uz</span></div>
    <div class="circle5"><span>namuna.uz</span></div>
</body>