Halbe Kreis mit Prozentwerten in CSS

Ich versuche zu erstellen, die eine Hälfte des Kreises mit CSS mit border-radius mit Prozentsatz aber ich habe keine Ideen. Gibt es eine Methode, dies zu tun?

Google css-shapes. Diese existiert bereits

InformationsquelleAutor Cicciocicci | 2016-10-06

  1. 1

    Versuchen, um Stil Ihre div wie diese:

    div{
 height:45px;
 width:90px;
 border-radius: 90px 90px 0 0;
 -moz-border-radius: 90px 90px 0 0;
 -webkit-border-radius: 90px 90px 0 0;
 background:green; }

    Dies schafft eine halbe grüne Kreis, hoffe, das funktioniert für Sie.

    Hallo,vielen Dank für Ihre answare.Was ich will zu tun ist, erstellen Sie einen Halbkreis mit der border-radius' Werte-Satz in Prozent
    Spielen, um mit diesem codepen.io/xram/pen/thLsk Codepen snippet und die Pixel ändern, um den Prozentsatz. Und warum muss yo die border-radius-zu-sein in %?
    Schon getan.Wenn ich die border-radius: 100% 100% 0% 0% habe ich nicht bekommen das gleiche Ergebnis

    InformationsquelleAutor Bruno van der Kraan

  2. 0

    Klingt es wie Sie wollen verwenden Sie Prozentsätze, wenn also die container werden muss Feste Größe und cutoff-überlauf.

    Wenn Sie HTML:

    <div class="container"><div class="pie"></div></div>

    Dann diese CSS arbeiten:

    .container {
    height: 45px;
    width: 90px;
    overflow: hidden;
}
.pie {
     height: 200%;
     width: 100%;
     border-radius: 100% 100% 0 0;
     background: green;
}
    Hallo:)Dies funktioniert aber nur, wenn ich will, ein Halbkreis an der Spitze.Wenn ich will, einen Halbkreis auf der linken Seite zum Beispiel?Ich habe eine negative Marge?

    InformationsquelleAutor Jermismo

Schreibe einen Kommentar