[{"data":1,"prerenderedAt":278},["ShallowReactive",2],{"content-/guide/css-frameworks":3,"related-guide":246},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":8,"description":9,"keywords":10,"author":11,"date":12,"category":13,"image":14,"body":15,"_type":240,"_id":241,"_source":242,"_file":243,"_stem":244,"_extension":245},"/guide/css-frameworks","guide",false,"","CSS 框架","在 HTMLPAGE 中使用和集成 CSS 框架","CSS, Bootstrap, Tailwind, CSS 框架, HTMLPAGE","HTMLPAGE","2025-11-27","开发","/content-images/guide/guide.jpg",{"type":16,"children":17,"toc":228},"root",[18,26,32,39,46,71,77,100,106,129,135,158,164,187,193,215,219],{"type":19,"tag":20,"props":21,"children":23},"element","h1",{"id":22},"css-框架",[24],{"type":25,"value":8},"text",{"type":19,"tag":27,"props":28,"children":29},"p",{},[30],{"type":25,"value":31},"HTMLPAGE 支持与各种 CSS 框架的集成和使用。",{"type":19,"tag":33,"props":34,"children":36},"h2",{"id":35},"支持的框架",[37],{"type":25,"value":38},"📌 支持的框架",{"type":19,"tag":40,"props":41,"children":43},"h3",{"id":42},"_1-tailwind-css",[44],{"type":25,"value":45},"1. Tailwind CSS",{"type":19,"tag":47,"props":48,"children":49},"ul",{},[50,56,61,66],{"type":19,"tag":51,"props":52,"children":53},"li",{},[54],{"type":25,"value":55},"原子化 CSS",{"type":19,"tag":51,"props":57,"children":58},{},[59],{"type":25,"value":60},"高度可定制",{"type":19,"tag":51,"props":62,"children":63},{},[64],{"type":25,"value":65},"性能优秀",{"type":19,"tag":51,"props":67,"children":68},{},[69],{"type":25,"value":70},"社区活跃",{"type":19,"tag":40,"props":72,"children":74},{"id":73},"_2-bootstrap",[75],{"type":25,"value":76},"2. Bootstrap",{"type":19,"tag":47,"props":78,"children":79},{},[80,85,90,95],{"type":19,"tag":51,"props":81,"children":82},{},[83],{"type":25,"value":84},"组件丰富",{"type":19,"tag":51,"props":86,"children":87},{},[88],{"type":25,"value":89},"文档完善",{"type":19,"tag":51,"props":91,"children":92},{},[93],{"type":25,"value":94},"易于使用",{"type":19,"tag":51,"props":96,"children":97},{},[98],{"type":25,"value":99},"应用广泛",{"type":19,"tag":40,"props":101,"children":103},{"id":102},"_3-其他框架",[104],{"type":25,"value":105},"3. 其他框架",{"type":19,"tag":47,"props":107,"children":108},{},[109,114,119,124],{"type":19,"tag":51,"props":110,"children":111},{},[112],{"type":25,"value":113},"Bulma",{"type":19,"tag":51,"props":115,"children":116},{},[117],{"type":25,"value":118},"Foundation",{"type":19,"tag":51,"props":120,"children":121},{},[122],{"type":25,"value":123},"Semantic UI",{"type":19,"tag":51,"props":125,"children":126},{},[127],{"type":25,"value":128},"Ant Design",{"type":19,"tag":33,"props":130,"children":132},{"id":131},"框架使用",[133],{"type":25,"value":134},"🎯 框架使用",{"type":19,"tag":47,"props":136,"children":137},{},[138,143,148,153],{"type":19,"tag":51,"props":139,"children":140},{},[141],{"type":25,"value":142},"自动应用样式",{"type":19,"tag":51,"props":144,"children":145},{},[146],{"type":25,"value":147},"自定义配置",{"type":19,"tag":51,"props":149,"children":150},{},[151],{"type":25,"value":152},"样式覆盖",{"type":19,"tag":51,"props":154,"children":155},{},[156],{"type":25,"value":157},"主题定制",{"type":19,"tag":33,"props":159,"children":161},{"id":160},"框架选择",[162],{"type":25,"value":163},"💡 框架选择",{"type":19,"tag":47,"props":165,"children":166},{},[167,172,177,182],{"type":19,"tag":51,"props":168,"children":169},{},[170],{"type":25,"value":171},"考虑项目规模",{"type":19,"tag":51,"props":173,"children":174},{},[175],{"type":25,"value":176},"评估学习成本",{"type":19,"tag":51,"props":178,"children":179},{},[180],{"type":25,"value":181},"检查社区支持",{"type":19,"tag":51,"props":183,"children":184},{},[185],{"type":25,"value":186},"测试性能影响",{"type":19,"tag":33,"props":188,"children":190},{"id":189},"相关资源",[191],{"type":25,"value":192},"🔗 相关资源",{"type":19,"tag":47,"props":194,"children":195},{},[196,206],{"type":19,"tag":51,"props":197,"children":198},{},[199],{"type":19,"tag":200,"props":201,"children":203},"a",{"href":202},"/features/style-system.md",[204],{"type":25,"value":205},"样式系统",{"type":19,"tag":51,"props":207,"children":208},{},[209],{"type":19,"tag":200,"props":210,"children":212},{"href":211},"/ai/style-customization.md",[213],{"type":25,"value":214},"样式定制",{"type":19,"tag":216,"props":217,"children":218},"hr",{},[],{"type":19,"tag":27,"props":220,"children":221},{},[222],{"type":19,"tag":223,"props":224,"children":225},"em",{},[226],{"type":25,"value":227},"CSS 框架能加速开发效率。",{"title":7,"searchDepth":229,"depth":229,"links":230},3,[231,237,238,239],{"id":35,"depth":232,"text":38,"children":233},2,[234,235,236],{"id":42,"depth":229,"text":45},{"id":73,"depth":229,"text":76},{"id":102,"depth":229,"text":105},{"id":131,"depth":232,"text":134},{"id":160,"depth":232,"text":163},{"id":189,"depth":232,"text":192},"markdown","content:guide:css-frameworks.md","content","guide/css-frameworks.md","guide/css-frameworks","md",[247,259,270],{"_path":248,"_dir":249,"_draft":6,"_partial":6,"_locale":7,"title":250,"description":251,"keywords":252,"author":11,"date":253,"category":254,"image":255,"_type":240,"_id":256,"_source":242,"_file":257,"_stem":258,"_extension":245},"/blog/accessibility-guidelines","blog","无障碍设计指南","WCAG 标准和无障碍设计最佳实践","无障碍设计指南, Blog, HTMLPAGE","2025-11-26","待分类","/content-images/blog/blog.jpg","content:blog:accessibility-guidelines.md","blog/accessibility-guidelines.md","blog/accessibility-guidelines",{"_path":260,"_dir":249,"_draft":6,"_partial":6,"_locale":7,"title":261,"description":262,"keywords":263,"author":264,"date":265,"category":266,"image":255,"_type":240,"_id":267,"_source":242,"_file":268,"_stem":269,"_extension":245},"/blog/accessible-ux-research-guide","无障碍用户研究完全指南：从规划到实施的每一步","深入了解如何进行包容性的用户体验研究，确保残障用户的声音被听见，让产品真正为所有人而设计","用户研究, 无障碍设计, 包容设计, UX研究, 残障用户, 无障碍访问","HTMLPAGE 内容团队","2025-12-01","无障碍与设计","content:blog:accessible-ux-research-guide.md","blog/accessible-ux-research-guide.md","blog/accessible-ux-research-guide",{"_path":271,"_dir":249,"_draft":6,"_partial":6,"_locale":7,"title":272,"description":273,"keywords":274,"author":11,"date":253,"category":254,"image":255,"_type":240,"_id":275,"_source":242,"_file":276,"_stem":277,"_extension":245},"/blog/react-hooks-guide","React Hooks 实战指南","深入理解 React Hooks，包括 useState、useEffect、自定义 Hooks 等","React Hooks 实战指南, Blog, HTMLPAGE","content:blog:react-hooks-guide.md","blog/react-hooks-guide.md","blog/react-hooks-guide",1774945286884]