前端面试基础知识题 1.使用原生js实现以下效果:点击容器内的图标,图标边框变成border:1px solid red,点击空白处重置 const box = document.getElementById...3.分析比较 opacity: 0、visibility: hidden、display: none 优劣和适用场景 结构 display:none: 会让元素完全从渲染树中消失,渲染的时候不占据任何空间..., 不能点击。...visibility: hidden:不会让元素从渲染树消失,渲染元素继续占据空间,只是内容不可见,不能点击 。...opacity: 0: 不会让元素从渲染树消失,渲染元素继续占据空间,只是内容不可见,可以点击。
游戏胜利和失败的条件。 [3]. 游戏交互细节。 1. 游戏操作规则 闭合的单元格中隐藏着 地雷 或 数字。 闭合的单元格可以通过点击打开。 单元格中数字表示九个中含 地雷 的数量。...比如下面的紫框中的 1 单元格,表示它所在的九格中(红框) 存在一个地雷。而红框中只有尾翻开的单元格,那么可以推理出左上角的单元格是雷: 此时就可以通过右键将该区域标记为 地雷。...比如网格区的宽高是行列数乘以单元格尺寸; Hud 尺寸高度是两个单元格大小;宽度是网格宽度。表情按钮的大小是 1.5 被的单元格大小。...如下所示,定义了 GameCellLogic 来处理网格整体的交互逻辑: 这样就可以让逻辑更为紧凑,之后修改交互逻辑,只需要在 GameCellLogic 中处理即可。...常规来看,想让宫格的事件影响到表情按钮,需要通过世界来一层层找到按钮对象,然后修改其图像。这样无疑非常复杂。按钮是被动地被改变,有没有什么手段能主动让按钮主动监听需要变化的事件呢?
网格:交互式表格数据和布局容器 网格 组件是一个容器,能够让用户使用方向导航键,例如 arrow keys、 Home 和 End,来浏览其包含的信息和与其包含的元素进行交互。...在应用阅读模式时,屏幕阅读器用户只能发现可聚焦的元素和标记可聚焦元素的内容。因此,屏幕阅读器用户可能会在不知情的情况下忽略网格中包含的元素,当它们不可聚焦或不用于标记列或行。...虽然在布局栅格中这种类型的焦点移动换行非常有用,但是如果在数据网格中使用就会让用户迷失方向,尤其是辅助技术的用户。...下面样例部分中包含的参考实现,给出了让其他单元格设计尽可能可访问的一些策略,但是使用以上两种模式,才能获得最大程度的无障碍体验。...般来说,使用键盘进行导航时,不可用元素不可聚焦。但是,在某些需要发现功能的场景中,如果不可用元素可聚焦,可以帮助屏幕阅读器用户发现这些功能的存在。
下面是一些常用的Excel工作表打印技巧,让打印出来的报表更易读。...在“页面设置”对话框的“工作表”选项卡中,单击“顶端标题行”右侧的单元格选择按钮,选择需要在每页中重复打印的标题行,单击“确定”,如下图4所示。 ?...有时候,在“页面设置”对话框中,“顶端标题行”不可用,其中的内容呈现灰色,如下图5所示。这是为什么呢?这是由于你在打印预览时打开了“页面设置”对话框。 ?...打印工作表网格线 默认情况下,虽然可以看到工作表中的网格线,但是在打印预览或者打印工作表时,不会显示工作表网格线。...接下来,点击打印按钮,就可以打印所有工作表了。 仅打印所在的表 如果工作表中有表格,可以只打印这个表格而不管工作表中的其他内容。
你将填充其中的每个单元格,网格填满后,就找到了问题的答案。 1 吉他行 这是第一行,只有吉他可供你选择。第一个单元格表示背包的容量为1磅。吉他的重量也是1磅,这意味着它能装入背包!...根据之前计算的最大价值可知,在1磅的容量中可装入吉他,价值1500美元。因此,你需要做如下比较。 为何计算小背包可装入的商品的最大价值呢?...你可以使用这个公式来计算每个单元格的价值,最终的网格将与前一个网格相同。现在你明 白了为何要求解子问题吧?你可以合并两个子问题的解来得到更大问题的解。...答案:不可能。每次迭代时,你都存储当前的最大价值。最大价值不可能比以前低! 练习:假设你还可以选择——MP3播放器,它重1磅,价值1000美元。你会选择吗? 不会。...没办法建模。动态规划功能强大,它能够解决子问题并使用这些答案来解决大问题。但仅当 每个子问题都是离散的,即不依赖于其他子问题时,动态规划才管用。
前言篇 在日常工作中,报表打印和导出为PDF是经常要处理的任务之一。除了方便我们将信息传达给同事和客户外,还可以让工作看起来更加专业、漂亮和规范,从而赢得领导和客户的信任和支持。...第二步新建三个空白的文件(html文件、CSS文件和JS文件),名称可以任意取。 至此已经完成了创建工程文件,下面介绍JS的编写。 2.2编写JS文件 第一步添加表格中的数据信息。...//添加饼状图的方法 function addPieContent(sheet) { //合并单元格 sheet.addSpan(12, 0, 1, 4); //获取指定表单区域中的指定单元格...(Live Server插件) 安装完插件后需要重启VSCode软件,然后在Html文件中右键点击Open With The Live Server(以浏览器打开)便可运行。...,如数据绑定和单元格透视等,让表格更具交互性和易用性。
另一种风格的描述: 假设你是一个小偷,背着一个可装下4磅东西的背包,你可以偷窃的物品如下: ? 为了让偷窃的商品价值最高,你该选择哪些商品?...网格最初是空的。你将填充其中的每个单元格,网格填满后,就找到了问题的答案! 1.吉他行 后面会列出计算这个网格中单元格值得公式,但现在我们先来一步一步做。首先来看第一行。 ?...别忘了,你要做的是让背包中商品的价值最大。这行表示的是当前的最大价值。它指出,如果你有一个容量4磅的背包,可在其中装入的商品的最大价值为1500美元。 你知道这不是最终解。...如果背包的容量为4磅,就能装入价值至少3000美元的商品。在这个网格中,你逐步地更新最大价值。 ? 3.笔记本电脑行 下面以同样的方式处理笔记本电脑。...3磅容量的最大价值为2000美元!再加上iPhone价值2000美元,总价值为4000美元。新的最大价值诞生了! 最终的网格如下。 ? 问题:沿着一列往下走,最大价值可能降低吗? ? 答案是:不可能。
: hidden; 清除浮动 --》右下角等需要的元素将不可见(比如 分享到、回到顶部等按钮) 2.7.1 overfloat: [ hidden | scroll...1.1.2 解决办法2:引用 html5shiv.min.js 文件,让该js文件处理标签 //引用即可...解决办法:不建议让子元素宽高 > 父级元素宽高 1.4 p包含块级元素标签。...1.1.2 解决办法2:引用 html5shiv.min.js 文件,让该js文件处理标签 //引用即可...解决办法:不建议让子元素宽高 > 父级元素宽高 1.4 p包含块级元素标签。
深度优先&广度优先 图片 图片 动画过大,点击查看 bfs:适用于层序遍历或者寻找最短路径的问。...岛屿的面积是岛上值为 1 的单元格的数目。计算并返回 grid 中最大的岛屿面积。如果没有岛屿,则返回面积为 0 。...图片 方法1.dfs 思路:深度优先,先循环网格, 当grid[x][y] === 1时,将当前单元格置为0并上下左右不断递归,计算每个岛屿的大小,然后不断更新最大岛屿 复杂度:时间复杂度O(mn),m...、n分别是网格的长和宽。...,找到下一层的网格坐标,加入队列,直到队列为空 复杂度:时间复杂度O(mn),m、n分别是网格的长和宽。
搞定大厂算法面试之leetcode精讲6.深度优先&广度优先 深度优先&广度优先 ds_38 ds_39 动画过大,点击查看 bfs:适用于层序遍历或者寻找最短路径的问。...岛屿的最大面积 (medium) ds_181 方法1.dfs 思路:深度优先,先循环网格, 当grid[x][y] === 1时,将当前单元格置为0并上下左右不断递归,计算每个岛屿的大小,然后不断更新最大岛屿...复杂度:时间复杂度O(mn),m、n分别是网格的长和宽。...,不断将当前网格的坐标加入队列,如果当前网格对应的值是1,则置为0,然后向四周扩散,找到下一层的网格坐标,加入队列,直到队列为空 复杂度:时间复杂度O(mn),m、n分别是网格的长和宽。...图像渲染 (easy) 方法1.dfs 复杂度:时间复杂度O(mn),m、n分别是网格的长和宽。
你甚至可以使用 Vue 组件来自定义网格 UI 和单元格内容/行为。...每个图标都设计在一个24×24的网格上,强调简单,一致性和易读性。很多大厂出品的前端框架都内置了这款可以免费商用的图标。...Vue Chartjs 地址:https://github.com/apertureless/vue-chartjs vue-chartjs 是一个 Vue 对于 Chart.js 的封装,让用户可以在...Vue中轻松使用Chart.js,很简单的创建可复用的图表组件,非常适合需要简单的图表并尽可能快地运行的人。...vue-chartjs抽象了基本逻辑,同时也暴露了Chart.js对象,让用户获得最大的灵活性。
这可能会出现大量单元的性能问题。然而,多少是一个很大的数字是一个不可能回答的问题。这将取决于您的单元格视图的复杂性。...尽管这里的大多数示例都可以,但每一行可以包含任意数量的单元格。 探索网格选项 在以下部分中,我们将探讨不同的网格大小、对齐和跨越选项。...在这种情况下,父级是网格。通常,列与其中最宽的单元格一样宽。在下面的示例中,橙色列的宽度由第二行中最宽的单元格决定。身高也是如此。在示例中,第二行与行中最高的紫色单元格一样高。...这与我们从使用 HStack 容器的第一天起就看到的行为相同。但是,Grids 在这里为我们提供了一个选择。我们可以让单元格避免让网格增长以获得额外的空间。...第 6 步:要删除空白区域,请剪裁网格边框(或将其放在 ScrollView 中,它会为您进行剪裁)。步骤#7:如果使垂直间距等于水平间距,则单元格将均匀分布。 初始点 为了让你开始,这里有一些代码。
导航栏->编辑->首选参数,这里有很多操作可以自行.. 5.1.2直接插入多个连续空格 5.1.3设置是否显示不可见元素 视图中有一些元素仅用来标志元素的位置而在浏览器中是不可见,...不是这个通道中的每一项操作都会在网页界面中显示,但会在代码中显示,(也就是“设置不可见元素”)比如: 6.DW图像和多媒体网页设计 6.1图像 6.1.1网页中3种常见图像格式: GIF...(点击属性–链接后的文件夹按钮–选择网页 7.2.下载文件超链接:在网页中提供资料来下载,就需要为文件下载链接。...7.3.电子邮件链接:让浏览者把网站内容以邮件形式发送出去 (插入–电子邮件链接–输入显示的文本和目的地址(预览会发现,点击将自动打开个人邮箱软件) 7.4.脚本链接 执行js代码或者调用js...方框:表格中的单元格的性质。 列表:设定项目符号和编号的外观。 定位:精确控制网页元素的位置,主要是层。
点击文末“阅读原文”填表入群 一直想写这样一本介绍数据可视化的书。...在文章中,大家最好让表格内字体小于正文1个字号,保持非封闭的表格会有不一样的视角效果,似乎更显专业水准!当然中西文化的差异也可能存在不同观点!...最笨也是最没有办法的办法就是把Label变成图片贴上去盖住原来的;当然,Excel是可以实现的,只要在标签单元格用Alt+Enter就可以在一个单元格输入多行标签了;如果不想改变原来的文本格式,就让单元格引用其它位置就可以了...,所以在图表中要有能力和用心去修改图表中的每一个元素!...点评:我们应该选择上面的,因为网格线会让我们看不清晰,最好不要用网格线;当然颜色也是非常重要的,记住条件格式的应用,别一点一点的把数值变字体颜色,要用规则变;当然细节也是非常重要的,比如字体、数值、对齐等格式问题
Ag-Grid 是一个基于Vue.js的数据表格组件。其中,“ag” 表示 “agnostic”。内部 ag-Grid引擎是在TypeScript中实现的,零依赖关系。...你甚至可以使用Vue组件来自定义网格UI和单元格内容/行为。...基于一个非常简单的想法:通过管理具有多个加载状态的数组(或者Vuex存储),让内置加载程序组件侦听注册的加载程序,并立即进入加载状态。...vue-chartjs 是一个 Vue 对于 Chart.js 的封装,让用户可以在Vue中轻松使用Chart.js,很简单的创建可复用的图表组件,非常适合需要简单的图表并尽可能快地运行的人。...vue-chartjs抽象了基本逻辑,同时也暴露了Chart.js对象,让用户获得最大的灵活性。 V-Charts 地址:https://github.com/ElemeFE/v-...
Leetcode79单词搜索(深度遍历解法) 给定一个 m x n 二维字符网格 board 和一个字符串单词 word 。...如果 word 存在于网格中,返回 true ;否则,返回 false 。 单词必须按照字母顺序,通过相邻的单元格内的字母构成,其中“相邻”单元格是那些水平相邻或垂直相邻的单元格。...同一个单元格内的字母不允许被重复使用。...boolean} */ const point = [0, -1, 0, 1, 0]; var exist = function (board, word) { //如果word中有board中没有出现过的字母直接返回...const [ni, nj] = [i+point[k], j+point[k+1]]; flag ||= dfs(ni,nj,step+1); //看四个方向上有没有至少一个
1.2 方向流体Shader 在本教程中,我们将创建一个不同的流着色器。与其让纹理变形,不如让纹理与流对齐。复制DistortionFlow着色器并将其重命名为DirectionalFlow。...在FlowCell中执行此操作最合适了,因此我们可以继续使用整数作为offset参数。着色器编译器会消除多余的计算。 ? ? (重叠单元格) 现在,水平单元重叠,发生频率是我们实际使用的图块的两倍。...(Tiling 1,网格分辨率30) 增加平铺可以使分辨率提高,但也可以减小纹波。你需要找到一种最适合每种情况的平衡。例如,对于本教程中的图像,将5的Tiling与30的网格分辨率结合起来效果很好。...4.2 观察网格 还有一种失真,是由单元格之间的混合引起的。如果方向或速度差异足够大,则平铺可能会变得很明显。例如,在我们放大流体贴图的同时,将网格分辨率设置为3。 ?...消除失真的唯一方法是摆脱均匀区域和混合区域之间的过渡,但这是不可能的。接下来的最好的办法就是涂抹差异。 我们可以做的是对整个网格进行两次采样。
"); sheet.Protected = true; 七、让网格线不可见 默认情况下,Sheet的网格线是可见的,有时候,我们可以设置网格线不可见,具体代码如下: sheet.ViewOptions.ShowGridLines...= false; 八、写入单元格 访问单元格的方式有三种,三种分别如下: sheet.Cells["A1"] sheet.Cells[0,0] sheet.Rows[0].Cells[0] 以上三种方法都可以访问单元格...,但如下写入单元格呢,其实方法很简单,如下: sheet.Cells["A1"].Value= 内容 以上没有加双引号的原因是:内容不一定是字符串,有可能是数字、日期等。...设置图表标题不可见,代码如下: chart.Title.IsVisible = false; 设置X轴与Y轴的标题可见,代码如下: chart.Axes.Horizontal.Title.Text =...sheet.ProtectionSettings.SetPassword("cnxy"); sheet.Protected = true; //设置网格线不可见
标签:Excel技巧 我们知道,在单元格中输入数据时,我们可以通过按Alt+回车键来强制内容换行。然而,在Excel中,有没有办法统计单元格中究竟有几行数据呢?如下图1所示。...图1 可以使用公式来实现,在单元格B2中输入公式: =LEN(A2)-LEN(SUBSTITUTE(A2,CHAR(10),""))+1 其中,CHAR(10)代表换行符。...将上述公式下拉复制,就可以得到其它单元格中的行数。 你可能会发现,对于空单元格,上述公式会返回结果1。我们可以对公式稍作调整,让其对空单元格返回结果0。...调整后的公式如下: =LEN(A2)-LEN(SUBSTITUTE(A2,CHAR(10),""))+(LEN(A2)>1) (感叹)在使用Excel的过程中,你可能会碰到很多千奇百怪的问题,但Excel...总是会有办法予以解决。
领取专属 10元无门槛券
手把手带您无忧上云