首页 > 其他分享 >css做个芒果,哈哈

css做个芒果,哈哈

时间:2023-09-15 10:14:50浏览次数:36  
标签:12px 芒果 6px 哈哈 radius background orange css

前几天写border-radius的时候,突然想到了写个芒果

color: #0000;
width: 120px;
height: 120px;
background: #333;
/* overflow: hidden; */
border-radius: 50% 340% 127% 256%;
background: orange;
background: #ffcc3a;
box-shadow: -3px 6px 12px orange, inset 3px -6px 12px orange;

效果:

标签:12px,芒果,6px,哈哈,radius,background,orange,css
From: https://www.cnblogs.com/noah227/p/17693362.html

相关文章

  • 界面组件DevExpress WinForms v23.1亮点 - 全新升级HTML & CSS模板
    DevExpressWinForms拥有180+组件和UI库,能为WindowsForms平台创建具有影响力的业务解决方案。DevExpressWinForms能完美构建流畅、美观且易于使用的应用程序,无论是Office风格的界面,还是分析处理大批量的业务数据,它都能轻松胜任!DevExpressWinForm 控件已正式发布v23.1版本,此版......
  • 分享一个自定义颜色的侧边栏CSS
    很简单!将以下代码放入站点的css即可生效,css中的颜色可自定义修改RGB/HEX的颜色值~/**彩色滚动条样式开始*/::-webkit-scrollbar{width:10px;height:1px;}::-webkit-scrollbar-thumb{background-color:#a0c595;background-image:-webkit-linear-gradient(45......
  • 40 个超有意思的 CSS 网站
    ......
  • html css dotted border 边框虚线太密
    三角形/**正三角*/.triangle{width:0;height:0;border-style:solid;border-width:025px40px25px;border-color:transparenttransparentrgb(245,129,127)transparent;}/**倒三角*/.triangle{width:0;height:0;border-style:solid;bor......
  • 熟练掌握并充分利用CSS3的新特性,持续更新中。。。
    1.1  尝试新颖的CSS3特性首先,我们来看一个具体的案例。  https://code.juejin.cn/pen/7277536985772720139 1.2  CSS3新特性简介和浏览器支持情况新特性简介:1)强大的CSS3选择器2)抛弃图片的视觉效果3)盒模型变化(多列布局和弹性盒模型)4)阴影效果5)Web字体和webFo......
  • CSS gradient渐变之webkit核心浏览器下的使用
    [color=red][b]一、关于渐变[/b][/color]渐变是一种应用于平面的视觉效果,可以从一种颜色逐渐地转变成另外一种颜色,故可以创建类似于彩虹的效果渐变可以应用在任何可以使用图片的地方。例如,您可以指定一个这么一个渐变:顶部的颜色是红色,中间的是蓝色,底部为黄色来作为div的背景色。渐......
  • 现代 CSS 解决方案:CSS 原生支持的三角函数
    在CSS中,存在许多数学函数,这些函数能够通过简单的计算操作来生成某些属性值,例如:calc():用于计算任意长度、百分比或数值型数据,并将其作为CSS属性值。min()和max():用于比较一组数值中的最大值或最小值,也可以与任意长度、百分比或数值型数据一同使用。clamp():用于将属性值限制在......
  • 直播app开发,CSS3动画实现左右无缝滚动图
    直播app开发,CSS3动画实现左右无缝滚动图<viewclass="shortList_con"><viewclass="scrollCon":style="'width:'+(shortRouteList.length)*210+'rpx'"><viewclass="shortItem"v-for="(item,index......
  • 纯css实现边框环绕的效果
    最近做项目遇到一个需求,需要给卡片添加一个边框环绕的效果,当鼠标移入卡片时,出现边框。这里我主要是使用:before和:after来辅助实现这个功能。在很多时候,我们可以巧用:before或者:after来实现一些看起来较为复杂的效果。我们先看看效果:代码如下,希望大家能受到些许的启发,......
  • How to fix Tailwind CSS colors not work in Next.js All In One
    HowtofixTailwindCSScolorsnotworkinNext.jsAllInOneTailwindCSS&Next.js13errorimporttype{Config}from'tailwindcss'constconfig:Config={content:['./src/pages/**/*.{js,ts,jsx,tsx,mdx}','......