Saltar al contenido principal
Codigo Heroe
Desafío anterior
Радиальные градиенты. Вводная глава 25/15
Ver desafíos del nivel
  1. 1. Форма: <radial-shape>
  2. 2. Форма: ending shape
  3. 3. Размер circle: <length>
  4. 4. Радиус circle
  5. 5. Размер ellipse: <length> <length>
  6. 6. Радиусы ellipse в px
  7. 7. Размер ellipse: проценты
  8. 8. Радиусы ellipse в процентах
  9. 9. Hard stop: соседние color stops
  10. 10. Hard stops: позиции color stops
  11. 11. <radial-extent>: side keyword
  12. 12. <radial-extent>: side keyword II
  13. 13. <radial-extent>: side keyword II
  14. 14. <radial-extent>: corner keyword
  15. 15. <radial-extent>: corner keyword II
Siguiente desafío
  • Skill Atlas

Cargando…
Estará listo en unos segundos.

  • Desafío

Размер ellipse: <length> <length>

Replica el ejemplo modificando el código
DificultadMedia
CategoríaHTML/CSS
Ahora
Estado actual de la página
Ejemplo
Resultado que debes obtener
ResultadoAparecerá después de la primera comprobaciónAparecerá después
  • index.html
  • style.css
HTML
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="utf-8"> <title>Размер ellipse: <length> <length></title> <link rel="stylesheet" href="setting.css"> <link rel="stylesheet" href="local-5.css"> <link rel="stylesheet" href="style.css"> </head> <body> <main class="scene"><div class="pixel-ellipse"></div></main> </body> </html>
CSS
.pixel-ellipse { background-image: radial-gradient( ellipse 160px 120px, #fdf2f8 14%, #f0abfc 52%, #9333ea 88% ); } /* Измените только два радиуса ellipse в radial-gradient(), чтобы получилось как в образце. Возможные пары радиусов: 320px 190px, 160px 260px, 220px 390px, 260px 90px */
Vista previa

El código cambió. Haz clic en «Actualizar» o activa la ejecución automática.

Saliste de la página del desafío.

Haz clic dentro de la vista previa para enfocar esta ventana.

100%
0
    Completado 0%.
    Codigo Heroe

    © 2023-2026, codigoheroe.com