So erstellen Sie glatte Kanten in CSS-Rahmenform?

-1

Hier ist mein Screenshot, Sie können die unscharfen Kanten auf der oberen linken Seite sehen, Ich bin neu in CSS, Bitte bieten Sie eine Lösung für dieses Problem.So erstellen Sie glatte Kanten in CSS-Rahmenform?

.shape { 
 
    position: absolute; 
 
    width: 100%; 
 
    height: 100%; 
 
    top: 0; 
 
    left: 0; 
 
    background-color: #9966ff; 
 
    outline: 1px solid transparent; 
 
    box-shadow: 0 0 1px rgba(255, 255, 255, 0); 
 
} 
 
.shape:after { 
 
    content: ''; 
 
    border-right: 1500px solid rgba(0, 0, 0, 0); 
 
    border-top: 250px solid rgba(255, 255, 255, 1); 
 
    border-left: 1500px solid rgba(255, 255, 255, 1); 
 
    float: right; 
 
}

<div class="shape"></div>

Quelle

2016-08-30 Aravind

Wie glatte Kanten schaffen? – Aravind

Bitte geben Sie Ihren Code ein? – aswathy

– Aravind

Innenform Verwendung Stil "border-radius: 15px;"

Quelle

2016-08-30 06:31:28 divya

Noch ist es etwas, was Unschärfe – Aravind

Ich brauche Bild perfekt (100% glatt) Linie – Aravind

passen Sie es durch Ändern der Pixel und stellen Sie es entsprechend Ihrer Anforderung. – divya

.shape { 
 
    position: absolute; 
 
    width: 100%; 
 
    /*height: 100%;*/ 
 
    top: 0; 
 
    left: 0; 
 
    background-color: #9966ff; 
 
    outline: 1px solid transparent; 
 
    box-shadow: 0 0 1px rgba(255, 255, 255, 0); 
 
    border-radius: 56px; 
 
} 
 
.shape:after { 
 
    content: ''; 
 
    border-right: 1500px solid rgba(0, 0, 0, 0); 
 
    border-top: 340px solid rgba(255, 255, 255, 1); 
 
    border-left: 1500px solid rgba(255, 255, 255, 1); 
 
    float: right; 
 
}

<div class="shape"></div>

Quelle

2016-08-30 06:44:55 aswathy

Aber der Umrandungsradius verändert die Form. – Aravind

Ich brauche die Form bleibt gleich – Aravind

So erstellen Sie glatte Kanten in CSS-Rahmenform?

Antwort

Verwandte Themen