2016-05-30 2 views
1

У меня проблема с радиусом границы.Как установить плавный граничный радиус более 50%

я нужен набор радиус границы, такие как этот

enter image description here

Css радиус границы, такие как

border-top-right-radius: 46%; 
    border-top-left-radius: 21%; 

дать мне плохой результат. Это любой способ сделать гладкий радиус?

+1

Вместо '46%' попробовать '50%' и '21% 'до' 25% '. Кроме того, это может помочь вам [ответ] (http://stackoverflow.com/questions/21464405/circle-with-border-looks-not-circular-jagged-and-not-smooth-why). – Jer

+0

нет, мне нужна плавная линия. 50% дает мне круг, но мне нужно больше пластикового радиуса границы, чтобы установить гладкое округление –

ответ

6

вы можете отрезать ваши границы с 2-мя значениями для каждого угла, вы можете также использовать пиксельные блоки

html { 
 
    background:#023C5C; 
 
} 
 

 
div { 
 
    text-align:center; 
 
    background:#007EAA; 
 
    min-height:200px; 
 
    border-radius: 400px 70px 0 0/100px 10px 0 0; 
 
    width:500px 
 
}
<div></div>

+0

Спасибо! Это то, что мне нужно –

Смежные вопросы