同一个div种用css设置多段背景色,使多种颜色拼接

background-image: linear-gradient(90deg, #fb3 0, #fb3 50%, #3ef784 0, #3ef784 60%, #029eef 0, #029eef)

50% 第一个颜色占比,终止
10% 第二个颜色占比,终止在60%
40% 第三个颜色占比,终止在100%

颜色后面的是终止位置

用css设置多段背景色相关推荐

  1. CSS设置页面背景色

    CSS设置页面背景色 设置页面的背景色 CSS通过设置body标记的background-color属性来实现,背景色主要突出页面的主题,跟前景的文字颜色相配合. 具体的设定方法和文字颜色值的设定一样 ...

  2. html给主题设置背景色,css如何设置元素的背景色?

    css如何设置元素的背景色?下面本篇文章就来给大家介绍一下.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. 在CSS中,可以使用background-color属性来设置元素的背景色 ...

  3. 两端分散对齐怎么设置_如何用css实现一段文字的两端对齐和分散对齐

    展开全部 用css实现一段32313133353236313431303231363533e78988e69d8331333433646435文字的两端对齐的代码输入步骤如下: 1.首先输入代码让这段 ...

  4. html同一段文字设置不同颜色字体,CSS设置一个文字两种颜色

    CSS设置一个文字两种颜色属于前端实例代码,有关更多实例代码大家可以查看. CSS可以将一个文字设置为两种颜色,下面介绍一下如何实现此效果. 代码实例如下: 犀牛前端部落 .antzone{ disp ...

  5. 清除webkit浏览器css设置滚动条

    主要有下面7个属性 ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端的按钮 ::-webkit-scrollb ...

  6. css设置打印样式表,[CSS] 创建打印样式表

    [CSS] 创建打印样式表 Chrome浏览器有一项非常好用的功能, 就是直接将网页保存为PDF(Ctrl+P), 虽然部分人觉得没有用, 但我经常使用这个功能 比如说, 有的博文写得不错, 想保存, ...

  7. css设置滚动条的样式

    1. webkit下面的CSS设置滚动条 主要有下面7个属性 ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端 ...

  8. Eclipse详细设置护眼背景色和字体颜色并导出

    Eclipse详细设置护眼背景色和字体颜色并导出 Eclipse是一款码农们喜闻乐见的集成开发平台,但是其默认的主题和惨白的背景色实在是太刺激眼球了.下面,将给大家详细介绍如何设置成护眼主题的方法,也 ...

  9. CSS设置按钮式超链接

    CSS设置按钮式超链接 网页上有很多超链接都是按钮的形式,这些都使用了各种图片,这里通过CSS普通的属性实现按钮的效果. 首先,建立最简单的HTML页面,代码如下: <table width=& ...

  10. CSS设置像文字一样的按钮

    CSS设置像文字一样的按钮 CSS可以将按钮变成普通的文字一样. 首先,跟普通的表单一样,定义<form>.<input>等标记,并设置相应的类型,以便控制它的样式. < ...

最新文章

  1. 锚文本的作用是什么?网站SEO优化时又需要注意哪些问题?
  2. [转]UI设计小技巧
  3. 【Python刷题】_8
  4. SpringBoot中在配置文件中限制文件上传的大小
  5. LeetCode 53. 最大子序和(Maximum Subarray)
  6. 实力打脸: 量子隐形传输与 “瞬间移动” 毫无关系
  7. crowd counting_[crowd_counting]-SFCN-CVPR2019amp;amp;GCC dataset
  8. 进入职场,为什么都需要了解办公软件,了解它对我们有什么作用?
  9. cpu高 load 高 内存高 io 高怎么排查
  10. java优先级队列使用
  11. 黑马程序员-浏览器原理
  12. MySQL 轻量级Online DDL工具 —— gh-ost
  13. 安卓的三个Activity
  14. 最近很火的OkHttp剥洋葱系列
  15. sqlite C接口增删改查,数据库优化
  16. 放大器指标:1db压缩点
  17. 笔记本电脑插过一次typeC的耳机之后在插3.5的圆孔耳机不能用?
  18. Rockchip WIFI 配置说明
  19. Android——广播(BroadcastReceiver)
  20. python——通信原理,进程与线程

热门文章

  1. IT软件技术人员的职位路线(从程序员到技术总监) - 部门管理经验谈
  2. C# Activator.CreateInstance
  3. 粗略读了一遍李子奈的《计量经济学》
  4. 150行Python代码模拟太阳系行星运转(含music)
  5. 计算机C盘能扩展吗,为什么电脑c盘没有扩展卷(原因揭秘及扩大c盘空间的方式)...
  6. oCPC实践录 | 成本优化策略之eCPC(1)
  7. linux中的各文件的颜色含义
  8. java hl7_java-发送HL7消息后何时关闭并重新打开套接...
  9. 深度学习之TensorFlow(一)
  10. Java证书读取的两种方式