春招冲刺(四):flex布局面试题总结
flex布局面试题总结
Q1:什么是弹性盒布局?
- 特点:让元素对不同屏幕尺寸和不同显示设备做好适应。在响应式网站表现较好。
一、容器属性
Q2:display:flex和display:inline-flex的作用
- 使容器变成弹性布局,为其子元素生成弹性格式化的上下文
Q3:flex-direction
- 指定在弹性容器中如何摆放弹性元素
- row(横)、column(竖)
- 加上reverse会反转
Q4:flex-wrap 换行
- 当主轴不够放的时候
- flex-wrap:nowrap/wrap/warp-reverse(换行放上面还是下面)
Q5:flex-flow 弹性流
- 用于定义主轴(row(横)、column(竖))和垂轴的方向(wrap/warp-reverse),以及允许弹性元素换行
- 等于flex-direction和flex-wrap的简写,默认就是横着不换行
- 用法:flex-flow:row wrap
Q6:justify-content
- 控制主轴上如何分布弹性元素
Q7:align-item
- 控制垂轴上的对齐方式
- 轴线的计算是包括边界的
Q8:align-self
- 在单个元素的对齐方式上使用align-self进行覆盖
- 默认值auto会继承align-item属性
Q9:align-content
- 控制垂轴上如何分布弹性元素
二、项目属性
Q10:order
- order属性定义项目的排列顺序。数值越小,排列越靠前,默认为0。
Q11:flex-grow
- flex-grow属性定义项目的放大比例,默认为0,即如果存在剩余空间,也不放大。
Q12: flex-shrink
- flex-shrink属性定义了项目的缩小比例,默认为1,即如果空间不足,该项目将缩小。负值对该属性无效。如果flex-shrink值为0,表示该项目不收缩。
Q13:flex-basis
- flex-basis属性定义了在分配多余空间之前,项目占据的主轴空间(main size)。浏览器根据这个属性,计算主轴是否有多余空间。它的默认值为auto,即项目的本来大小。
Q14:flex属性
- flex属性是flex-grow, flex-shrink 和 flex-basis的简写,默认值为0 1 auto。后两个属性可选。
参考资料
- https://blog.csdn.net/wwwjjjjj666/article/details/128033184
相关文章:
春招冲刺(四):flex布局面试题总结
flex布局面试题总结 Q1:什么是弹性盒布局? 特点:让元素对不同屏幕尺寸和不同显示设备做好适应。在响应式网站表现较好。 一、容器属性 Q2:display:flex和display:inline-flex的作用 使容器变成弹性布局,为其子元素…...
我的 System Verilog 学习记录(7)
引言 本文简单介绍 SystemVerilog 语言的 testbench 组件间通信和数据交互。 前文链接: 我的 System Verilog 学习记录(1) 我的 System Verilog 学习记录(2) 我的 System Verilog 学习记录(3ÿ…...
canvas复习笔记(绘制直线、矩形、圆形、圆弧)
canvas 画一条直线 <body><canvasid"c"width"300"height"200"style"border: 1px solid #ccc;"></canvas> </body><script>// 2、获取 canvas 对象const cnv document.getElementById("c");…...
LeetCode 653. 两数之和 IV - 输入二叉搜索树
653. 两数之和 IV - 输入二叉搜索树 难度:easy\color{Green}{easy}easy 题目描述 给定一个二叉搜索树 rootrootroot 和一个目标结果 kkk,如果二叉搜索树中存在两个元素且它们的和等于给定的目标结果,则返回 truetruetrue。 示例 1…...
【Datawhale图机器学习】图神经网络
图神经网络 GNN是一种连接模型,通过网络中节点之间的信息传递的方式来获取图中的依存关系,GNN通过从节点任意深度的邻居来更新该节点状态,这个状态能够表示状态信息。第一次在论文 The graph neural network model 中提出 与传统NN的区别&a…...
【项目精选】 javaEE采购管理系统(论文+视频+源码)
点击下载源码 本系统是一个独立的系统,用来解决企业采购信息的管理问题。采用JSP技术构建了一个 有效而且实用的企业采购信息管理平台,目的是为高效地完成对企业采购信息的管理。经过 对课题的深入分析,采购系统需实现以下功能模块࿱…...
【Servlet篇2】创建一个web项目
在上一篇文章当中,已经提到了什么是Maven,以及如何使用maven从中央仓库下载jar包。【Tomcat与Servlet篇1】认识Tomcat与Maven_革凡成圣211的博客-CSDN博客Tomcat,mavenhttps://blog.csdn.net/weixin_56738054/article/details/129228140?spm…...
Allegro如何手动让静态铜皮避让过孔操作指导
Allegro如何手动让静态铜皮避让过孔操作指导 在用Allegro做PCB设计的时候,如果铺的是静态铜皮,铜皮铺在过孔上会造成短路,需要手动避让下,如下图 下面介绍如何手动避让,具体操作如下 点击Shape点击Manual Void/Cavity...
Java使用SpringBoot的Filter来扩展管道请求
Java Spring Boot 是一个流行的 Java Web 开发框架,它提供了一些基本的 Web 管道功能。在 Spring Boot 中,Web 管道是通过一组过滤器、拦截器、控制器和视图解析器等组件组成的。 如果你需要扩展 Spring Boot Web 管道,可以考虑以下几种方式…...
「JVM 高效并发」锁优化
为了线程间更高效的共享数据及解决竞争问题,提高程序执行效率,JDK 6 做了大量锁优化,如适应性自旋(Adaptive Spinning)、锁消除(Lock Elimination)、锁膨胀(Lock Coarsening…...
当园区物流遇上云计算,会发生什么事情?
顺丰供应链与亚马逊云科技的强强联手,可以给物流供应链企业带来怎样的启示?物流行业的数智化趋势在国内物流行业说起顺丰,相信是无人不知无人不晓。作为数字化供应链服务解决方案提供商,顺丰供应链可以提供端到端供应链的规划、管…...
作为测试开发岗的面试官,我都是怎么选人的?
最近一段时间面试了不少人,主要是一些测试开发岗,中高级的初级的也都有;也有一些偏业务测试岗的候选人。总结出了一些方法论,或者说更多的是个人作为面试官所遵守的一套面试准则。 1.什么是面试? 面试不仅仅是你问我…...
android事件分发机制源码分析
没什么用的前言责任链设计模式流程图源码分析 没什么用的前言 事件分发机制是面试中一道必问的题目,而我的应对方式则是,在网络上找一些博客看看,然后做一些笔记,最后在面试时将我自己记住的内容说出来。这种方式本身没有太大的…...
今天,小灰37岁了!
人们常常说,35岁是互联网人的中年危机。现在,小灰已经跨过了中年危机,倒不是因为小灰财务自由了,而是因为今天是小灰37岁的生日。年轻时候,小灰总觉得30岁是一个很遥远的年龄,而现在,小灰距离40…...
基于.NET 7 + iView 的前后端分离的通用后台管理系统开源框架
更多开源项目请查看:一个专注推荐.Net开源项目的榜单 今天给大家推荐一套前后端分离通用后台管理系统开源框架。 项目简介 这是基于.Net 7 Vue.js开发的、前后端分离框架,前端UI框架采用iView,该项目只有基础功能模块,不包含具…...
新一代通信协议—— RSocket
一、简介 RSocket 是一种二进制字节流传输协议,位于 OSI 模型中的5~6层,底层可以依赖 TCP、WebSocket、Aeron 协议。最初由 Netflix 开发,支持 Reactive Streams。其开发背后的动机是用开销更少的协议取代超文本传输协议(HTTP),H…...
【编程实践】这个代码命名规范是真优雅呀!代码如诗!!(多读优秀的开源代码,多实践,你也可以一样优秀!)
目录 管理类命名 传播类命名 回调类命名 监控类命名 内存管理类命名 过滤检测类命名 结构类命名 常见设计模式命名 解析类命名 网络类命名 CRUD命名 其他 End 管理类命名 写代码,少不了对统一资源的管理,清晰的启动过程可以有效的组织代码…...
Linux->进程终止和等待
目录 1. 进程终止场景 1.1 进程退出码 1.2 进程常见退出方式 2. 进程等待 2.1 进程等待的必要性 2.2 进程等待的方式 wait()方式 waitpid()方式 options参数 status参数 1. 进程终止场景 代码运行完毕,结果正确 代码运行完毕,结果不正确 代码异…...
超店有数分享:tiktok数据分析工具推荐,助你成功出海!
现阶段的跨境电商人都纷纷入局tiktok,这是风口也是发展趋势。Tiktok的下载量已经超过了35亿,每月都有10亿用户活跃,在154国家/地区使用。Tiktok用户每天在平均花1小时左右进行浏览,打开率也很高。如今,tiktok也越来越成…...
2022 第十四届蓝桥杯模拟赛第三期(题解与标程)
第十四届蓝桥杯模拟赛第三期1. 最小的十六进制问题描述答案提交参考答案2. Excel的列问题描述答案提交参考答案3. 相等日期问题描述答案提交参考答案4. 多少种取法问题描述答案提交参考答案5. 最大连通分块问题描述答案提交参考答案6. 哪一天问题描述输入格式输出格式样例输入样…...
java调用dll出现unsatisfiedLinkError以及JNA和JNI的区别
UnsatisfiedLinkError 在对接硬件设备中,我们会遇到使用 java 调用 dll文件 的情况,此时大概率出现UnsatisfiedLinkError链接错误,原因可能有如下几种 类名错误包名错误方法名参数错误使用 JNI 协议调用,结果 dll 未实现 JNI 协…...
汽车生产虚拟实训中的技能提升与生产优化
在制造业蓬勃发展的大背景下,虚拟教学实训宛如一颗璀璨的新星,正发挥着不可或缺且日益凸显的关键作用,源源不断地为企业的稳健前行与创新发展注入磅礴强大的动力。就以汽车制造企业这一极具代表性的行业主体为例,汽车生产线上各类…...
电脑插入多块移动硬盘后经常出现卡顿和蓝屏
当电脑在插入多块移动硬盘后频繁出现卡顿和蓝屏问题时,可能涉及硬件资源冲突、驱动兼容性、供电不足或系统设置等多方面原因。以下是逐步排查和解决方案: 1. 检查电源供电问题 问题原因:多块移动硬盘同时运行可能导致USB接口供电不足&#x…...
ffmpeg(四):滤镜命令
FFmpeg 的滤镜命令是用于音视频处理中的强大工具,可以完成剪裁、缩放、加水印、调色、合成、旋转、模糊、叠加字幕等复杂的操作。其核心语法格式一般如下: ffmpeg -i input.mp4 -vf "滤镜参数" output.mp4或者带音频滤镜: ffmpeg…...
mysql已经安装,但是通过rpm -q 没有找mysql相关的已安装包
文章目录 现象:mysql已经安装,但是通过rpm -q 没有找mysql相关的已安装包遇到 rpm 命令找不到已经安装的 MySQL 包时,可能是因为以下几个原因:1.MySQL 不是通过 RPM 包安装的2.RPM 数据库损坏3.使用了不同的包名或路径4.使用其他包…...
基于Java+MySQL实现(GUI)客户管理系统
客户资料管理系统的设计与实现 第一章 需求分析 1.1 需求总体介绍 本项目为了方便维护客户信息为了方便维护客户信息,对客户进行统一管理,可以把所有客户信息录入系统,进行维护和统计功能。可通过文件的方式保存相关录入数据,对…...
深入浅出深度学习基础:从感知机到全连接神经网络的核心原理与应用
文章目录 前言一、感知机 (Perceptron)1.1 基础介绍1.1.1 感知机是什么?1.1.2 感知机的工作原理 1.2 感知机的简单应用:基本逻辑门1.2.1 逻辑与 (Logic AND)1.2.2 逻辑或 (Logic OR)1.2.3 逻辑与非 (Logic NAND) 1.3 感知机的实现1.3.1 简单实现 (基于阈…...
离线语音识别方案分析
随着人工智能技术的不断发展,语音识别技术也得到了广泛的应用,从智能家居到车载系统,语音识别正在改变我们与设备的交互方式。尤其是离线语音识别,由于其在没有网络连接的情况下仍然能提供稳定、准确的语音处理能力,广…...
【Linux】Linux安装并配置RabbitMQ
目录 1. 安装 Erlang 2. 安装 RabbitMQ 2.1.添加 RabbitMQ 仓库 2.2.安装 RabbitMQ 3.配置 3.1.启动和管理服务 4. 访问管理界面 5.安装问题 6.修改密码 7.修改端口 7.1.找到文件 7.2.修改文件 1. 安装 Erlang 由于 RabbitMQ 是用 Erlang 编写的,需要先安…...
门静脉高压——表现
一、门静脉高压表现 00:01 1. 门静脉构成 00:13 组成结构:由肠系膜上静脉和脾静脉汇合构成,是肝脏血液供应的主要来源。淤血后果:门静脉淤血会同时导致脾静脉和肠系膜上静脉淤血,引发后续系列症状。 2. 脾大和脾功能亢进 00:46 …...
