文档的源代码地址，需要的下载就可以了（访问密码：7567）
https://url56.ctfile.com/f/34653256-527823386-04154f

正文：

编写中间模块

添加显示样式

数字模块 no 有个背景颜色 rgba(101, 132, 226, 0.1); 有个15像素的内边距

查看效果

注意中间列 column 有个 左右 10px 下 15px 的外边距

查看效果

no 模块里面上下划分 上面是数字（no-hd) 下面是相关文字说明(no-bd)

no-hd 数字模块 有一个边框 1px solid rgba(25, 186, 139, 0.17)

查看效果

no-hd 数字模块 里面分为两个小li

每个小li高度为 80px 文字大小为 70px 颜色为 #ffeb7b 字体是图标字体 electronicFont

声明一个字体

字体使用，添加其它样式

查看效果

no-hd 利用 after 和 before制作2个小角， 边框 2px solid #02a6b5 宽度为 30px 高度为 10px

查看效果

小竖线 给 第一个小li after 就可以 1px宽 背景颜色为 rgba(255, 255, 255, 0.2); 高度 50% top 25% 即可

查看效果

no-bd 里面也有两个小li 高度为 40px 文字颜色为 rgba(255, 255, 255, 0.7) 文字大小为 18px 上内边距为 10px

查看效果

Echart可视化学习（三）的更多相关文章

  1. Echart可视化学习集合

    一.基本介绍:ECharts是一款基于JavaScript的数据可视化图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表.ECharts最初由百度团队开源,并于2018年初捐赠给Apache ...

  2. Echart可视化学习（二）

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 页面主体部分 设置测试样式 ...

  3. Echart可视化学习（五）

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 常见的数据可视化库: D3.js ...

  4. Echart可视化学习（一）

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 创建需要的目录结构及文件 ...

  5. Echart可视化学习（四）

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 地图模块高度为 810px ...

  6. Echart可视化学习（六）

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 柱状图定制 官网找到类似实例, 适 ...

  7. Echart可视化学习（七）

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 官网找到类似实例, 适当分 ...

  8. Echart可视化学习（八）

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 新增需求 点击 2020年 ...

  9. Echart可视化学习（九）

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 官网找到类似实例, 适当分析,并且 ...

随机推荐

  1. MySQL信息系统函数

  2. TypeScript 数据类型---枚举 (Enum)

    一.基础用法 1.默认值 从0开始递增+1 enum Color {Red, Green, Blue} let c: Color = Color.Red; let d: Color = Color.G ...

  3. VUE3 之 template 语法

    1. 概述 老话说的好:干一行,爱一行,踏实工作才是真正快乐的源泉. 言归正传,今天继续聊 VUE3 的话题,今天聊聊 template 语法. 闲话不多说,直接上代码. 2. template 语法 ...

  4. MySQL 的日志：binlog

    前言:binlog 用于记录数据库执行写入性操作的日志信息,以二进制的形式保留在磁盘中.它是由 Server 层进行记录的,使用任何存储引擎都会产生 binlog. 实验准备 我们通过 Docker ...

  5. CF975A Aramic script 题解

    Content 定义一个字符串的根为字符串中不同种类的字符按字典序非降序排列得到的字符串.例如 \(\texttt{aaa}\) 的词根为 \(\texttt{a}\),\(\texttt{babb} ...

  6. CF450B Jzzhu and Sequences 题解

    Content 有一个长度为 \(n\) 的数列 \(\{a_1,a_2,\dots,a_n\}\),满足如下的递推公式: \(i=1\) 时,\(a_1=x\). \(i=2\) 时,\(a_2=y ...

  7. 系统分析师教程(张友生)高清pdf下载

    最近准备考系统分析师,故找了一本张又生编著的<系统分析师教程>的电子书,本来想买本书,可惜有点小贵,舍不得,故寻找电子版下载,花了不少时间才找到,现在分享给大家. http://item. ...

  8. 通过css实现表格的斜线

    效果图 实现思路 编辑一个svg文件,可以自定义线条颜色和粗细. 将svg文件转为base64格式,作为背景图属性设置. svg转base64的网址:https://www.sojson.com/im ...

  9. AcWing1264. 动态求连续区间和 (树状数组做法)

    1.题目 给定 n 个数组成的一个数列,规定有两种操作,一是修改某个元素,二是求子数列 [a,b] 的连续和. 输入格式 第一行包含两个整数 n 和 m,分别表示数的个数和操作次数. 第二行包含 n ...

  10. 百度地图AK密钥申请

    注册登录 :http://lbsyun.baidu.com/apiconsole/key#/home 然后点击提交 这个就是AK密钥