【凡哥教程第十二讲作业】青色双圆球（CSS渐变之径向渐变）

花简静

凡哥教程第十二讲作业： 使用 radial-gradient 函数在 400*200的元素上绘制两个水平方向并排的青色（teal）圆球，球的直径为180px， 要求， ① 球的边缘不能有毛刺； ② 元素的背景最终效果为粉红色（pink）但不允许单独设置背景色。 提示：使用px设置颜色起始边界；将渐变视为图片，为其设置设置 repeat 属性（repeat-x或repeat-y，但当后面的背景位置和尺寸设置得当可以忽略此设置）；以简写形式设置类似于 center/cover 之类的 background-position 和 background-size，其中background-size 宽高都需要设置。

花简静

<style> .rbox6 {     position: relative;     width: 400px;     height: 200px;     left: calc(50% - 200px);     background: repeating-radial-gradient(circle at 100px 100px, teal,teal 90px, pink 91px 100%) 0/50% 100%; } </style>   <div class="rbox6"></div>

雨声

哈哈，作业我还欠真，我慢慢来完成

雨声

最后这几张作业要慢慢理解和渗透，看似简单是真不好做

云笛

我就看看不作细评，因为我暂时还没学，看不懂

花简静

at 100px 100px,径向渐变起点位置
teal 青色从0开始
teal  90px, 渐变至90
pink 91px 100%  粉色从91开始到100

0/50% 100%;     长一半宽满格


---------------------------------------------
补充：感谢@扬帆 ，把原来的百分比更改为：
teal  90px,
pink 91px 100%

雨声

欣赏静宝的精彩作业，有你打样还好些，不然一脸茫然不知如何下手

花简静

@凡哥 辛苦老师来瞧一眼这个作业算完成不？

花简静

雨声 发表于 2024-8-1 20:29
哈哈，作业我还欠真，我慢慢来完成

哈哈， 这个慢慢来不急，理论的东东开始多了

花简静

雨声 发表于 2024-8-1 20:30
最后这几张作业要慢慢理解和渗透，看似简单是真不好做

这个设计是要在理解的基础上，但我觉得你没问题啊