如何用声明式的环境定义保证 Agent 的构建与测试在任何机器上可复现?
如何用声明式的环境定义保证 Agent 的构建与测试在任何机器上可复现? 本文先给出可直接复述的结论,再用最小代码说明Dockerfile 保证 Agent 构建测试环境可复现的工作方式、判断依据、项目边界和常见误区。
容器化专题面试题第 1 页,显示第 1–50 题,共找到 184 道完整解析,可继续按分类、标签与关键词缩小范围。
按稳定语义路径排序
如何用声明式的环境定义保证 Agent 的构建与测试在任何机器上可复现? 本文先给出可直接复述的结论,再用最小代码说明Dockerfile 保证 Agent 构建测试环境可复现的工作方式、判断依据、项目边界和常见误区。
在离线或受限网络环境中,Agent 应如何获取和安装依赖? 本文先给出可直接复述的结论,再用最小代码说明离线环境 Agent 私有镜像安装依赖的工作方式、判断依据、项目边界和常见误区。
为什么 Agent 执行环境内必须以非 root 用户运行生成代码,仅靠容器隔离为什么不够? 本文先给出可直接复述的结论,再用最小代码说明Agent 沙箱非 root 运行生成代码的工作方式、判断依据、项目边界和常见误区。
执行 Agent 生成代码时,进程隔离、容器隔离与微虚拟机隔离各自防御什么风险? 本文先给出可直接复述的结论,再用最小代码说明Agent 代码执行沙箱 容器与 microVM 隔离的工作方式、判断依据、项目边界和常见误区。
容器、gVisor、微虚拟机(如 Firecracker)为 Agent 沙箱提供的隔离强度有何差异? 本文先给出可直接复述的结论,再用最小代码说明gVisor Firecracker 容器沙箱隔离强度对比的工作方式、判断依据、项目边界和常见误区。
在 Angular 中,使用 lazy loading 模块时,其依赖的服务是否会被独立实例化?如何确认? 本文先给出可直接复述的结论,再用最小代码说明懒加载模块 服务实例独立性的工作方式、判断依据、项目边界和常见误区。
视频全屏应该请求 video 元素还是容器元素,iOS 行为差异为什么要单列? 本文先给出可直接复述的结论,再用最小代码说明requestFullscreen video iOS webkitEnterFullscreen的工作方式、判断依据、项目边界和常见误区。
MediaRecorder 选型时如何校验 MIME 支持,start(timeslice) 对 ondataavailable 有什么影响? 本文先给出可直接复述的结论,再用最小代码说明MediaRecorder isTypeSupported timeslice ondataavailable的工作方式、判断依据、项目边界和常见误区。
如何用 PerformanceLongTaskTiming 监测页面长任务,50ms 阈值是怎么来的、attribution 能定位到什么粒度? 本文先给出可直接复述的结论,再用最小代码说明Long Tasks API 长任务监测 50ms attribution的工作方式、判断依据、项目边界和常见误区。
Flex 子项默认的自动最小宽度可能保留内容的最小尺寸,长单词或 nowrap 文本于是撑开容器,省略号始终没有溢出空间。给正确层级的子项设置 min-width: 0 或适当 overflow 才能允许收缩;多层嵌套和 Grid 轨道也有类似约束。
inline-block 未限制宽度时会随内容变宽,文字不会在元素内部溢出,text-overflow: ellipsis 因而看不到效果。限定 width 或 max-width 后还要设置不换行与溢出裁剪;纯 inline 元素无法按同样方式指定宽度,表格单元格又受列布局影响。
限宽容器常用 max-width 限制大屏宽度、margin-inline: auto 居中,再留出小屏内边距。width: 100% 与 padding 叠加可能溢出,min-width 又可能压过最大宽度;Flex 子项中的自动最小尺寸也会影响容器能否真正缩窄。
overflow: auto 不只是按需显示滚动条,它还会建立滚动容器和 BFC,裁剪溢出,并改变 sticky 的滚动参照。Flex 子项使用时还可能改变自动最小尺寸;弹层被裁掉或吸顶失效时,应先检查祖先是否设置了它。
overflow: hidden 和 clip 都能裁剪内容,但 hidden 仍可通过脚本或焦点滚动,并会建立滚动容器;clip 不提供这类滚动行为。sticky 参照、BFC 与单轴裁剪因此会不同,overflow-clip-margin 还可调整 clip 的裁剪边界。
sticky 元素会以最近的滚动容器为参照;祖先的 overflow: hidden 可能让它盯着一个并不滚动的容器,页面滚动时自然不吸顶。单轴 overflow 也可能触发类似效果;可按需求调整容器、改用 clip 或移动吸顶元素。
吸顶导航何时开始停住,取决于 top 等偏移阈值与最近的滚动容器;到达包含块边界后又会被带走。通讯录分组标题会依次接替吸附位置,若 sticky 完全不生效,应检查滚动容器、可滚动距离及父元素尺寸。
单行省略需要元素确实发生水平方向溢出,再配合 white-space: nowrap、裁剪和 text-overflow: ellipsis 才能显示省略号。Flex 子项的最小宽度、纯行内元素没有可用宽度或声明写在错误层级,都会让文本继续撑开容器。
::first-line 选择块容器实际排版后的第一行文字,容器宽度变化、字体加载或内容改动都可能改变被选中的字符。它只支持部分文本相关属性,不适用于普通行内盒或 Flex、Grid 容器;不能把它当作固定的首句选择器。
flex 容器里的绝对定位子项不参与弹性布局,不占空间也不被 flex-grow 分配。但容器加了 position: relative 后仍然是它的包含块,定位坐标从容器 padding 边开始算。
默认不换行的 Flex 容器只有一条 flex 行,align-content 没有可分配的行间空间,设置它通常看不到效果。单行子项的交叉轴位置由 align-items 控制;多行容器还需有多余的交叉轴空间才能体现行组对齐。
多行 Flex 容器只有交叉轴留有空白时,线与线之间的剩余空间才会被分散;只有一行或容器高度随内容增长时,改这个值可能看不到效果。通过固定高度的两行卡片对照项目对齐和线组对齐。
align-content 管的是多条 flex line 之间的交叉轴空间分配,align-items 管的是每条 line 内部子项的对齐。两者作用层级不同,必须配合 flex-wrap: wrap 才能看到 align-content 的效果。
align-self 让单个 flex 子项覆盖容器的 align-items 设定,独立控制自己在交叉轴上的对齐方式。它和 justify-content 互不干扰,一个管交叉轴,一个管主轴。
flex 子项在交叉轴方向设 margin auto 会吸收行内所有剩余空间,效果相当于覆盖了 align-items。比如 margin-top: auto 把子项推到底部,比 align-self: flex-end 优先级更高。
flex-direction: column 加 flex-wrap: wrap 时,align-content: stretch 会让各列在交叉轴(水平方向)上等分容器宽度。每列分到相同的宽度,子项在各自列里占满这个宽度。
纵向排列的 Flex 项要换列,容器必须提供可用的主轴高度;每列的项目按这个高度分组,而列宽取决于项目与剩余横向空间。对比固定高度分栏和真正瀑布流,说明为何列底会留白、默认拉伸也不保证各列等宽。
多行 flex 容器没有显式高度时,容器高度由内容撑开。每行的高度等于行内最高子项的高度,行与行紧挨着排列,没有多余空间给 align-content 分配。 同时说明未限定高度时为何通常只随内容增长。
flex-basis 百分比相对容器的主轴内部尺寸计算。容器没有明确尺寸时百分比回退为 content。还要注意 flex-basis: 0 和 flex-basis: 0% 的区别:0 不会触发百分比解析,0% 会。
工具栏按钮设置不收缩后,是否溢出仍取决于容器余量、其他项目的收缩能力和最小尺寸。用由宽到窄的过程观察负空间怎样转移,区分按钮保宽、搜索框收缩和最终横向滚动三个阶段。
响应式卡片使用 Flex 换行时,项目先分到不同的线,每条线再独立计算伸缩与剩余空间。解释为什么最后一排只有一张卡片时可能突然拉宽,并说明需要严格跨行列对齐时应该怎样选择布局方式。
固定页头下的长列表设为弹性增长,仍可能把页面整体撑长而不出现内部滚动。沿纵向 Flex 的祖先链检查高度约束和自动最小高度,找出应允许收缩的那一层,并把滚动交给真正的内容区域。
评论长链接不出现省略号,可能是直接参与 Flex 的外层项目没有真正变窄,而非文本溢出规则失效。沿父子层级定位尺寸瓶颈,先让项目盒可收缩,再检查文本节点是否满足单行、省略和裁剪条件。
手机页头限定单行时,搜索框可能先收缩,按钮碰到最小尺寸后整行才出现溢出。按基础尺寸、收缩权重和项目下限分析这个过程,并与允许换行时先分线后逐线伸缩的计算顺序对比。
文章卡片网格里,某张摘要变长会抬高所在行的轨道,但其他行未必同步等高。区分内容决定的容器高度与显式固定高度,并说明项目拉伸、跨行贡献和内容对齐分别在什么条件下影响视觉结果。
用固定列加弹性列解释 Grid 怎样计算 fr:先扣掉固定轨道和间距,再按系数分配可用空间。还会说明内容的自动最小尺寸为什么可能撑开 1fr,以及如何用 minmax(0, 1fr) 处理长内容。
解释 Grid 中 gap 的真正位置:它位于相邻行轨或列轨之间,跨格项目内部不会再插入间距。通过显式与隐式轨道的例子,说明新增轨道为什么会多出一道 gap,以及 gap 与项目 margin 的区别。
从容器内容盒、固定长度轨道与列间距出发,推导弹性列能拿到的空间。说明 px、百分比和 minmax 对计算的不同影响,并解释容器宽度不确定时百分比为何不能简单按视口宽度套算。
解释自动放置沿列推进时,超出已有显式轨道的项目如何促使 Grid 新建隐式列。结合固定行数的卡片排布,说明 grid-auto-columns 控制新增列宽,而容器缩放不会自行把既有项目改成新的响应式列数。
从不可断开的内容入手解释 Grid 的 min-content 尺寸参与轨道下限计算。澄清“Grid Level 2 改进算法”不能被概括为所有内容都会自动收缩,具体布局还要看跨度、自动最小尺寸与溢出设置。
说明当显式轨道总尺寸小于容器时,可用 justify-content 与 align-content 移动或分散整组轨道。对比 start、center、space-between 和 stretch,并解释 fr 轨道已吃掉自由空间时为什么看不出这些属性的效果。
解释 subgrid 是网格项目在某个轴上继承父轨道的取值,前提是元素本身也是网格容器。结合卡片内部标题与按钮对齐的例子,说明 display: grid、跨轨道范围以及 align-self 的不同职责。并辨析拉伸对齐只是改变项目在单个网格区域内的位置,不等于让多张卡片共用一组行轨道。
说明未命名容器查询如何选择最近的合格祖先,以及 container-name 如何把查询限定到指定祖先。通过卡片嵌套在侧栏中的例子解释名称匹配、容器类型与局部组件复用。同时解释容器名称只筛选目标元素的祖先,不会跨页面查找同名元素,也不能单独开启尺寸查询。
通过外层 @media、内层 @container 的写法,解释视口条件与组件容器条件如何共同限制样式。说明查询作用对象、嵌套时的逻辑与、层叠顺序,以及为什么不能用一个条件代替另一个。示例展示宽视口里的窄侧栏卡片为什么仍应保持单栏,并说明两种条件命中后还会继续参与正常的 CSS 层叠。
说明 container-type 的 normal、inline-size 与 size 有何区别,为什么尺寸查询需要限制被查询尺寸受后代影响,并用可复用卡片例子展示容器创建、后代查询和常见失效原因。同时说明查询规则作用于容器后代,以及为什么只给容器命名或把类型写在目标元素自身,都不能得到预期的宽度判断。
通过同一张卡片在主栏与侧栏中宽度不同的例子解释容器查询的基准,比较媒体查询针对视口与容器查询针对祖先容器的职责,并说明尺寸查询的创建方式及适用场景。进一步说明如何创建尺寸容器、无名查询怎样寻找最近祖先,以及页面骨架和局部卡片分别适合交给哪种规则控制。
解释 @container 嵌套时外层与内层条件都要成立,可能分别匹配不同祖先;再区分容器查询单位 cqw、cqi 的最近合格尺寸容器基准,提醒不要把规则命中的命名容器与单位换算基准混为一谈。通过区块与卡片两层容器展示嵌套条件的实际命中方式,并解释找不到尺寸容器时容器单位的回退结果。
给出容器查询的渐进增强写法:先提供可读的默认单栏,再在支持 @container 的环境中根据容器宽度升级布局。说明为什么无需硬记浏览器版本号,以及如何用真实目标浏览器测试功能与回退。还会区分尺寸查询和其他容器查询能力的兼容性,说明为什么桌面浏览器能用仍需要检查项目实际运行的内嵌浏览器。
解释 @container style(--theme: dark) 读取祖先容器计算后的自定义属性,再给后代应用规则。说明继承、精确值匹配、无需尺寸容器以及普通 CSS 属性样式查询的实现限制。通过卡片主题状态展示样式查询的写法,并区分查询祖先当前样式与检测浏览器是否支持某条声明这两种问题。
比较容器查询单位 cqw、cqh、cqi 与视口单位 vw、vh 的尺寸基准,说明嵌套组件为何更适合容器单位、找不到合格容器时怎样回退,以及容器过窄时如何防止字体和间距缩得过小。还会解释行内轴单位与物理宽度单位在竖排时的差别,以及如何限制字体和内边距在极端容器宽度下的变化。
rem 以根元素字号为基准,适合全站字号和间距尺度;em 以当前元素相关的字体尺寸为基准,适合组件内部跟随文字缩放;vw 等视口单位直接随视口变化。需要流体字号时可用 clamp() 给视口部分设上下限,避免小屏过小、大屏过大。