css 多层 background-image 叠加实现渐变与斜线纹理，需控制图层顺序、尺寸、重复及盒模型；斜线用 45deg 线性渐变硬边色标模拟，主渐变置下层并设 cover，body 需重置 margin 和 min-height，并兼顾 ie11/safari 兼容性。
直接用 background-image 叠加渐变和斜线纹理
HTML 本身不处理背景，所有复合效果都靠 CSS 的 background-image 多层叠加实现。关键不是“怎么加”，而是“哪层在前、哪层在后、怎么控制透明度和尺寸”。background-image 支持用逗号分隔多个图层，浏览器按从左到右顺序渲染：左边的图层在上层，右边的在下层。
- 斜线纹理必须用
linear-gradient()模拟（比如linear-gradient(45deg, rgba(255,255,255,0.1) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.1) 50%)），不能用真实图片——否则缩放错位、响应式难控 - 主渐变背景写在右侧（下层），斜线纹理写在左侧（上层），否则会被盖住
- 斜线层必须设
background-size: 20px 20px（或类似值）来控制条纹密度；主渐变层必须设background-size: cover或100% 100%避免拉伸 - 两层都要加
background-repeat: repeat（斜线层必须重复，主渐变层通常用no-repeat）
斜线纹理参数怎么调才不糊、不卡顿
斜线本质是极窄角度的重复渐变，调不好会发虚、锯齿或 GPU 渲染卡顿。核心是控制色标位置和尺寸比例，不是堆 opacity。
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
下载
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- 角度固定用
45deg或-45deg，别用to top left这类关键词——不同浏览器解析有偏差 - 色标必须成对出现且紧邻：比如
rgba(255,255,255,0.08) 33%, transparent 33%，中间无过渡区间，才能出硬边条纹 -
background-size值建议设为偶数像素（如16px、24px），奇数值在高 DPI 屏幕易模糊 - 避免在斜线层用
hsla()或带小数的 alpha（如0.075），某些旧版 Chrome 会渲染异常；统一用rgba(r,g,b,0.08)
body 元素上叠加时容易漏的关键声明
只写 background-image 不够，body 默认有 margin、无 height、可能被父容器裁剪，导致渐变+纹理只显示左上角一小块。
- 必须重置：
body { margin: 0; min-height: 100vh; }，否则100%高度计算失效 -
background-attachment: scroll是默认值，但显式写出能防某些 iOS Safari 的 fixed 错位 bug - 必须设
background-position: center，否则斜线纹理锚点偏移，窗口缩放时条纹“滑动” - 如果页面内容少，
html { height: 100% }要同步加，否则body的100vh在部分安卓 WebView 中不生效
IE11 和 Safari 15.4 以下的兼容底线
IE11 支持 linear-gradient 但不支持多层 background-image 中的透明色叠加；Safari 15.4 之前对 background-size 多值语法支持不稳定。不能全靠 Autoprefixer 补。
- IE11 下降级方案：只保留主渐变，去掉斜线纹理层，用
background: -ms-linear-gradient(135deg, #6a11cb, #2575fc)单独声明（前缀必须在标准写法之前） - Safari 15.3 及更早：把斜线层的
background-size写成20px 20px，别用cover或contain；主渐变层禁用background-size: cover，改用100% 100% - 所有场景都必须提供
background-colorfallback，比如background-color: #6a11cb，否则无 JS 时白屏
linear-gradient()，而是确认 body 的盒模型边界、各层 background-size 的单位是否一致、以及 Safari 里 background-position 是否被 transform 干扰。这些细节一错，整页背景就飘、断、或只显示一半。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
