WENROUbalance-优快云博客

原创 Echarts介绍

1. Echarts的介绍ECharts，缩写来自 EnterpriseCharts，商业级数据图表，是百度的一个开源的数据可视化工具，一个纯 Javascript 的图表库，能够在 PC 端和移动设备上流畅运行，兼容当前绝大部分浏览器。2. Echarts的特点：丰富的可视化类型折线图，柱状图，饼状图，k线图，散点图……提供了上百种图形（只有你想不到，没有他做不到）3. 特点：多种数据的支持Key-value数据支持二维表TypedArray格式4. 特点：流数据的支持超大的数据量流数据的渲染增量渲染技术

2021-11-17 14:44:14 2836

原创响应式布局

正在上传…重新上传取消1.先创建一个html 2.写一个有序列表 3.用style写个样式，先给它一个宽高 4。再给它分每一份的宽度 5.最后浏览器查看就可以了

2021-11-08 19:19:41 133

原创 CSS定位

1.本例演示如何相对于一个元素的正常位置来对其定位。2.把下面图片中的代码打出来相对定位会按照元素的原始位置对该元素进行移动比如，样式 "left:-20px" 从元素的原始左侧位置减去 20 像素，样式 "left:20px" 向元素的原始左侧位置增加 20 像素。效果图如下3.本例演示如何使用绝对值来对元素进行定位。4.把下面图片中的代码打出来通过绝对定位，元素可以放置到页面上的任何位置。下面的标题距离页面左侧 100px，距离页面顶部 150px。效果图如下5.本例演示如何相对于浏览器窗口来对

2021-10-28 15:27:15 131

原创 HTML中制作一个圆

在导航栏中找到文件，选择新建 2.新建一个HTML文档 3.在body标签中放入div标签 4.在head标签中放入一个style标签 5.在style标签中选择到body标签中的div标签 6.在style标签中给div标签添加一个100px的宽度 7. 在style标签中给div标签添加一个100px的高度 8. 在style标签中给div标签添加一个背景颜色，打开浏览器查看，我们获得了一个正方形 9. 在style标签中给div标签添加百分之50的圆角效果，打开浏览器查看我们获得了一个圆

2021-10-18 08:57:47 2960 1

原创五图轮播案例

首先我们创建一个HTML文件从外部引入css样式 2. 在HTML文件中将轮播的源代码打出，如下图 3. 之后在将轮播的小按钮源代码打出，如下图 4. 用a标签来作为轮播左右切换的箭头 5. css中当内容溢出框，超出部分隐藏，利用的代码为overflow:hidden(超出部分隐藏) 6. 在js中设置左右箭头点击切换图片，如下图 7. 在JS中设置轮播自动播放，如下图 8. 在JS中设置鼠标移入container容器时停止自动播放，如下图 9. 在JS中设置鼠标移出container容器时自动播放，如下

2021-10-11 16:24:42 319

原创三级菜单案例

1.新建一个HTML文件如图2.再观察已经完成的案例，将布局分为两大部分3.再代入进源代码中，将自己所需要的布局以及注释写出源代码效果为：4.再通过<style></style>标签，直接在html文档中写出二级菜单的背景边框样式5.再接着完成后续的样式内容6.最后，为按钮添加鼠标移入伪类效果（hover）最终效果呈现为：...

2021-09-28 08:58:26 129

原创 HTML中移入与隐藏

1. 新建一个HTML文件，并引入css、JavaScript文件2. 在文件内放置一个div,设置类名为cont，并给些样式 3. 在div内放置button标签，将button（类名：btn）标签内容写成显示,并给些样式 4. 然后在下面放置table（id、类名：planTab）标签，并写入内容 5. 然后给table标签写些样式 6. 鼠标移入：在用封装函数在js文件内写入：function hoPlanTab（）7. 先获取表格：var oTab = document.getElementBy

2021-09-19 08:22:49 588

原创 Css模型框

1. css模型框（Box Model）规定了元素框处理元素的内容，内边距，边框和外边距的方式。2. css框模型概述3. 元素框的最内部分内容是实际的内容，直接包围内容的是内边距。内边距呈现了元素的背景，内边距的边缘是边框，边框以外是外边距，外边距默认是透明的，因此不会遮挡其后的任何元素4. 内边距、边框和外边距都是可选的，默认值是零。但是，许多元素将由用户代理样式表设置外边距和内边距。可以通过将元素的 margin 和 padding 设置为零来覆盖这些浏览器样式。这可以分别进行，也可以使

2021-09-07 14:54:15 159

原创 DW中的变形与位移

变形—位移translate（）函数可以将元素向指定的方向移动，类似于position中的relative。或以简单的理解为，使用translate（）函数，可以把元素从原来的位置移动，而不影响在X、Y轴上任何web组件。translate我们分为三种情况：1. translate（X,Y）水平方向或垂直方向同时移动（也就是X轴和Y轴同时移动）2. translateX（X）仅水平方向移动（X轴移动）3. translateY（Y）仅垂直方向移动（Y轴移动）用法：transform:transl

2021-08-29 14:42:08 1152

原创 Axure进度条案例

注意看红色圆圈，共有、17步骤，按顺序操作下去1、拖一个矩形出来大小为300*38 名字写为12、在拖一个矩形出来大小1*38 名字写为23、把2填充一个你自己喜方的颜色4、选择2点击载入时5、选择设置尺寸6、勾选27、调好数据8、拖一个三级标题出来隐藏9选择三级标题点击显示时10选择设置文本11勾选当前原件12调好数据13等待0秒...

2021-08-17 15:40:03 162

原创 Axure计算器案例

第一步，用文本框框出我们要输入数字的地方，作成如图中所示就行了，那个结果是个矩形上写文字，那个乘号所在的框架是标明这是能算什么的计算机，然后再页面标明好要是输入数字的文字框的先后顺序。第二步，点击结果矩形，双击鼠标单击时的事件，然后在添加动作里找到设置文本在配置动作里找到有结果字的矩形，再点击右下角的fx。第三步，在里面找到添加局部变量，再找到右边的一个倒三角，点击它换好如图中的数字。然后在里面找到如图中的字母，然后把它们中间的括号去掉，只留左右两边的，然后在它们中间加入加减乘除任意一个符号，这关系到网站上

2021-08-08 19:08:13 1251

原创 Axure动态面板案例

1.拖出四张图片。2.然后，把第一张图片，给隐藏了。3.然后拉第二张图片遮住第一张图片。4.最后把这三张图给放上图片，隐藏的那一张不用放。5.右击鼠标找到“转换为动态面板”把三张图片都转换为动态面板。6.找到“拖动时”点击它。7.然后找到“移动”，勾上“当前元件”。8.在右边找到“拖动结束时”点击它。9.然后找到“移动“，把“当前元件”给勾上。10.在找到“设置尺寸”，把第一张图片给勾上。11.点击右下方的“FX”。12.然后点击“插入变量或函数”，往下滑找到“Windowwidth”点击它，然后确定。13

2021-07-28 08:10:38 365

原创 Axure案例

1.拖出三个矩形，如下图所示：2.将上面第一个矩形去掉它的下边框，第二个矩形去掉它的上边框和右边框，下面大的矩形去掉它的上边框，接着分别放入四张不一样的小图（转换成四个动态面板），中间再放一张大图（大图是第一张小图放大）并隐藏它，最后再将全部统一再转换成一个动态面板，如下图：.3.点击小图1，设置拖动时，移动当前图片，再设置拖动结束时，其它三张小图也是一样的设置，将图片换成对应的图片即可4.将二设置为动态面板State25.将动态面板State1再复制粘贴一个为State2，打开State26.上面两个矩形

2021-07-17 14:52:07 769

原创手风琴案例

1、矩形，填充颜色，输入内容2、将刚刚设置好的转换为动态面板3、再复制一个动态面板24、在动态面板2里复制三个矩形并调整填充颜色，输入内容5、动态面板，鼠标单击时，设置面板状态，选择状态2，推动元件，方向下方，动画线性6、进入到面板2鼠标单击时，设置面板状态，选择状态1，推动元件，方向下方，动画线性7、全部设置完后，复制三个（每个之间要有一定的空隙），最后预览...

2021-06-27 19:08:23 101

原创 AI混合工具的使用

步骤1：创建一个新文件.步骤2：创建一个星星和一个小椭圆.步骤3：选择两个形状,然后使用“工具箱”中的“混合工具”.这是默认的混合工具.步骤4： “混合对象”将如下所示.步骤5：现在,对星星使用粉红色,对圆圈使用黄色,然后再次使用混合工具.我们可以使用混合选项更改混合对象的设置.步骤6：在此之后,选择两个对象并使用Blend Tool.使用“混合选项”使用“平滑颜色功能”.步骤7：现在,创建一个新文件.画任何颜色的三个椭圆.步骤8：选择所有三个圆并使用混合工具.步骤9：使用钢笔工具绘制一条路径.步.

2021-06-16 19:14:54 2362

原创 Axure中全局变量如何添加

还不了解AxureRP8设置一个矩形全局变量的操作步骤的朋友，就一起去下文看看的AxureRP8设置一个矩形全局变量的教程，相信对大家会有所帮助的。1、双击打开AxureRP8设计软件，创建了一个空白的画布，如下图所示：2、在“基本元件”中找到“矩形2”，拖一个到画布中，如下图所示：3、在右侧“属性”选项卡中，双击“页面载入时”，添加用例;在全局变量下单击“设置变量值”，如下图所示：4、点击“添加全局变量”，添加四个变量data1、data2、data3和data4，它们的默认值分别为1、2、3和4，如下图

2021-06-07 19:08:02 1051

WENROUbalance的博客