[web] i18n: guidebooks, quiz qns, app strings
This commit is contained in:
Yangshun
parent
0743112631
commit
5eb2f9387d
|
|
@ -15,7 +15,6 @@
|
|||
"test": "jest",
|
||||
"tsc": "tsc",
|
||||
"transform": "jscodeshift -t ./transforms/transform.ts --parser=tsx",
|
||||
"translate": "langnostic translate",
|
||||
"db:projects-sync": "ts-node --esm --experimentalSpecifierResolution node ./src/scripts/projects-challenges-sync.ts",
|
||||
"gen": "cross-env NODE_ENV=production tsx ./src/scripts/questions-gen-cli.ts",
|
||||
"gen:watch": "npm run gen:all && NODE_ENV=production tsx ./src/scripts/questions-watcher.ts",
|
||||
|
|
@ -24,6 +23,7 @@
|
|||
"gen:all": "npm run gen:clean && npm run gen",
|
||||
"gen:clean": "rimraf src/__generated__",
|
||||
"postinstall": "prisma generate",
|
||||
"i18n": "langnostic translate",
|
||||
"i18n:extract": "formatjs extract \"src/**/*.ts*\" --ignore=\"**/*.d.ts\" --out-file src/locales/en-US.json",
|
||||
"ppp": "ts-node --esm --experimentalSpecifierResolution node ./src/scripts/ppp-update.ts",
|
||||
"screenshot": "ts-node --esm --experimentalSpecifierResolution node ./src/scripts/screenshot.ts",
|
||||
|
|
|
|||
|
|
@ -21,11 +21,11 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "are-you-familiar-with-styling-svg",
|
||||
"subtitle": null,
|
||||
"title": "您是否熟悉SVG样式？",
|
||||
"title": "你熟悉 SVG 的样式设置吗？",
|
||||
"topics": [
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/are-you-familiar-with-styling-svg/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var h=Object.create;var l=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var S=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var f=(n,e)=>()=>(e||n((e={exports:{}}).exports,e),e.exports),g=(n,e)=>{for(var r in e)l(n,r,{get:e[r],enumerable:!0})},s=(n,e,r,i)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let c of m(e))!u.call(n,c)&&c!==r&&l(n,c,{get:()=>e[c],enumerable:!(i=p(e,c))||i.enumerable});return n};var x=(n,e,r)=>(r=n!=null?h(S(n)):{},s(e||!n||!n.__esModule?l(r,\"default\",{value:n,enumerable:!0}):r,n)),b=n=>s(l({},\"__esModule\",{value:!0}),n);var d=f((M,o)=>{o.exports=_jsx_runtime});var y={};g(y,{default:()=>_,frontmatter:()=>C});var t=x(d()),C={title:\"\\u60A8\\u662F\\u5426\\u719F\\u6089SVG\\u6837\\u5F0F\\uFF1F\"};function a(n){let e=Object.assign({p:\"p\",code:\"code\",pre:\"pre\",em:\"em\",a:\"a\"},n.components);return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(e.p,{children:\"\\u6709\\u8FD9\\u4E48\\u51E0\\u79CD\\u65B9\\u6CD5\\u53EF\\u4EE5\\u4E3A\\u5F62\\u72B6\\uFF08Shapes\\uFF09\\u7740\\u8272\\uFF08\\u5305\\u62EC\\u5728\\u5BF9\\u8C61\\u4E0A\\u6307\\u5B9A\\u5C5E\\u6027\\uFF09\\uFF0C\\u4F7F\\u7528\\u5185\\u8054\\u7684 CSS\\u3001\\u5D4C\\u5165\\u7684 CSS \\u90E8\\u5206\\u6216\\u5916\\u90E8 CSS \\u6587\\u4EF6\\u3002 \\u60A8\\u5728\\u7F51\\u9875\\u4E0A\\u627E\\u5230\\u7684\\u5927\\u591A\\u6570 SVG \\u90FD\\u4F7F\\u7528\\u5185\\u8054 CSS\\uFF0C\\u4F46\\u662F\\u6BCF\\u79CD\\u7C7B\\u578B\\u90FD\\u6709\\u4F18\\u52A3\\u4E4B\\u5904\\u3002\"}),`\n`,(0,t.jsxs)(e.p,{children:[\"\\u53EF\\u4EE5\\u901A\\u8FC7\\u5728\\u8282\\u70B9\\u4E0A\\u8BBE\\u7F6E\\u4E24\\u4E2A\\u5C5E\\u6027\\u6765\\u505A\\u57FA\\u672C\\u7740\\u8272\\uFF1A\",(0,t.jsx)(e.code,{children:\"fill\"}),\" \\u548C \",(0,t.jsx)(e.code,{children:\"stroke\"}),\" \\u3002 \",(0,t.jsx)(e.code,{children:\"fill\"}),\"\\u8BBE\\u7F6E\\u5BF9\\u8C61\\u5185\\u7684\\u989C\\u8272\\uFF0C\",(0,t.jsx)(e.code,{children:\"stroke\"}),\"\\u8BBE\\u7F6E\\u5BF9\\u8C61\\u5468\\u56F4\\u7ED8\\u5236\\u7684\\u7EBF\\u7684\\u989C\\u8272\\u3002 \\u4F60\\u53EF\\u4EE5\\u4F7F\\u7528\\u5728 HTML \\u4E2D\\u7684 CSS \\u989C\\u8272\\u547D\\u540D\\u65B9\\u6848\\u5B9A\\u4E49\\u5B83\\u4EEC\\u7684\\u989C\\u8272\\uFF0C\\u6BD4\\u5982\\u8BF4\\u989C\\u8272\\u540D\\uFF08\\u50CF red \\u8FD9\\u79CD\\uFF09\\u3001rgb \\u503C\\uFF08\\u50CF rgb(255,0,0) \\u8FD9\\u79CD\\uFF09\\u3001\\u5341\\u516D\\u8FDB\\u5236\\u503C\\u3001rgba \\u503C\\uFF0C\\u7B49\\u7B49\\u3002\"]}),`\n`,(0,t.jsx)(e.pre,{children:(0,t.jsx)(e.code,{className:\"language-html\",children:`<rect\n x=\"10\"\n y=\"10\"\n width=\"100\"\n height=\"100\"\n stroke=\"blue\"\n fill=\"purple\"\n fill-opacity=\"0.5\"\n stroke-opacity=\"0.8\" />\n`})}),`\n`,(0,t.jsxs)(e.p,{children:[\"\\u4E0A\\u8FF0\",(0,t.jsx)(e.code,{children:'fill=\"purple\"'}),\"\\u662F\\u4E00\\u4E2A \",(0,t.jsx)(e.em,{children:\"\\u5448\\u73B0\\u5C5E\\u6027\"}),\" \\u7684\\u793A\\u4F8B\\u3002 \\u6709\\u8DA3\\u7684\\u662F\\uFF0C\\u4E0E\\u5185\\u90E8\\u6837\\u5F0F\\u4E0D\\u540C\\u7684\\u662F\\uFF0C\\u50CF\",(0,t.jsx)(e.code,{children:'style=\"fill: purple\"'}),\" (\\u5B83\\u6070\\u5DE7\\u4E5F\\u662F\\u4E00\\u4E2A\\u5C5E\\u6027)\\uFF0C\\u5448\\u73B0\\u5C5E\\u6027\\u53EF\\u4EE5\\u88AB\",(0,t.jsx)(e.a,{href:\"https://css-tricks.com/presentation-attributes-vs-inline-styles/\",children:\"\\u6837\\u5F0F\\u8868\\u4E2D\\u5B9A\\u4E49\\u7684 CSS \\u6837\\u5F0F\"}),\"\\u6240\\u8986\\u76D6\\u3002 \\u56E0\\u6B64\\uFF0C\\u5982\\u679C\\u4F60\\u505A\\u4E86\\u7C7B\\u4F3C\\u4E8E\",(0,t.jsx)(e.code,{children:\"svg { fill: blue; }\"}),\"\\u7684\\u4E8B\\u60C5\\uFF0C\\u5B83\\u5C06\\u8986\\u76D6\\u5DF2\\u5B9A\\u4E49\\u7684\\u7D2B\\u8272\\u586B\\u5145\\u3002\"]})]})}function j(n={}){let{wrapper:e}=n.components||{};return e?(0,t.jsx)(e,Object.assign({},n,{children:(0,t.jsx)(a,n)})):a(n)}var _=j;return b(y);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var a=Object.create;var l=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var u=Object.getPrototypeOf,S=Object.prototype.hasOwnProperty;var f=(n,e)=>()=>(e||n((e={exports:{}}).exports,e),e.exports),x=(n,e)=>{for(var r in e)l(n,r,{get:e[r],enumerable:!0})},o=(n,e,r,i)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let c of m(e))!S.call(n,c)&&c!==r&&l(n,c,{get:()=>e[c],enumerable:!(i=p(e,c))||i.enumerable});return n};var g=(n,e,r)=>(r=n!=null?a(u(n)):{},o(e||!n||!n.__esModule?l(r,\"default\",{value:n,enumerable:!0}):r,n)),C=n=>o(l({},\"__esModule\",{value:!0}),n);var d=f((G,s)=>{s.exports=_jsx_runtime});var y={};x(y,{default:()=>b,frontmatter:()=>j});var t=g(d()),j={title:\"\\u4F60\\u719F\\u6089 SVG \\u7684\\u6837\\u5F0F\\u8BBE\\u7F6E\\u5417\\uFF1F\"};function h(n){let e=Object.assign({p:\"p\",code:\"code\",pre:\"pre\",em:\"em\",a:\"a\"},n.components);return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(e.p,{children:\"\\u6709\\u51E0\\u79CD\\u65B9\\u6CD5\\u53EF\\u4EE5\\u4E3A\\u5F62\\u72B6\\u7740\\u8272\\uFF08\\u5305\\u62EC\\u5728\\u5BF9\\u8C61\\u4E0A\\u6307\\u5B9A\\u5C5E\\u6027\\uFF09\\uFF0C\\u53EF\\u4EE5\\u4F7F\\u7528\\u5185\\u8054 CSS\\u3001\\u5D4C\\u5165\\u5F0F CSS \\u90E8\\u5206\\u6216\\u5916\\u90E8 CSS \\u6587\\u4EF6\\u3002 \\u60A8\\u5728\\u7F51\\u7EDC\\u4E0A\\u627E\\u5230\\u7684\\u5927\\u591A\\u6570 SVG \\u90FD\\u4F7F\\u7528\\u5185\\u8054 CSS\\uFF0C\\u4F46\\u6BCF\\u79CD\\u7C7B\\u578B\\u90FD\\u6709\\u5176\\u4F18\\u70B9\\u548C\\u7F3A\\u70B9\\u3002\"}),`\n`,(0,t.jsxs)(e.p,{children:[\"\\u53EF\\u4EE5\\u901A\\u8FC7\\u5728\\u8282\\u70B9\\u4E0A\\u8BBE\\u7F6E\\u4E24\\u4E2A\\u5C5E\\u6027\\u6765\\u5B8C\\u6210\\u57FA\\u672C\\u7740\\u8272\\uFF1A\",(0,t.jsx)(e.code,{children:\"fill\"}),\" \\u548C \",(0,t.jsx)(e.code,{children:\"stroke\"}),\"\\u3002 \",(0,t.jsx)(e.code,{children:\"fill\"}),\" \\u8BBE\\u7F6E\\u5BF9\\u8C61\\u5185\\u90E8\\u7684\\u989C\\u8272\\uFF0C\",(0,t.jsx)(e.code,{children:\"stroke\"}),\" \\u8BBE\\u7F6E\\u7ED8\\u5236\\u5728\\u5BF9\\u8C61\\u5468\\u56F4\\u7684\\u7EBF\\u6761\\u7684\\u989C\\u8272\\u3002 \\u60A8\\u53EF\\u4EE5\\u4F7F\\u7528\\u5728 HTML \\u4E2D\\u4F7F\\u7528\\u7684\\u76F8\\u540C CSS \\u989C\\u8272\\u547D\\u540D\\u65B9\\u6848\\uFF0C\\u65E0\\u8BBA\\u662F\\u989C\\u8272\\u540D\\u79F0\\uFF08\\u5373 \",(0,t.jsx)(e.code,{children:\"red\"}),\"\\uFF09\\u3001RGB \\u503C\\uFF08\\u5373 \",(0,t.jsx)(e.code,{children:\"rgb(255,0,0)\"}),\"\\uFF09\\u3001\\u5341\\u516D\\u8FDB\\u5236\\u503C\\u3001RGBA \\u503C\\u7B49\\u3002\"]}),`\n`,(0,t.jsx)(e.pre,{children:(0,t.jsx)(e.code,{className:\"language-html\",children:`<rect\n x=\"10\"\n y=\"10\"\n width=\"100\"\n height=\"100\"\n stroke=\"blue\"\n fill=\"purple\"\n fill-opacity=\"0.5\"\n stroke-opacity=\"0.8\" />\n`})}),`\n`,(0,t.jsxs)(e.p,{children:[\"\\u4E0A\\u9762\\u7684 \",(0,t.jsx)(e.code,{children:'fill=\"purple\"'}),\" \\u662F\",(0,t.jsx)(e.em,{children:\"\\u8868\\u73B0\\u5C5E\\u6027\"}),\"\\u7684\\u4E00\\u4E2A\\u4F8B\\u5B50\\u3002 \\u6709\\u8DA3\\u7684\\u662F\\uFF0C\\u4E0E \",(0,t.jsx)(e.code,{children:'style=\"fill: purple\"'}),\" \\u8FD9\\u6837\\u7684\\u5185\\u8054\\u6837\\u5F0F\\uFF08\\u5B83\\u4E5F\\u6070\\u597D\\u662F\\u4E00\\u4E2A\\u5C5E\\u6027\\uFF09\\u4E0D\\u540C\\uFF0C\\u8868\\u73B0\\u5C5E\\u6027\\u53EF\\u4EE5\\u88AB\\u6837\\u5F0F\\u8868\\u4E2D\\u5B9A\\u4E49\\u7684 \",(0,t.jsx)(e.a,{href:\"https://css-tricks.com/presentation-attributes-vs-inline-styles/\",children:\"CSS \\u6837\\u5F0F\\u8986\\u76D6\"}),\"\\u3002 \\u56E0\\u6B64\\uFF0C\\u5982\\u679C\\u60A8\\u6267\\u884C\\u7C7B\\u4F3C \",(0,t.jsx)(e.code,{children:\"svg { fill: blue; }\"}),\" \\u7684\\u64CD\\u4F5C\\uFF0C\\u5B83\\u5C06\\u8986\\u76D6\\u5DF2\\u5B9A\\u4E49\\u7684\\u7D2B\\u8272\\u586B\\u5145\\u3002\"]})]})}function _(n={}){let{wrapper:e}=n.components||{};return e?(0,t.jsx)(e,Object.assign({},n,{children:(0,t.jsx)(h,n)})):h(n)}var b=_;return C(y);})();\n;return Component;"
|
||||
}
|
||||
|
|
@ -21,11 +21,11 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "can-you-explain-the-difference-between-coding-a-website-to-be-responsive-versus-using-a-mobile-first-strategy",
|
||||
"subtitle": null,
|
||||
"title": "你能解释一下将网站编码为响应式与使用移动优先策略之间的区别吗？",
|
||||
"title": "你能解释一下编写响应式网站与使用移动优先策略的区别吗？",
|
||||
"topics": [
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/can-you-explain-the-difference-between-coding-a-website-to-be-responsive-versus-using-a-mobile-first-strategy/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var m=Object.create;var i=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var h=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var f=(e,n)=>()=>(n||e((n={exports:{}}).exports,n),n.exports),g=(e,n)=>{for(var t in n)i(e,t,{get:n[t],enumerable:!0})},l=(e,n,t,r)=>{if(n&&typeof n==\"object\"||typeof n==\"function\")for(let c of x(n))!u.call(e,c)&&c!==t&&i(e,c,{get:()=>n[c],enumerable:!(r=p(n,c))||r.enumerable});return e};var j=(e,n,t)=>(t=e!=null?m(h(e)):{},l(n||!e||!e.__esModule?i(t,\"default\",{value:e,enumerable:!0}):t,e)),_=e=>l(i({},\"__esModule\",{value:!0}),e);var o=f((b,a)=>{a.exports=_jsx_runtime});var C={};g(C,{default:()=>z,frontmatter:()=>y});var s=j(o()),y={title:\"\\u4F60\\u80FD\\u89E3\\u91CA\\u4E00\\u4E0B\\u5C06\\u7F51\\u7AD9\\u7F16\\u7801\\u4E3A\\u54CD\\u5E94\\u5F0F\\u4E0E\\u4F7F\\u7528\\u79FB\\u52A8\\u4F18\\u5148\\u7B56\\u7565\\u4E4B\\u95F4\\u7684\\u533A\\u522B\\u5417\\uFF1F\"};function d(e){let n=Object.assign({p:\"p\",pre:\"pre\",code:\"code\",ul:\"ul\",li:\"li\"},e.components);return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(n.p,{children:\"\\u8FD9\\u4E24\\u79CD\\u529E\\u6CD5\\u5E76\\u975E\\u76F8\\u4E92\\u6392\\u65A5\\u3002 \\u7F51\\u7AD9\\u54CD\\u5E94\\u610F\\u5473\\u7740\\u67D0\\u4E9B\\u5143\\u7D20\\u5C06\\u6839\\u636E\\u8BBE\\u5907\\u7684\\u5C4F\\u5E55\\u5927\\u5C0F\\u901A\\u8FC7\\u8C03\\u6574\\u5176\\u5927\\u5C0F\\u6216\\u5176\\u4ED6\\u529F\\u80FD\\u6765\\u5E94\\u5BF9\\u3002 \\u901A\\u5E38\\u662F\\u89C6\\u56FE\\u5BBD\\u5EA6\\uFF0C\\u901A\\u8FC7 CSS \\u5A92\\u4F53\\u67E5\\u8BE2\\uFF0C\\u4F8B\\u5982\\uFF0C\\u5728\\u8F83\\u5C0F\\u7684\\u8BBE\\u5907\\u4E0A\\u4F7F\\u5B57\\u4F53\\u5927\\u5C0F\\u66F4\\u5C0F\\u3002\"}),`\n`,(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:\"language-css\",children:`@media (min-width: 768px) {\n .my-class {\n font-size: 24px;\n }\n}\n\n@media (max-width: 767px) {\n .my-class {\n font-size: 12px;\n }\n}\n`})}),`\n`,(0,s.jsx)(n.p,{children:\"\\u79FB\\u52A8\\u4F18\\u5148\\u7684\\u7B56\\u7565\\u4E5F\\u662F\\u54CD\\u5E94\\u5F0F\\u7684\\uFF0C\\u4F46\\u5B83\\u5141\\u8BB8\\u6211\\u4EEC\\u5E94\\u8BE5\\u9ED8\\u8BA4\\u548C\\u5B9A\\u4E49\\u79FB\\u52A8\\u8BBE\\u5907\\u7684\\u6240\\u6709\\u6837\\u5F0F\\uFF0C\\u53EA\\u5728\\u4EE5\\u540E\\u4E3A\\u5176\\u4ED6\\u8BBE\\u5907\\u6DFB\\u52A0\\u7279\\u5B9A\\u7684\\u54CD\\u5E94\\u5F0F\\u89C4\\u5219\\u3002 \\u6CBF\\u7528\\u4E0A\\u4E00\\u4E2A\\u793A\\u4F8B\\uFF1A\"}),`\n`,(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:\"language-css\",children:`.my-class {\n font-size: 12px;\n}\n\n@media (min-width: 768px) {\n .my-class {\n font-size: 24px;\n }\n}\n`})}),`\n`,(0,s.jsx)(n.p,{children:\"\\u79FB\\u52A8\\u4F18\\u5148\\u7B56\\u7565\\u5177\\u6709\\u4EE5\\u4E0B\\u4E3B\\u8981\\u4F18\\u70B9\\uFF1A\"}),`\n`,(0,s.jsxs)(n.ul,{children:[`\n`,(0,s.jsx)(n.li,{children:\"\\u5B83\\u5728\\u79FB\\u52A8\\u8BBE\\u5907\\u4E0A\\u7684\\u6027\\u80FD\\u66F4\\u5F3A\\uFF0C\\u56E0\\u4E3A\\u9002\\u7528\\u4E8E\\u5B83\\u4EEC\\u7684\\u6240\\u6709\\u89C4\\u5219\\u90FD\\u4E0D\\u5FC5\\u4E0E\\u4EFB\\u4F55\\u5A92\\u4F53\\u67E5\\u8BE2\\u8FDB\\u884C\\u9A8C\\u8BC1\\u3002\"}),`\n`,(0,s.jsx)(n.li,{children:\"\\u79FB\\u52A8\\u4F18\\u5148\\u7684\\u8BBE\\u8BA1\\u66F4\\u6709\\u53EF\\u80FD\\u5728\\u66F4\\u5927\\u7684\\u8BBE\\u5907\\u4E0A\\u4F7F\\u7528\\uFF08\\u53EA\\u662F\\u4F1A\\u663E\\u5F97\\u66F4\\u62C9\\u957F\\uFF0C\\u4F46\\u4ECD\\u7136\\u53EF\\u4EE5\\u4F7F\\u7528\\uFF09\\u3002 \\u5F53\\u7136\\uFF0C\\u53CD\\u8FC7\\u6765\\u5C31\\u4E0D\\u9002\\u7528\\u4E86\\u3002\"}),`\n`]})]})}function w(e={}){let{wrapper:n}=e.components||{};return n?(0,s.jsx)(n,Object.assign({},e,{children:(0,s.jsx)(d,e)})):d(e)}var z=w;return _(C);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var m=Object.create;var i=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var h=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var f=(e,n)=>()=>(n||e((n={exports:{}}).exports,n),n.exports),g=(e,n)=>{for(var t in n)i(e,t,{get:n[t],enumerable:!0})},l=(e,n,t,r)=>{if(n&&typeof n==\"object\"||typeof n==\"function\")for(let c of x(n))!u.call(e,c)&&c!==t&&i(e,c,{get:()=>n[c],enumerable:!(r=p(n,c))||r.enumerable});return e};var j=(e,n,t)=>(t=e!=null?m(h(e)):{},l(n||!e||!e.__esModule?i(t,\"default\",{value:e,enumerable:!0}):t,e)),_=e=>l(i({},\"__esModule\",{value:!0}),e);var o=f((b,a)=>{a.exports=_jsx_runtime});var C={};g(C,{default:()=>z,frontmatter:()=>y});var s=j(o()),y={title:\"\\u4F60\\u80FD\\u89E3\\u91CA\\u4E00\\u4E0B\\u7F16\\u5199\\u54CD\\u5E94\\u5F0F\\u7F51\\u7AD9\\u4E0E\\u4F7F\\u7528\\u79FB\\u52A8\\u4F18\\u5148\\u7B56\\u7565\\u7684\\u533A\\u522B\\u5417\\uFF1F\"};function d(e){let n=Object.assign({p:\"p\",pre:\"pre\",code:\"code\",ul:\"ul\",li:\"li\"},e.components);return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(n.p,{children:\"\\u8FD9\\u4E24\\u79CD\\u65B9\\u6CD5\\u5E76\\u975E\\u76F8\\u4E92\\u6392\\u65A5\\u3002\\u4F7F\\u7F51\\u7AD9\\u5177\\u6709\\u54CD\\u5E94\\u6027\\u610F\\u5473\\u7740\\u67D0\\u4E9B\\u5143\\u7D20\\u5C06\\u901A\\u8FC7\\u8C03\\u6574\\u5176\\u5927\\u5C0F\\u6216\\u5176\\u4ED6\\u529F\\u80FD\\u6765\\u54CD\\u5E94\\uFF0C\\u5177\\u4F53\\u53D6\\u51B3\\u4E8E\\u8BBE\\u5907\\u7684\\u5C4F\\u5E55\\u5C3A\\u5BF8\\uFF0C\\u901A\\u5E38\\u662F\\u89C6\\u53E3\\u5BBD\\u5EA6\\uFF0C\\u4F8B\\u5982\\u901A\\u8FC7 CSS \\u5A92\\u4F53\\u67E5\\u8BE2\\uFF0C\\u4F8B\\u5982\\uFF0C\\u5728\\u8F83\\u5C0F\\u7684\\u8BBE\\u5907\\u4E0A\\u51CF\\u5C0F\\u5B57\\u4F53\\u5927\\u5C0F\\u3002\"}),`\n`,(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:\"language-css\",children:`@media (min-width: 768px) {\n .my-class {\n font-size: 24px;\n }\n}\n\n@media (max-width: 767px) {\n .my-class {\n font-size: 12px;\n }\n}\n`})}),`\n`,(0,s.jsx)(n.p,{children:\"\\u79FB\\u52A8\\u4F18\\u5148\\u7B56\\u7565\\u4E5F\\u5177\\u6709\\u54CD\\u5E94\\u6027\\uFF0C\\u4F46\\u662F\\u5B83\\u540C\\u610F\\u6211\\u4EEC\\u5E94\\u8BE5\\u4E3A\\u79FB\\u52A8\\u8BBE\\u5907\\u8BBE\\u7F6E\\u9ED8\\u8BA4\\u503C\\u5E76\\u5B9A\\u4E49\\u6240\\u6709\\u6837\\u5F0F\\uFF0C\\u5E76\\u4E14\\u7A0D\\u540E\\u4EC5\\u4E3A\\u5176\\u4ED6\\u8BBE\\u5907\\u6DFB\\u52A0\\u7279\\u5B9A\\u7684\\u54CD\\u5E94\\u5F0F\\u89C4\\u5219\\u3002 \\u9075\\u5FAA\\u524D\\u9762\\u7684\\u793A\\u4F8B\\uFF1A\"}),`\n`,(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:\"language-css\",children:`.my-class {\n font-size: 12px;\n}\n\n@media (min-width: 768px) {\n .my-class {\n font-size: 24px;\n }\n}\n`})}),`\n`,(0,s.jsx)(n.p,{children:\"\\u79FB\\u52A8\\u4F18\\u5148\\u7B56\\u7565\\u5177\\u6709\\u4EE5\\u4E0B\\u4E3B\\u8981\\u4F18\\u70B9\\uFF1A\"}),`\n`,(0,s.jsxs)(n.ul,{children:[`\n`,(0,s.jsx)(n.li,{children:\"\\u5B83\\u5728\\u79FB\\u52A8\\u8BBE\\u5907\\u4E0A\\u5177\\u6709\\u66F4\\u9AD8\\u7684\\u6027\\u80FD\\uFF0C\\u56E0\\u4E3A\\u5E94\\u7528\\u4E8E\\u5B83\\u4EEC\\u7684\\u89C4\\u5219\\u4E0D\\u5FC5\\u9488\\u5BF9\\u4EFB\\u4F55\\u5A92\\u4F53\\u67E5\\u8BE2\\u8FDB\\u884C\\u9A8C\\u8BC1\\u3002\"}),`\n`,(0,s.jsx)(n.li,{children:\"\\u79FB\\u52A8\\u4F18\\u5148\\u8BBE\\u8BA1\\u66F4\\u6709\\u53EF\\u80FD\\u5728\\u66F4\\u5927\\u7684\\u8BBE\\u5907\\u4E0A\\u4F7F\\u7528\\uFF08\\u53EA\\u4F1A\\u663E\\u5F97\\u66F4\\u62C9\\u4F38\\uFF0C\\u4F46\\u4ECD\\u7136\\u53EF\\u7528\\uFF09\\u3002 \\u4F46\\u662F\\uFF0C\\u53CD\\u4E4B\\u5219\\u4E0D\\u7136\\u3002\"}),`\n`]})]})}function w(e={}){let{wrapper:n}=e.components||{};return n?(0,s.jsx)(n,Object.assign({},e,{children:(0,s.jsx)(d,e)})):d(e)}var z=w;return _(C);})();\n;return Component;"
|
||||
}
|
||||
|
|
@ -21,11 +21,11 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "can-you-give-an-example-of-an-media-property-other-than-screen",
|
||||
"subtitle": null,
|
||||
"title": "你能举例说明除 \"screen \"以外的媒体查询属性吗？",
|
||||
"title": "你能举一个除了`screen`之外的`@media`属性的例子吗？",
|
||||
"topics": [
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/can-you-give-an-example-of-an-media-property-other-than-screen/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var h=Object.create;var l=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var u=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty;var j=(e,n)=>()=>(n||e((n={exports:{}}).exports,n),n.exports),_=(e,n)=>{for(var r in n)l(e,r,{get:n[r],enumerable:!0})},d=(e,n,r,t)=>{if(n&&typeof n==\"object\"||typeof n==\"function\")for(let i of m(n))!x.call(e,i)&&i!==r&&l(e,i,{get:()=>n[i],enumerable:!(t=p(n,i))||t.enumerable});return e};var g=(e,n,r)=>(r=e!=null?h(u(e)):{},d(n||!e||!e.__esModule?l(r,\"default\",{value:e,enumerable:!0}):r,e)),f=e=>d(l({},\"__esModule\",{value:!0}),e);var s=j((F,o)=>{o.exports=_jsx_runtime});var C={};_(C,{default:()=>y,frontmatter:()=>b});var c=g(s()),b={title:'\\u4F60\\u80FD\\u4E3E\\u4F8B\\u8BF4\\u660E\\u9664 \"screen \"\\u4EE5\\u5916\\u7684\\u5A92\\u4F53\\u67E5\\u8BE2\\u5C5E\\u6027\\u5417\\uFF1F'};function a(e){let n=Object.assign({p:\"p\",code:\"code\",ul:\"ul\",li:\"li\",pre:\"pre\"},e.components);return(0,c.jsxs)(c.Fragment,{children:[(0,c.jsxs)(n.p,{children:[\"\\u6709\\u56DB\\u79CD\\u7C7B\\u578B\\u7684\\u5A92\\u4F53\\u67E5\\u8BE2\\u5C5E\\u6027(\\u5305\\u62EC\",(0,c.jsx)(n.code,{children:\"screen\"}),\")\\uFF1A\"]}),`\n`,(0,c.jsxs)(n.ul,{children:[`\n`,(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.code,{children:\"all\"}),\"\\uFF1A\\u9002\\u7528\\u4E8E\\u6240\\u6709\\u5A92\\u4F53\\u7C7B\\u578B\\u8BBE\\u5907\"]}),`\n`,(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.code,{children:\"print\"}),\": \\u9002\\u7528\\u4E8E\\u6253\\u5370\\u673A\"]}),`\n`,(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.code,{children:\"speech\"}),'\\uFF1A\\u7528\\u4E8E\\u5C4F\\u5E55\\u9605\\u8BFB\\u5668\\uFF0C\\u5927\\u58F0 \"\\u8BFB \"\\u51FA\\u9875\\u9762\\u3002']}),`\n`,(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.code,{children:\"screen\"}),\"\\uFF1A\\u7528\\u4E8E\\u7535\\u8111\\u5C4F\\u5E55\\u3001\\u5E73\\u677F\\u7535\\u8111\\u3001\\u667A\\u80FD\\u624B\\u673A\\u7B49\\u3002\"]}),`\n`]}),`\n`,(0,c.jsxs)(n.p,{children:[\"\\u4E0B\\u9762\\u662F \",(0,c.jsx)(n.code,{children:\"print\"}),\" \\u5A92\\u4F53\\u7C7B\\u578B\\u7684\\u7528\\u6CD5\\u793A\\u4F8B\\uFF1A\"]}),`\n`,(0,c.jsx)(n.pre,{children:(0,c.jsx)(n.code,{className:\"language-css\",children:`@media print {\n body {\n color: black;\n }\n}\n`})})]})}function M(e={}){let{wrapper:n}=e.components||{};return n?(0,c.jsx)(n,Object.assign({},e,{children:(0,c.jsx)(a,e)})):a(e)}var y=M;return f(C);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var h=Object.create;var l=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var u=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty;var j=(n,e)=>()=>(e||n((e={exports:{}}).exports,e),e.exports),_=(n,e)=>{for(var r in e)l(n,r,{get:e[r],enumerable:!0})},t=(n,e,r,d)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let i of m(e))!x.call(n,i)&&i!==r&&l(n,i,{get:()=>e[i],enumerable:!(d=p(e,i))||d.enumerable});return n};var g=(n,e,r)=>(r=n!=null?h(u(n)):{},t(e||!n||!n.__esModule?l(r,\"default\",{value:n,enumerable:!0}):r,n)),f=n=>t(l({},\"__esModule\",{value:!0}),n);var s=j((F,o)=>{o.exports=_jsx_runtime});var C={};_(C,{default:()=>y,frontmatter:()=>b});var c=g(s()),b={title:\"\\u4F60\\u80FD\\u4E3E\\u4E00\\u4E2A\\u9664\\u4E86`screen`\\u4E4B\\u5916\\u7684`@media`\\u5C5E\\u6027\\u7684\\u4F8B\\u5B50\\u5417\\uFF1F\"};function a(n){let e=Object.assign({p:\"p\",code:\"code\",ul:\"ul\",li:\"li\",pre:\"pre\"},n.components);return(0,c.jsxs)(c.Fragment,{children:[(0,c.jsxs)(e.p,{children:[\"\\u6709\\u56DB\\u79CD\\u7C7B\\u578B\\u7684\",(0,c.jsx)(e.code,{children:\"@media\"}),\"\\u5C5E\\u6027\\uFF08\\u5305\\u62EC\",(0,c.jsx)(e.code,{children:\"screen\"}),\"\\uFF09\\uFF1A\"]}),`\n`,(0,c.jsxs)(e.ul,{children:[`\n`,(0,c.jsxs)(e.li,{children:[(0,c.jsx)(e.code,{children:\"all\"}),\"\\uFF1A\\u9002\\u7528\\u4E8E\\u6240\\u6709\\u5A92\\u4F53\\u7C7B\\u578B\\u8BBE\\u5907\"]}),`\n`,(0,c.jsxs)(e.li,{children:[(0,c.jsx)(e.code,{children:\"print\"}),\"\\uFF1A\\u9002\\u7528\\u4E8E\\u6253\\u5370\\u673A\"]}),`\n`,(0,c.jsxs)(e.li,{children:[(0,c.jsx)(e.code,{children:\"speech\"}),\"\\uFF1A\\u9002\\u7528\\u4E8E\\u201C\\u6717\\u8BFB\\u201D\\u9875\\u9762\\u7684\\u5C4F\\u5E55\\u9605\\u8BFB\\u5668\"]}),`\n`,(0,c.jsxs)(e.li,{children:[(0,c.jsx)(e.code,{children:\"screen\"}),\"\\uFF1A\\u9002\\u7528\\u4E8E\\u7535\\u8111\\u5C4F\\u5E55\\u3001\\u5E73\\u677F\\u7535\\u8111\\u3001\\u667A\\u80FD\\u624B\\u673A\\u7B49\\u3002\"]}),`\n`]}),`\n`,(0,c.jsxs)(e.p,{children:[\"\\u4EE5\\u4E0B\\u662F\",(0,c.jsx)(e.code,{children:\"print\"}),\"\\u5A92\\u4F53\\u7C7B\\u578B\\u7528\\u6CD5\\u7684\\u793A\\u4F8B\\uFF1A\"]}),`\n`,(0,c.jsx)(e.pre,{children:(0,c.jsx)(e.code,{className:\"language-css\",children:`@media print {\n body {\n color: black;\n }\n}\n`})})]})}function M(n={}){let{wrapper:e}=n.components||{};return e?(0,c.jsx)(e,Object.assign({},n,{children:(0,c.jsx)(a,n)})):a(n)}var y=M;return f(C);})();\n;return Component;"
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -21,11 +21,11 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "describe-block-formatting-context-bfc-and-how-it-works",
|
||||
"subtitle": null,
|
||||
"title": "描述块级格式化上下文(BFC)及其工作方式。",
|
||||
"title": "描述块格式化上下文 (BFC) 及其工作原理。",
|
||||
"topics": [
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/describe-block-formatting-context-bfc-and-how-it-works/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var s=Object.create;var o=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var m=Object.getPrototypeOf,b=Object.prototype.hasOwnProperty;var f=(c,e)=>()=>(e||c((e={exports:{}}).exports,e),e.exports),g=(c,e)=>{for(var l in e)o(c,l,{get:e[l],enumerable:!0})},r=(c,e,l,d)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let i of p(e))!b.call(c,i)&&i!==l&&o(c,i,{get:()=>e[i],enumerable:!(d=_(e,i))||d.enumerable});return c};var x=(c,e,l)=>(l=c!=null?s(m(c)):{},r(e||!c||!c.__esModule?o(l,\"default\",{value:c,enumerable:!0}):l,c)),C=c=>r(o({},\"__esModule\",{value:!0}),c);var h=f((k,t)=>{t.exports=_jsx_runtime});var F={};g(F,{default:()=>B,frontmatter:()=>u});var n=x(h()),u={title:\"\\u63CF\\u8FF0\\u5757\\u7EA7\\u683C\\u5F0F\\u5316\\u4E0A\\u4E0B\\u6587(BFC)\\u53CA\\u5176\\u5DE5\\u4F5C\\u65B9\\u5F0F\\u3002\"};function a(c){let e=Object.assign({p:\"p\",code:\"code\",a:\"a\",ul:\"ul\",li:\"li\"},c.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(e.p,{children:[\"\\u5757\\u683C\\u5F0F\\u5316\\u4E0A\\u4E0B\\u6587\\uFF08Block Formatting Context\\uFF0CBFC\\uFF09\\u662F Web \\u9875\\u9762\\u7684\\u53EF\\u89C6 CSS \\u6E32\\u67D3\\u7684\\u4E00\\u90E8\\u5206\\uFF0C\\u662F\\u5757\\u7EA7\\u76D2\\u5B50\\u7684\\u5E03\\u5C40\\u8FC7\\u7A0B\\u53D1\\u751F\\u7684\\u533A\\u57DF\\u3002 \\u6D6E\\u52A8\\u3001\\u7EDD\\u5BF9\\u5B9A\\u4F4D\\u7684\\u5143\\u7D20\\u3001\",(0,n.jsx)(e.code,{children:\"inline-blocks\"}),\"\\u3001\",(0,n.jsx)(e.code,{children:\"table-cells\"}),\"\\u3001\",(0,n.jsx)(e.code,{children:\"table-caption\"}),\"\\u548C \",(0,n.jsx)(e.code,{children:\"overflow \"}),\"\\u503C\\u4E0D\\u4E3A \",(0,n.jsx)(e.code,{children:\"visible\"}),\" \\u7684\\u5143\\u7D20\\uFF08\\u9664\\u975E\\u8BE5\\u503C\\u5DF2\\u88AB\\u4F20\\u64AD\\u5230\\u89C6\\u53E3\\uFF09\\u5EFA\\u7ACB\\u65B0\\u7684\\u5757\\u683C\\u5F0F\\u5316\\u4E0A\\u4E0B\\u6587\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u4E86\\u89E3\\u5982\\u4F55\\u5EFA\\u7ACB\\u4E00\\u4E2A\\u5757\\u683C\\u5F0F\\u5316\\u7684\\u4E0A\\u4E0B\\u6587\\u662F\\u5F88\\u91CD\\u8981\\u7684\\uFF0C\\u56E0\\u4E3A\\u5982\\u679C\\u4E0D\\u8FD9\\u6837\\u505A\\uFF0C\\u5BB9\\u5668\\u76D2\\u5B50\\u5C31\\u4E0D\\u4F1A\",(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Block_formatting_context#Make_float_content_and_alongside_content_the_same_height\",children:\"\\u5305\\u542B\\u6D6E\\u52A8\\u7684\\u5B50\\u5143\\u7D20\"}),\"\\u3002 \\u8FD9\\u7C7B\\u4F3C\\u4E8E\\u5916\\u8FB9\\u8DDD\\u91CD\\u53E0\\uFF0C\\u4F46\\u66F4\\u4E25\\u91CD\\uFF0C\\u56E0\\u4E3A\\u4F60\\u4F1A\\u53D1\\u73B0\\u6574\\u4E2A\\u76D2\\u5B50\\u4EE5\\u5947\\u7279\\u7684\\u65B9\\u5F0F\\u91CD\\u53E0\\u3002\"]}),`\n`,(0,n.jsx)(e.p,{children:\"\\u60F3\\u8981\\u521B\\u5EFA\\u4E00\\u4E2A BFC\\uFF0C\\u81F3\\u5C11\\u6EE1\\u8DB3\\u4E0B\\u5217\\u6761\\u4EF6\\u4E4B\\u4E00\\uFF1A\"}),`\n`,(0,n.jsxs)(e.ul,{children:[`\n`,(0,n.jsxs)(e.li,{children:[(0,n.jsx)(e.code,{children:\"float\"}),\" \\u7684\\u503C\\u4E0D\\u662F \",(0,n.jsx)(e.code,{children:\"none\"}),\" \\u3002\"]}),`\n`,(0,n.jsxs)(e.li,{children:[(0,n.jsx)(e.code,{children:\"position\"}),\" \\u7684\\u503C\\u65E2\\u4E0D\\u662F\",(0,n.jsx)(e.code,{children:\"static\"}),\" \\u4E5F\\u4E0D\\u662F\",(0,n.jsx)(e.code,{children:\"relative\"}),\" \\u3002\"]}),`\n`,(0,n.jsxs)(e.li,{children:[(0,n.jsx)(e.code,{children:\"display\"}),\" \\u7684\\u503C\\u662F \",(0,n.jsx)(e.code,{children:\"table-cell\"}),\", \",(0,n.jsx)(e.code,{children:\"table-caption\"}),\", \",(0,n.jsx)(e.code,{children:\"inline-block\"}),\", \",(0,n.jsx)(e.code,{children:\"flex\"}),\", \\u6216 \",(0,n.jsx)(e.code,{children:\"inline-flex\"}),\", \",(0,n.jsx)(e.code,{children:\"grid\"}),\", \\u6216 \",(0,n.jsx)(e.code,{children:\"inline-grid\"}),\"\\u3002\"]}),`\n`,(0,n.jsxs)(e.li,{children:[(0,n.jsx)(e.code,{children:\"overflow\"}),\"\\u7684\\u503C\\u4E0D\\u662F`visible'\\u3002\"]}),`\n`]}),`\n`,(0,n.jsx)(e.p,{children:\"\\u5728 BFC \\u4E2D\\uFF0C\\u6BCF\\u4E2A\\u76D2\\u5B50\\u7684\\u5DE6\\u5916\\u8FB9\\u7F18\\u90FD\\u4F1A\\u63A5\\u89E6\\u5230\\u5305\\u542B\\u5757\\u7684\\u5DE6\\u8FB9\\u7F18\\uFF08\\u5BF9\\u4E8E\\u4ECE\\u53F3\\u5230\\u5DE6\\u7684\\u683C\\u5F0F\\u5316\\uFF0C\\u53F3\\u8FB9\\u7F18\\u4F1A\\u63A5\\u89E6\\uFF09\\u3002\"}),`\n`,(0,n.jsxs)(e.p,{children:[\"BFC \\u4E2D\\u76F8\\u90BB\\u533A\\u5757\\u7EA7\\u76D2\\u5B50\\u4E4B\\u95F4\\u7684\\u5782\\u76F4\\u5916\\u95F4\\u8DDD\\u4F1A\\u88AB\\u6298\\u53E0\\u3002 \\u5728\",(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_mark_mark_bolsing\",children:\"\\u5916\\u8FB9\\u8DDD\\u91CD\\u53E0\"}),\"\\u4E0A\\u9605\\u8BFB\\u66F4\\u591A\\u5185\\u5BB9\\u3002\"]})]})}function S(c={}){let{wrapper:e}=c.components||{};return e?(0,n.jsx)(e,Object.assign({},c,{children:(0,n.jsx)(a,c)})):a(c)}var B=S;return C(F);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var s=Object.create;var d=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var f=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty;var m=(c,e)=>()=>(e||c((e={exports:{}}).exports,e),e.exports),x=(c,e)=>{for(var l in e)d(c,l,{get:e[l],enumerable:!0})},r=(c,e,l,o)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let i of p(e))!g.call(c,i)&&i!==l&&d(c,i,{get:()=>e[i],enumerable:!(o=_(e,i))||o.enumerable});return c};var C=(c,e,l)=>(l=c!=null?s(f(c)):{},r(e||!c||!c.__esModule?d(l,\"default\",{value:c,enumerable:!0}):l,c)),b=c=>r(d({},\"__esModule\",{value:!0}),c);var h=m((F,t)=>{t.exports=_jsx_runtime});var v={};x(v,{default:()=>j,frontmatter:()=>u});var n=C(h()),u={title:\"\\u63CF\\u8FF0\\u5757\\u683C\\u5F0F\\u5316\\u4E0A\\u4E0B\\u6587 (BFC) \\u53CA\\u5176\\u5DE5\\u4F5C\\u539F\\u7406\\u3002\"};function a(c){let e=Object.assign({p:\"p\",code:\"code\",a:\"a\",ul:\"ul\",li:\"li\"},c.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(e.p,{children:[\"\\u5757\\u683C\\u5F0F\\u5316\\u4E0A\\u4E0B\\u6587 (BFC) \\u662F\\u7F51\\u9875\\u89C6\\u89C9 CSS \\u6E32\\u67D3\\u7684\\u4E00\\u90E8\\u5206\\uFF0C\\u5176\\u4E2D\\u4F1A\\u5E03\\u5C40\\u5757\\u7EA7\\u76D2\\u5B50\\u3002\\u6D6E\\u52A8\\u3001\\u7EDD\\u5BF9\\u5B9A\\u4F4D\\u7684\\u5143\\u7D20\\u3001\",(0,n.jsx)(e.code,{children:\"inline-blocks\"}),\"\\u3001\",(0,n.jsx)(e.code,{children:\"table-cells\"}),\"\\u3001\",(0,n.jsx)(e.code,{children:\"table-caption\"}),\" \\u4EE5\\u53CA \",(0,n.jsx)(e.code,{children:\"overflow\"}),\" \\u503C\\u4E0D\\u4E3A \",(0,n.jsx)(e.code,{children:\"visible\"}),\" \\u7684\\u5143\\u7D20\\uFF08\\u9664\\u975E\\u8BE5\\u503C\\u5DF2\\u4F20\\u64AD\\u5230\\u89C6\\u53E3\\uFF09\\u4F1A\\u5EFA\\u7ACB\\u65B0\\u7684\\u5757\\u683C\\u5F0F\\u5316\\u4E0A\\u4E0B\\u6587\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u4E86\\u89E3\\u5982\\u4F55\\u5EFA\\u7ACB\\u5757\\u683C\\u5F0F\\u5316\\u4E0A\\u4E0B\\u6587\\u975E\\u5E38\\u91CD\\u8981\\uFF0C\\u56E0\\u4E3A\\u5982\\u679C\\u4E0D\\u8FD9\\u6837\\u505A\\uFF0C\\u5305\\u542B\\u6846\\u5C06\\u65E0\\u6CD5\",(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS/Block_formatting_context#Make_float_content_and_alongside_content_the_same_height\",children:\"\\u5305\\u542B\\u6D6E\\u52A8\\u5B50\\u5143\\u7D20\"}),\"\\u3002\\u8FD9\\u7C7B\\u4F3C\\u4E8E\\u6298\\u53E0\\u5916\\u8FB9\\u8DDD\\uFF0C\\u4F46\\u66F4\\u9690\\u853D\\uFF0C\\u56E0\\u4E3A\\u60A8\\u4F1A\\u53D1\\u73B0\\u6574\\u4E2A\\u76D2\\u5B50\\u4EE5\\u5947\\u602A\\u7684\\u65B9\\u5F0F\\u6298\\u53E0\\u3002\"]}),`\n`,(0,n.jsx)(e.p,{children:\"BFC \\u662F\\u6EE1\\u8DB3\\u4EE5\\u4E0B\\u81F3\\u5C11\\u4E00\\u4E2A\\u6761\\u4EF6\\u7684 HTML \\u76D2\\u5B50\\uFF1A\"}),`\n`,(0,n.jsxs)(e.ul,{children:[`\n`,(0,n.jsxs)(e.li,{children:[(0,n.jsx)(e.code,{children:\"float\"}),\" \\u7684\\u503C\\u4E0D\\u4E3A \",(0,n.jsx)(e.code,{children:\"none\"}),\"\\u3002\"]}),`\n`,(0,n.jsxs)(e.li,{children:[(0,n.jsx)(e.code,{children:\"position\"}),\" \\u7684\\u503C\\u65E2\\u4E0D\\u662F \",(0,n.jsx)(e.code,{children:\"static\"}),\" \\u4E5F\\u4E0D\\u662F \",(0,n.jsx)(e.code,{children:\"relative\"}),\"\\u3002\"]}),`\n`,(0,n.jsxs)(e.li,{children:[(0,n.jsx)(e.code,{children:\"display\"}),\" \\u7684\\u503C\\u4E3A \",(0,n.jsx)(e.code,{children:\"table-cell\"}),\"\\u3001\",(0,n.jsx)(e.code,{children:\"table-caption\"}),\"\\u3001\",(0,n.jsx)(e.code,{children:\"inline-block\"}),\"\\u3001\",(0,n.jsx)(e.code,{children:\"flex\"}),\" \\u6216 \",(0,n.jsx)(e.code,{children:\"inline-flex\"}),\"\\u3001\",(0,n.jsx)(e.code,{children:\"grid\"}),\" \\u6216 \",(0,n.jsx)(e.code,{children:\"inline-grid\"}),\"\\u3002\"]}),`\n`,(0,n.jsxs)(e.li,{children:[(0,n.jsx)(e.code,{children:\"overflow\"}),\" \\u7684\\u503C\\u4E0D\\u4E3A \",(0,n.jsx)(e.code,{children:\"visible\"}),\"\\u3002\"]}),`\n`]}),`\n`,(0,n.jsx)(e.p,{children:\"\\u5728 BFC \\u4E2D\\uFF0C\\u6BCF\\u4E2A\\u76D2\\u5B50\\u7684\\u5DE6\\u5916\\u8FB9\\u7F18\\u90FD\\u4E0E\\u5305\\u542B\\u5757\\u7684\\u5DE6\\u8FB9\\u7F18\\u63A5\\u89E6\\uFF08\\u5BF9\\u4E8E\\u4ECE\\u53F3\\u5230\\u5DE6\\u7684\\u683C\\u5F0F\\uFF0C\\u53F3\\u8FB9\\u7F18\\u63A5\\u89E6\\uFF09\\u3002\"}),`\n`,(0,n.jsxs)(e.p,{children:[\"BFC \\u4E2D\\u76F8\\u90BB\\u5757\\u7EA7\\u76D2\\u5B50\\u4E4B\\u95F4\\u7684\\u5782\\u76F4\\u5916\\u8FB9\\u8DDD\\u4F1A\\u6298\\u53E0\\u3002\\u9605\\u8BFB\\u66F4\\u591A\\u5173\\u4E8E\",(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing\",children:\"\\u6298\\u53E0\\u5916\\u8FB9\\u8DDD\"}),\"\\u3002\"]})]})}function S(c={}){let{wrapper:e}=c.components||{};return e?(0,n.jsx)(e,Object.assign({},c,{children:(0,n.jsx)(a,c)})):a(c)}var j=S;return b(v);})();\n;return Component;"
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
32
apps/web/src/__generated__/questions/quiz/describe-event-capturing/zh-CN.json
generated
Normal file
32
apps/web/src/__generated__/questions/quiz/describe-event-capturing/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
|
|
@ -21,11 +21,11 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "describe-floats-and-how-they-work",
|
||||
"subtitle": null,
|
||||
"title": "描述“浮动”及其工作方式。",
|
||||
"title": "描述 `float` 及其工作原理。",
|
||||
"topics": [
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/describe-floats-and-how-they-work/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var a=Object.create;var l=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var f=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty;var m=(c,e)=>()=>(e||c((e={exports:{}}).exports,e),e.exports),S=(c,e)=>{for(var i in e)l(c,i,{get:e[i],enumerable:!0})},t=(c,e,i,o)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let r of u(e))!x.call(c,r)&&r!==i&&l(c,r,{get:()=>e[r],enumerable:!(o=p(e,r))||o.enumerable});return c};var b=(c,e,i)=>(i=c!=null?a(f(c)):{},t(e||!c||!c.__esModule?l(i,\"default\",{value:c,enumerable:!0}):i,c)),g=c=>t(l({},\"__esModule\",{value:!0}),c);var h=m((y,d)=>{d.exports=_jsx_runtime});var v={};S(v,{default:()=>_,frontmatter:()=>C});var n=b(h()),C={title:\"\\u63CF\\u8FF0\\u201C\\u6D6E\\u52A8\\u201D\\u53CA\\u5176\\u5DE5\\u4F5C\\u65B9\\u5F0F\\u3002\"};function s(c){let e=Object.assign({p:\"p\",code:\"code\",h2:\"h2\",pre:\"pre\",ul:\"ul\",li:\"li\",a:\"a\"},c.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(e.p,{children:[\"Float \\u662F\\u4E00\\u4E2A CSS \\u5B9A\\u4F4D\\u5C5E\\u6027\\u3002 \\u6D6E\\u52A8\\u5143\\u7D20\\u4ECD\\u7136\\u662F\\u6587\\u6863\\u6D41\\u7684\\u4E00\\u90E8\\u5206\\uFF0C\\u5C06\\u5F71\\u54CD\\u5230\\u5176\\u4ED6\\u5143\\u7D20\\u7684\\u5B9A\\u4F4D\\uFF08\\u5982\\uFF1A \\u6587\\u672C\\u5C06\\u73AF\\u7ED5\\u5728\\u6D6E\\u52A8\\u5143\\u7D20\\u5468\\u56F4\\uFF09\\u3002\\u4E0D\\u540C\\u4E8E\",(0,n.jsx)(e.code,{children:\"position: absolute\"}),\" \\u5143\\u7D20\\uFF0C\\u5B83\\u4EEC\\u5C06\\u4ECE\\u6587\\u6863\\u6D41\\u4E2D\\u5220\\u9664\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"CSS \",(0,n.jsx)(e.code,{children:\"clear\"}),\" \\u5C5E\\u6027\\u53EF\\u4EE5\\u653E\\u7F6E\\u5728 \",(0,n.jsx)(e.code,{children:\"left\"}),\"/\",(0,n.jsx)(e.code,{children:\"right\"}),\"/\",(0,n.jsx)(e.code,{children:\"both\"}),\" \\u6D6E\\u52A8\\u5143\\u7D20\\u4E4B\\u4E0B\\u3002\"]}),`\n`,(0,n.jsx)(e.p,{children:\"\\u5982\\u679C\\u7236\\u5143\\u7D20\\u53EA\\u5305\\u542B\\u6D6E\\u52A8\\u5143\\u7D20\\uFF0C\\u5B83\\u7684\\u9AD8\\u5EA6\\u5C06\\u88AB\\u6298\\u53E0\\u4E3A\\u96F6\\u3002 \\u53EF\\u4EE5\\u901A\\u8FC7\\u5728\\u5BB9\\u5668\\u4E2D\\u7684\\u6D6E\\u52A8\\u5143\\u7D20\\u4E4B\\u540E\\u4F46\\u5728\\u5173\\u95ED\\u5BB9\\u5668\\u4E4B\\u524D\\u6E05\\u9664\\u6D6E\\u52A8\\u6765\\u89E3\\u51B3\\u3002\"}),`\n`,(0,n.jsx)(e.h2,{children:\"\\u6E05\\u6D6E\\u52A8\\u6280\\u5DE7\"}),`\n`,(0,n.jsxs)(e.p,{children:[(0,n.jsx)(e.code,{children:\".clearfix\"}),\" \\u7528\\u4E00\\u4E2A\\u806A\\u660E\\u7684 CSS [\\u4F2A\\u5143\\u7D20](/questions/quiz/sign-pseudo-elements-and-discussions-what they-are-used-for) (\",(0,n.jsx)(e.code,{children:\"::after \"}),\") \\u6765\\u6E05\\u9664\\u6D6E\\u52A8\\u3002 \\u4E0D\\u8981\\u5728\\u7236\\u7EA7\\u8BBE\\u7F6E\\u6EA2\\u51FA\\uFF0C\\u800C\\u662F\\u5BF9\\u5B83\\u5E94\\u7528\\u4E00\\u4E2A\\u989D\\u5916\\u7684\\u7C7B \",(0,n.jsx)(e.code,{children:\"clearfix\"}),\" \\u3002 \\u7136\\u540E\\u5E94\\u7528\\u6B64 CSS \\uFF1A\"]}),`\n`,(0,n.jsx)(e.pre,{children:(0,n.jsx)(e.code,{className:\"language-css\",children:`.clearfix::after {\n content: ' ';\n visibility: hidden;\n display: block;\n height: 0;\n clear: both;\n}\n`})}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u6216\\u8005\\uFF0C\\uFF0C \\u7ED9\",(0,n.jsx)(e.code,{children:\"overflow: auto\"}),\" \\u6216 \",(0,n.jsx)(e.code,{children:\"overflow: hidden\"}),\" \\u5C5E\\u6027\\u5230\\u7236\\u5143\\u7D20, \\u5B83\\u5C06\\u5728\\u5B50\\u5143\\u7D20\\u4E2D\\u5EFA\\u7ACB\\u4E00\\u4E2A\\u65B0\\u7684\\u5757\\u683C\\u5F0F\\u5316\\u73AF\\u5883, \\u5B83\\u5C06\\u6269\\u5C55\\u5230\\u5305\\u542B\\u5B83\\u7684\\u5B50\\u5143\\u7D20.\"]}),`\n`,(0,n.jsx)(e.h2,{children:\"\\u7410\\u4E8B\"}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u5728\\u8FC7\\u53BB\\u7684\\u597D\\u65E5\\u5B50\\u91CC\\uFF0CBootstrap 2 \\u7B49 CSS \\u6846\\u67B6\\u4F7F\\u7528\",(0,n.jsx)(e.code,{children:\"float\"}),\"\\u5C5E\\u6027\\u6765\\u5B9E\\u73B0\\u5176\\u7F51\\u683C\\u7CFB\\u7EDF\\u3002 \\u7136\\u800C\\uFF0C\\u968F\\u7740\\u8FD9\\u4E9B\\u65E5\\u5B50\\u7684 CSS Flexbox \\u548C Grid\\uFF0C\\u5DF2\\u4E0D\\u518D\\u9700\\u8981\\u4F7F\\u7528 \",(0,n.jsx)(e.code,{children:\"float\"}),\" \\u5C5E\\u6027\\u3002\"]}),`\n`,(0,n.jsx)(e.h2,{children:\"\\u53C2\\u8003\\u8D44\\u6599\"}),`\n`,(0,n.jsxs)(e.ul,{children:[`\n`,(0,n.jsx)(e.li,{children:(0,n.jsx)(e.a,{href:\"https://css-tricks.com/clearfix-a-lesson-in-web-development-evolution/\",children:\"\\u6E05\\u6D6E\\u52A8: \\u7F51\\u9875\\u5F00\\u53D1\\u7684\\u6F14\\u53D8\\u8BFE\\u7A0B\"})}),`\n`]})]})}function j(c={}){let{wrapper:e}=c.components||{};return e?(0,n.jsx)(e,Object.assign({},c,{children:(0,n.jsx)(s,c)})):s(c)}var _=j;return g(v);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var s=Object.create;var i=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var u=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty;var m=(c,e)=>()=>(e||c((e={exports:{}}).exports,e),e.exports),S=(c,e)=>{for(var r in e)i(c,r,{get:e[r],enumerable:!0})},t=(c,e,r,o)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let l of p(e))!x.call(c,l)&&l!==r&&i(c,l,{get:()=>e[l],enumerable:!(o=f(e,l))||o.enumerable});return c};var b=(c,e,r)=>(r=c!=null?s(u(c)):{},t(e||!c||!c.__esModule?i(r,\"default\",{value:c,enumerable:!0}):r,c)),C=c=>t(i({},\"__esModule\",{value:!0}),c);var h=m((k,d)=>{d.exports=_jsx_runtime});var _={};S(_,{default:()=>j,frontmatter:()=>g});var n=b(h()),g={title:\"\\u63CF\\u8FF0 `float` \\u53CA\\u5176\\u5DE5\\u4F5C\\u539F\\u7406\\u3002\"};function a(c){let e=Object.assign({p:\"p\",code:\"code\",h2:\"h2\",a:\"a\",pre:\"pre\",ul:\"ul\",li:\"li\"},c.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(e.p,{children:[\"Float \\u662F\\u4E00\\u4E2A CSS \\u5B9A\\u4F4D\\u5C5E\\u6027\\u3002\\u6D6E\\u52A8\\u5143\\u7D20\\u4ECD\\u7136\\u662F\\u9875\\u9762\\u6D41\\u7A0B\\u7684\\u4E00\\u90E8\\u5206\\uFF0C\\u5E76\\u5C06\\u5F71\\u54CD\\u5176\\u4ED6\\u5143\\u7D20\\u7684\\u4F4D\\u7F6E\\uFF08\\u4F8B\\u5982\\uFF0C\\u6587\\u672C\\u5C06\\u73AF\\u7ED5\\u6D6E\\u52A8\\u5143\\u7D20\\uFF09\\uFF0C\\u8FD9\\u4E0E \",(0,n.jsx)(e.code,{children:\"position: absolute\"}),\" \\u5143\\u7D20\\u4E0D\\u540C\\uFF0C\\u540E\\u8005\\u5C06\\u4ECE\\u9875\\u9762\\u6D41\\u7A0B\\u4E2D\\u79FB\\u9664\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"CSS \",(0,n.jsx)(e.code,{children:\"clear\"}),\" \\u5C5E\\u6027\\u53EF\\u7528\\u4E8E\\u5B9A\\u4F4D\\u5728 \",(0,n.jsx)(e.code,{children:\"left\"}),\"/\",(0,n.jsx)(e.code,{children:\"right\"}),\"/\",(0,n.jsx)(e.code,{children:\"both\"}),\" \\u6D6E\\u52A8\\u5143\\u7D20\\u4E0B\\u65B9\\u3002\"]}),`\n`,(0,n.jsx)(e.p,{children:\"\\u5982\\u679C\\u7236\\u5143\\u7D20\\u53EA\\u5305\\u542B\\u6D6E\\u52A8\\u5143\\u7D20\\uFF0C\\u5219\\u5176\\u9AD8\\u5EA6\\u5C06\\u6298\\u53E0\\u4E3A\\u96F6\\u3002\\u53EF\\u4EE5\\u901A\\u8FC7\\u5728\\u5BB9\\u5668\\u4E2D\\u6D6E\\u52A8\\u5143\\u7D20\\u4E4B\\u540E\\u4F46\\u5728\\u5BB9\\u5668\\u5173\\u95ED\\u4E4B\\u524D\\u6E05\\u9664\\u6D6E\\u52A8\\u6765\\u4FEE\\u590D\\u5B83\\u3002\"}),`\n`,(0,n.jsx)(e.h2,{children:\"Clearfix hack\"}),`\n`,(0,n.jsxs)(e.p,{children:[(0,n.jsx)(e.code,{children:\".clearfix\"}),\" hack \\u4F7F\\u7528\\u5DE7\\u5999\\u7684 CSS \",(0,n.jsx)(e.a,{href:\"/questions/quiz/describe-pseudo-elements-and-discuss-what-they-are-used-for\",children:\"\\u4F2A\\u5143\\u7D20\"}),\" (\",(0,n.jsx)(e.code,{children:\"::after\"}),\") \\u6765\\u6E05\\u9664\\u6D6E\\u52A8\\u3002\\u4E0E\\u5176\\u5728\\u7236\\u5143\\u7D20\\u4E0A\\u8BBE\\u7F6E overflow\\uFF0C\\u4E0D\\u5982\\u4E3A\\u5176\\u5E94\\u7528\\u4E00\\u4E2A\\u989D\\u5916\\u7684\\u7C7B \",(0,n.jsx)(e.code,{children:\"clearfix\"}),\"\\u3002\\u7136\\u540E\\u5E94\\u7528\\u6B64 CSS\\uFF1A\"]}),`\n`,(0,n.jsx)(e.pre,{children:(0,n.jsx)(e.code,{className:\"language-css\",children:`.clearfix::after {\n content: ' ';\n visibility: hidden;\n display: block;\n height: 0;\n clear: both;\n}\n`})}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u6216\\u8005\\uFF0C\\u7ED9\\u7236\\u5143\\u7D20 \",(0,n.jsx)(e.code,{children:\"overflow: auto\"}),\" \\u6216 \",(0,n.jsx)(e.code,{children:\"overflow: hidden\"}),\" \\u5C5E\\u6027\\uFF0C\\u5B83\\u5C06\\u5728\\u5B50\\u5143\\u7D20\\u5185\\u5EFA\\u7ACB\\u4E00\\u4E2A\\u65B0\\u7684\\u5757\\u683C\\u5F0F\\u5316\\u4E0A\\u4E0B\\u6587\\uFF0C\\u5B83\\u5C06\\u6269\\u5C55\\u4EE5\\u5305\\u542B\\u5176\\u5B50\\u5143\\u7D20\\u3002\"]}),`\n`,(0,n.jsx)(e.h2,{children:\"\\u7410\\u4E8B\"}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u5728\\u8FC7\\u53BB\\u7684\\u65E5\\u5B50\\u91CC\\uFF0CCSS \\u6846\\u67B6\\uFF08\\u5982 Bootstrap 2\\uFF09\\u4F7F\\u7528 \",(0,n.jsx)(e.code,{children:\"float\"}),\" \\u5C5E\\u6027\\u6765\\u5B9E\\u73B0\\u5176\\u7F51\\u683C\\u7CFB\\u7EDF\\u3002\\u7136\\u800C\\uFF0C\\u5982\\u4ECA\\u6709\\u4E86 CSS Flexbox \\u548C Grid\\uFF0C\\u4E0D\\u518D\\u9700\\u8981\\u4F7F\\u7528 \",(0,n.jsx)(e.code,{children:\"float\"}),\" \\u5C5E\\u6027\\u3002\"]}),`\n`,(0,n.jsx)(e.h2,{children:\"\\u53C2\\u8003\"}),`\n`,(0,n.jsxs)(e.ul,{children:[`\n`,(0,n.jsx)(e.li,{children:(0,n.jsx)(e.a,{href:\"https://css-tricks.com/clearfix-a-lesson-in-web-development-evolution/\",children:\"Clearfix: A Lesson In Web Development Evolution\"})}),`\n`]})]})}function v(c={}){let{wrapper:e}=c.components||{};return e?(0,n.jsx)(e,Object.assign({},c,{children:(0,n.jsx)(a,c)})):a(c)}var j=v;return C(_);})();\n;return Component;"
|
||||
}
|
||||
|
|
@ -21,11 +21,11 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "describe-pseudo-elements-and-discuss-what-they-are-used-for",
|
||||
"subtitle": null,
|
||||
"title": "描述伪元素并讨论其用途。",
|
||||
"title": "描述伪元素并讨论它们的使用。",
|
||||
"topics": [
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/describe-pseudo-elements-and-discuss-what-they-are-used-for/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var a=Object.create;var d=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var m=Object.getPrototypeOf,p=Object.prototype.hasOwnProperty;var x=(r,e)=>()=>(e||r((e={exports:{}}).exports,e),e.exports),S=(r,e)=>{for(var c in e)d(r,c,{get:e[c],enumerable:!0})},o=(r,e,c,i)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let l of u(e))!p.call(r,l)&&l!==c&&d(r,l,{get:()=>e[l],enumerable:!(i=f(e,l))||i.enumerable});return r};var b=(r,e,c)=>(c=r!=null?a(m(r)):{},o(e||!r||!r.__esModule?d(c,\"default\",{value:r,enumerable:!0}):c,r)),C=r=>o(d({},\"__esModule\",{value:!0}),r);var h=x((D,t)=>{t.exports=_jsx_runtime});var M={};S(M,{default:()=>_,frontmatter:()=>g});var n=b(h()),g={title:\"\\u63CF\\u8FF0\\u4F2A\\u5143\\u7D20\\u5E76\\u8BA8\\u8BBA\\u5176\\u7528\\u9014\\u3002\"};function s(r){let e=Object.assign({p:\"p\",a:\"a\",code:\"code\",ul:\"ul\",li:\"li\",h2:\"h2\"},r.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(e.p,{children:[\"CSS \",(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/CS/Pseudo-elements\",children:\"\\u4F2A\\u5143\\u7D20\"}),\" \\u662F\\u4E00\\u4E2A\\u6DFB\\u52A0\\u5230\\u9009\\u62E9\\u5668\\u4E2D\\u7684\\u5173\\u952E\\u8BCD\\uFF0C\\u4F7F\\u60A8\\u80FD\\u591F\\u4FEE\\u6539\\u6240\\u9009\\u5143\\u7D20\\u7684\\u7279\\u5B9A\\u90E8\\u5206\\u7684\\u6837\\u5F0F\\u3002 \\u5B83\\u4EEC\\u53EF\\u4EE5\\u7528\\u4E8E\\u88C5\\u9970 (\",(0,n.jsx)(e.code,{children:\"::first-line\"}),\", \",(0,n.jsx)(e.code,{children:\"::first-letter\"}),\") \\u6216\\u6DFB\\u52A0\\u6807\\u7B7E\\u5143\\u7D20(\\u7ED3\\u5408\",(0,n.jsx)(e.code,{children:\"content: ...\"}),\") \\u65E0\\u9700\\u4FEE\\u6539\\u6807\\u7B7E(\",(0,n.jsx)(e.code,{children:\":before\"}),\", \",(0,n.jsx)(e.code,{children:\":after \"}),\")\"]}),`\n`,(0,n.jsxs)(e.ul,{children:[`\n`,(0,n.jsxs)(e.li,{children:[(0,n.jsx)(e.code,{children:\"::firstline\"}),\" \\u548C \",(0,n.jsx)(e.code,{children:\"::firstletter\"}),\" \\u53EF\\u4EE5\\u7528\\u4E8E\\u88C5\\u9970\\u6587\\u672C\\u3002\"]}),`\n`,(0,n.jsxs)(e.li,{children:[\"\\u7528\\u4E8E \",(0,n.jsx)(e.code,{children:\".clearfix\"}),\" \\u6280\\u5DE7\\uFF0C\\u5982\\u4E0A\\u56FE\\u6240\\u793A\\uFF0C\\u6DFB\\u52A0\\u4E00\\u4E2A\\u5E26\\u6709\",(0,n.jsx)(e.code,{children:\"clear: both\"}),\"\\u7684\\u96F6\\u7A7A\\u95F4\\u5143\\u7D20\\u3002\"]}),`\n`,(0,n.jsxs)(e.li,{children:[\"Tooltips \\u4E2D\\u7684\\u4E09\\u89D2\\u7BAD\\u5934\\u4F7F\\u7528 \",(0,n.jsx)(e.code,{children:\"::before\"}),\" \\u548C \",(0,n.jsx)(e.code,{children:\"::after \"}),\" \\u3002 \\u9F13\\u52B1\\u5173\\u6CE8\\u70B9\\u5206\\u79BB\\uFF0C\\u56E0\\u4E3A\\u4E09\\u89D2\\u5F62\\u88AB\\u89C6\\u4E3A\\u6837\\u5F0F\\u7684\\u4E00\\u90E8\\u5206\\uFF0C\\u800C\\u4E0D\\u662F\\u771F\\u6B63\\u7684 DOM\\u3002\"]}),`\n`]}),`\n`,(0,n.jsx)(e.h2,{children:\"\\u5907\\u6CE8\"}),`\n`,(0,n.jsxs)(e.ul,{children:[`\n`,(0,n.jsxs)(e.li,{children:[\"\\u4F2A\\u5143\\u7D20\\u4E0D\\u540C\\u4E8E \",(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/CS/Pseudo-classes\",children:\"\\u4F2A\\u7C7B\"}),\"\\uFF0C\\u540E\\u8005\\u7528\\u4E8E\\u6839\\u636E\\u72B6\\u6001(\\u4F8B\\u5982\",(0,n.jsx)(e.code,{children:\":hover\"}),\", \",(0,n.jsx)(e.code,{children:\":focus\"}),\", \\u7B49\\u7B49) \\u4FEE\\u6539\\u6837\\u5F0F\\u3002\"]}),`\n`,(0,n.jsx)(e.li,{children:\"\\u5E94\\u4F7F\\u7528\\u53CC\\u5192\\u53F7\\u800C\\u4E0D\\u662F\\u5355\\u5192\\u53F7\\u6765\\u533A\\u5206\\u4F2A\\u7C7B\\u548C\\u4F2A\\u5143\\u7D20\\u3002 \\u5927\\u591A\\u6570\\u6D4F\\u89C8\\u5668\\u90FD\\u652F\\u6301\\u8FD9\\u4E24\\u79CD\\u8BED\\u6CD5\\uFF0C\\u56E0\\u4E3A\\u65E7\\u7684 W3C \\u89C6\\u56FE\\u4E2D\\u6CA1\\u6709\\u533A\\u5206\\u8FD9\\u70B9\\u3002\"}),`\n`]}),`\n`,(0,n.jsx)(e.h2,{children:\"\\u53C2\\u8003\\u8D44\\u6599\"}),`\n`,(0,n.jsxs)(e.ul,{children:[`\n`,(0,n.jsx)(e.li,{children:(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/CS/Pseudo-elements\",children:\"\\u4F2A\\u5143\\u7D20-CSS | MDN\"})}),`\n`]})]})}function j(r={}){let{wrapper:e}=r.components||{};return e?(0,n.jsx)(e,Object.assign({},r,{children:(0,n.jsx)(s,r)})):s(r)}var _=j;return C(M);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var a=Object.create;var d=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var u=Object.getPrototypeOf,S=Object.prototype.hasOwnProperty;var p=(r,e)=>()=>(e||r((e={exports:{}}).exports,e),e.exports),x=(r,e)=>{for(var c in e)d(r,c,{get:e[c],enumerable:!0})},o=(r,e,c,i)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let l of m(e))!S.call(r,l)&&l!==c&&d(r,l,{get:()=>e[l],enumerable:!(i=f(e,l))||i.enumerable});return r};var b=(r,e,c)=>(c=r!=null?a(u(r)):{},o(e||!r||!r.__esModule?d(c,\"default\",{value:r,enumerable:!0}):c,r)),C=r=>o(d({},\"__esModule\",{value:!0}),r);var h=p((D,t)=>{t.exports=_jsx_runtime});var M={};x(M,{default:()=>_,frontmatter:()=>g});var n=b(h()),g={title:\"\\u63CF\\u8FF0\\u4F2A\\u5143\\u7D20\\u5E76\\u8BA8\\u8BBA\\u5B83\\u4EEC\\u7684\\u4F7F\\u7528\\u3002\"};function s(r){let e=Object.assign({p:\"p\",a:\"a\",code:\"code\",ul:\"ul\",li:\"li\",h2:\"h2\",em:\"em\"},r.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(e.p,{children:[\"CSS \",(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements\",children:\"\\u4F2A\\u5143\\u7D20\"}),\" \\u662F\\u6DFB\\u52A0\\u5230\\u9009\\u62E9\\u5668\\u7684\\u5173\\u952E\\u5B57\\uFF0C\\u53EF\\u8BA9\\u60A8\\u8BBE\\u7F6E\\u6240\\u9009\\u5143\\u7D20\\u7279\\u5B9A\\u90E8\\u5206\\u7684\\u6837\\u5F0F\\u3002\\u5B83\\u4EEC\\u53EF\\u7528\\u4E8E\\u88C5\\u9970 (\",(0,n.jsx)(e.code,{children:\"::first-line\"}),\", \",(0,n.jsx)(e.code,{children:\"::first-letter\"}),\") \\u6216\\u5C06\\u5143\\u7D20\\u6DFB\\u52A0\\u5230\\u6807\\u8BB0\\u4E2D\\uFF08\\u4E0E \",(0,n.jsx)(e.code,{children:\"content: ...\"}),\" \\u7ED3\\u5408\\u4F7F\\u7528\\uFF09\\uFF0C\\u800C\\u65E0\\u9700\\u4FEE\\u6539\\u6807\\u8BB0 (\",(0,n.jsx)(e.code,{children:\":before\"}),\", \",(0,n.jsx)(e.code,{children:\":after\"}),\")\\u3002\"]}),`\n`,(0,n.jsxs)(e.ul,{children:[`\n`,(0,n.jsxs)(e.li,{children:[(0,n.jsx)(e.code,{children:\"::first-line\"}),\" \\u548C \",(0,n.jsx)(e.code,{children:\"::first-letter\"}),\" \\u53EF\\u7528\\u4E8E\\u88C5\\u9970\\u6587\\u672C\\u3002\"]}),`\n`,(0,n.jsxs)(e.li,{children:[\"\\u5728\\u4E0A\\u9762\\u663E\\u793A\\u7684 \",(0,n.jsx)(e.code,{children:\".clearfix\"}),\" hack \\u4E2D\\u4F7F\\u7528\\uFF0C\\u4EE5\\u6DFB\\u52A0\\u4E00\\u4E2A\\u5E26\\u6709 \",(0,n.jsx)(e.code,{children:\"clear: both\"}),\" \\u7684\\u96F6\\u7A7A\\u95F4\\u5143\\u7D20\\u3002\"]}),`\n`,(0,n.jsxs)(e.li,{children:[\"\\u5DE5\\u5177\\u63D0\\u793A\\u4E2D\\u7684\\u4E09\\u89D2\\u5F62\\u7BAD\\u5934\\u4F7F\\u7528 \",(0,n.jsx)(e.code,{children:\"::before\"}),\" \\u548C \",(0,n.jsx)(e.code,{children:\"::after\"}),\"\\u3002 \\u9F13\\u52B1\\u5173\\u6CE8\\u70B9\\u5206\\u79BB\\uFF0C\\u56E0\\u4E3A\\u4E09\\u89D2\\u5F62\\u88AB\\u8BA4\\u4E3A\\u662F\\u6837\\u5F0F\\u7684\\u4E00\\u90E8\\u5206\\uFF0C\\u800C\\u4E0D\\u662F\\u771F\\u6B63\\u7684 DOM\\u3002\"]}),`\n`]}),`\n`,(0,n.jsx)(e.h2,{children:\"\\u7B14\\u8BB0\"}),`\n`,(0,n.jsxs)(e.ul,{children:[`\n`,(0,n.jsxs)(e.li,{children:[\"\\u4F2A\\u5143\\u7D20\\u4E0E \",(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes\",children:\"\\u4F2A\\u7C7B\"}),\" \\u4E0D\\u540C\\uFF0C\\u4F2A\\u7C7B\\u7528\\u4E8E\\u6839\\u636E\\u5143\\u7D20\\u7684\",(0,n.jsx)(e.em,{children:\"\\u72B6\\u6001\"}),\"\\uFF08\\u4F8B\\u5982 \",(0,n.jsx)(e.code,{children:\":hover\"}),\"\\u3001\",(0,n.jsx)(e.code,{children:\":focus\"}),\" \\u7B49\\uFF09\\u8BBE\\u7F6E\\u5143\\u7D20\\u7684\\u6837\\u5F0F\\u3002\"]}),`\n`,(0,n.jsx)(e.li,{children:\"\\u5E94\\u4F7F\\u7528\\u53CC\\u5192\\u53F7\\u800C\\u4E0D\\u662F\\u5355\\u5192\\u53F7\\u6765\\u533A\\u5206\\u4F2A\\u7C7B\\u548C\\u4F2A\\u5143\\u7D20\\u3002 \\u5927\\u591A\\u6570\\u6D4F\\u89C8\\u5668\\u90FD\\u652F\\u6301\\u8FD9\\u4E24\\u79CD\\u8BED\\u6CD5\\uFF0C\\u56E0\\u4E3A\\u8FD9\\u79CD\\u533A\\u522B\\u5728\\u65E7\\u7248 W3C \\u89C4\\u8303\\u4E2D\\u5E76\\u4E0D\\u660E\\u786E\\u3002\"}),`\n`]}),`\n`,(0,n.jsx)(e.h2,{children:\"\\u53C2\\u8003\"}),`\n`,(0,n.jsxs)(e.ul,{children:[`\n`,(0,n.jsx)(e.li,{children:(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements\",children:\"\\u4F2A\\u5143\\u7D20 - CSS | MDN\"})}),`\n`]})]})}function j(r={}){let{wrapper:e}=r.components||{};return e?(0,n.jsx)(e,Object.assign({},r,{children:(0,n.jsx)(s,r)})):s(r)}var _=j;return C(M);})();\n;return Component;"
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -21,11 +21,11 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "describe-what-you-like-and-dislike-about-the-css-preprocessors-you-have-used",
|
||||
"subtitle": null,
|
||||
"title": "描述您喜欢和不喜欢使用的 CSS 预处理器。",
|
||||
"title": "描述你喜欢和不喜欢你使用过的 CSS 预处理器的地方。",
|
||||
"topics": [
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/describe-what-you-like-and-dislike-about-the-css-preprocessors-you-have-used/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var h=Object.create;var t=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var f=Object.getPrototypeOf,j=Object.prototype.hasOwnProperty;var p=(n,e)=>()=>(e||n((e={exports:{}}).exports,e),e.exports),x=(n,e)=>{for(var r in e)t(n,r,{get:e[r],enumerable:!0})},o=(n,e,r,i)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let c of m(e))!j.call(n,c)&&c!==r&&t(n,c,{get:()=>e[c],enumerable:!(i=u(e,c))||i.enumerable});return n};var S=(n,e,r)=>(r=n!=null?h(f(n)):{},o(e||!n||!n.__esModule?t(r,\"default\",{value:n,enumerable:!0}):r,n)),g=n=>o(t({},\"__esModule\",{value:!0}),n);var a=p((M,d)=>{d.exports=_jsx_runtime});var b={};x(b,{default:()=>L,frontmatter:()=>_});var s=S(a()),_={title:\"\\u63CF\\u8FF0\\u60A8\\u559C\\u6B22\\u548C\\u4E0D\\u559C\\u6B22\\u4F7F\\u7528\\u7684 CSS \\u9884\\u5904\\u7406\\u5668\\u3002\"};function l(n){let e=Object.assign({h2:\"h2\",ul:\"ul\",li:\"li\",a:\"a\",code:\"code\"},n.components);return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(e.h2,{children:\"\\u559C\\u6B22\"}),`\n`,(0,s.jsxs)(e.ul,{children:[`\n`,(0,s.jsxs)(e.li,{children:[\"\\u4E3B\\u8981\\u662F\",(0,s.jsx)(e.a,{href:\"/questions/quiz/what-are-the-advantages-disadvantages-of-using-css-preprocessors\",children:\"\\u201C\\u4F7F\\u7528 CSS preprocessors \\u7684\\u4F18\\u70B9/\\u7F3A\\u70B9?\\u201D\"}),\" \\u4E2D\\u63D0\\u5230\\u7684\\u4F18\\u52BF\\u3002\"]}),`\n`,(0,s.jsx)(e.li,{children:\"Less \\u662F\\u7528 JavaScript \\u5199\\u7684\\uFF0C\\u5B83\\u5728 Nodejs \\u4E2D\\u5F88\\u597D\\u7528\\u3002\"}),`\n`]}),`\n`,(0,s.jsx)(e.h2,{children:\"\\u4E0D\\u559C\\u6B22\"}),`\n`,(0,s.jsxs)(e.ul,{children:[`\n`,(0,s.jsxs)(e.li,{children:[\"Sass \\u4F9D\\u8D56 \",(0,s.jsx)(e.code,{children:\"node-sass\"}),\"\\uFF0C\\u5B83\\u662F\\u4E00\\u4E2A C++ \\u5199\\u7684 LibSass \\u7684\\u7ED1\\u5B9A\\u3002 \\u5F53\\u5728 Node.js \\u7248\\u672C\\u95F4\\u5207\\u6362\\u65F6\\uFF0C\\u5FC5\\u987B\\u7ECF\\u5E38\\u91CD\\u65B0\\u7F16\\u8BD1\\u5E93\\u3002\"]}),`\n`,(0,s.jsxs)(e.li,{children:[\"\\u5728 Less \\u4E2D\\uFF0C\\u53D8\\u91CF\\u540D\\u524D\\u7F00\\u662F\",(0,s.jsx)(e.code,{children:\"@\"}),\", \\u5B83\\u53EF\\u80FD\\u4E0E\\u539F\\u751F\\u7684 CSS \\u5173\\u952E\\u5B57\\u6DF7\\u6DC6, \\u4F8B\\u5982\",(0,s.jsx)(e.code,{children:\"@media\"}),\", \",(0,s.jsx)(e.code,{children:\"@import\"}),\" \\u548C \",(0,s.jsx)(e.code,{children:\"@font-face\"}),\" \\u89C4\\u5219\\u3002\"]}),`\n`]})]})}function C(n={}){let{wrapper:e}=n.components||{};return e?(0,s.jsx)(e,Object.assign({},n,{children:(0,s.jsx)(l,n)})):l(n)}var L=C;return g(b);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var h=Object.create;var i=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var f=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty;var S=(n,e)=>()=>(e||n((e={exports:{}}).exports,e),e.exports),j=(n,e)=>{for(var t in e)i(n,t,{get:e[t],enumerable:!0})},o=(n,e,t,r)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let c of m(e))!x.call(n,c)&&c!==t&&i(n,c,{get:()=>e[c],enumerable:!(r=u(e,c))||r.enumerable});return n};var g=(n,e,t)=>(t=n!=null?h(f(n)):{},o(e||!n||!n.__esModule?i(t,\"default\",{value:n,enumerable:!0}):t,n)),p=n=>o(i({},\"__esModule\",{value:!0}),n);var a=S((M,d)=>{d.exports=_jsx_runtime});var v={};j(v,{default:()=>b,frontmatter:()=>_});var s=g(a()),_={title:\"\\u63CF\\u8FF0\\u4F60\\u559C\\u6B22\\u548C\\u4E0D\\u559C\\u6B22\\u4F60\\u4F7F\\u7528\\u8FC7\\u7684 CSS \\u9884\\u5904\\u7406\\u5668\\u7684\\u5730\\u65B9\\u3002\"};function l(n){let e=Object.assign({h2:\"h2\",ul:\"ul\",li:\"li\",a:\"a\",code:\"code\"},n.components);return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(e.h2,{children:\"\\u4F18\\u70B9\"}),`\n`,(0,s.jsxs)(e.ul,{children:[`\n`,(0,s.jsxs)(e.li,{children:[\"\\u4E3B\\u8981\\u662F \",(0,s.jsx)(e.a,{href:\"/questions/quiz/what-are-the-advantages-disadvantages-of-using-css-preprocessors\",children:'\"\\u4F7F\\u7528 CSS \\u9884\\u5904\\u7406\\u5668\\u7684\\u4F18\\u70B9/\\u7F3A\\u70B9\\u662F\\u4EC0\\u4E48\\uFF1F\"'}),\" \\u4E2D\\u63D0\\u5230\\u7684\\u4F18\\u70B9\\u3002\"]}),`\n`,(0,s.jsx)(e.li,{children:\"\\u7F16\\u5199\\u7684 JavaScript \\u8F83\\u5C11\\uFF0C\\u8FD9\\u4E0E Node \\u914D\\u5408\\u5F97\\u5F88\\u597D\\u3002\"}),`\n`]}),`\n`,(0,s.jsx)(e.h2,{children:\"\\u7F3A\\u70B9\"}),`\n`,(0,s.jsxs)(e.ul,{children:[`\n`,(0,s.jsxs)(e.li,{children:[\"Sass \\u4F9D\\u8D56\\u4E8E \",(0,s.jsx)(e.code,{children:\"node-sass\"}),\"\\uFF0C\\u5B83\\u662F\\u7528 C++ \\u7F16\\u5199\\u7684 LibSass \\u7684\\u4E00\\u4E2A\\u7ED1\\u5B9A\\u3002 \\u5728 Node.js \\u7248\\u672C\\u4E4B\\u95F4\\u5207\\u6362\\u65F6\\uFF0C\\u5FC5\\u987B\\u7ECF\\u5E38\\u91CD\\u65B0\\u7F16\\u8BD1\\u8BE5\\u5E93\\u3002\"]}),`\n`,(0,s.jsxs)(e.li,{children:[\"\\u5728 Less \\u4E2D\\uFF0C\\u53D8\\u91CF\\u540D\\u4EE5 \",(0,s.jsx)(e.code,{children:\"@\"}),\" \\u4E3A\\u524D\\u7F00\\uFF0C\\u8FD9\\u53EF\\u80FD\\u4F1A\\u4E0E \",(0,s.jsx)(e.code,{children:\"@media\"}),\"\\u3001\",(0,s.jsx)(e.code,{children:\"@import\"}),\" \\u548C \",(0,s.jsx)(e.code,{children:\"@font-face\"}),\" \\u89C4\\u5219\\u7B49\\u539F\\u751F CSS \\u5173\\u952E\\u5B57\\u6DF7\\u6DC6\\u3002\"]}),`\n`]})]})}function C(n={}){let{wrapper:e}=n.components||{};return e?(0,s.jsx)(e,Object.assign({},n,{children:(0,s.jsx)(l,n)})):l(n)}var b=C;return p(v);})();\n;return Component;"
|
||||
}
|
||||
|
|
@ -21,11 +21,11 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "describe-z-index-and-how-stacking-context-is-formed",
|
||||
"subtitle": null,
|
||||
"title": "描述 `z-index` 和堆叠上下文是如何形成的。",
|
||||
"title": "描述 `z-index` 以及如何形成堆叠上下文。",
|
||||
"topics": [
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/describe-z-index-and-how-stacking-context-is-formed/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var a=Object.create;var i=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var p=Object.getPrototypeOf,_=Object.prototype.hasOwnProperty;var g=(c,e)=>()=>(e||c((e={exports:{}}).exports,e),e.exports),f=(c,e)=>{for(var t in e)i(c,t,{get:e[t],enumerable:!0})},r=(c,e,t,o)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let d of m(e))!_.call(c,d)&&d!==t&&i(c,d,{get:()=>e[d],enumerable:!(o=x(e,d))||o.enumerable});return c};var S=(c,e,t)=>(t=c!=null?a(p(c)):{},r(e||!c||!c.__esModule?i(t,\"default\",{value:c,enumerable:!0}):t,c)),u=c=>r(i({},\"__esModule\",{value:!0}),c);var l=g((B,s)=>{s.exports=_jsx_runtime});var M={};f(M,{default:()=>j,frontmatter:()=>z});var n=S(l()),z={title:\"\\u63CF\\u8FF0 `z-index` \\u548C\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\u662F\\u5982\\u4F55\\u5F62\\u6210\\u7684\\u3002\"};function h(c){let e=Object.assign({p:\"p\",code:\"code\",em:\"em\",strong:\"strong\",a:\"a\"},c.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(e.p,{children:[\"CSS \\u4E2D\\u7684\",(0,n.jsx)(e.code,{children:\"z-index\"}),\"\\u5C5E\\u6027\\u53EF\\u4EE5\\u63A7\\u5236\\u91CD\\u53E0\\u5143\\u7D20\\u7684\\u5782\\u76F4\\u5806\\u53E0\\u987A\\u5E8F\\u3002 \",(0,n.jsx)(e.code,{children:\"z-index\"}),\"\\u53EA\\u5F71\\u54CD\\u5B9A\\u4F4D\\u5143\\u7D20(\",(0,n.jsx)(e.code,{children:\"position\"}),\"\\u503C\\u4E0D\\u662F\",(0,n.jsx)(e.code,{children:\"static\"}),\"\\u7684\\u5143\\u7D20) \\u53CA\\u5176\\u540E\\u4EE3\\u6216 flex item\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u5728\\u6CA1\\u6709\\u4EFB\\u4F55\",(0,n.jsx)(e.code,{children:\"z-index\"}),\"\\u503C\\u7684\\u60C5\\u51B5\\u4E0B\\uFF0C\\u5143\\u7D20\\u6309\\u7167\\u5B83\\u4EEC\\u5728 DOM \\u4E2D\\u51FA\\u73B0\\u7684\\u987A\\u5E8F\\u5806\\u53E0\\uFF08\\u540C\\u4E00\\u5C42\\u6B21\\u4E2D\\u6700\\u4F4E\\u7684\\u4E00\\u4E2A\\u51FA\\u73B0\\u5728\\u4E0A\\u9762\\uFF09\\u3002 \\u5177\\u6709\\u975E\",(0,n.jsx)(e.code,{children:\"static\"}),\"\\u5B9A\\u4F4D(\\u53CA\\u5176\\u5B50\\u4F4D\\u7F6E) \\u7684\\u5143\\u7D20\\u603B\\u662F\\u4F1A\\u51FA\\u73B0\\u5728\\u9ED8\\u8BA4\",(0,n.jsx)(e.code,{children:\"static\"}),\"\\u4F4D\\u7F6E\\u7684\\u5143\\u7D20\\u4E4B\\u4E0A\\uFF0C\\u4E0D\\u8BBA HTML \\u5C42\\u6B21\\u7ED3\\u6784\\u5982\\u4F55\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\u662F\\u4E00\\u4E2A\\u5305\\u542B\\u4E00\\u7EC4\\u56FE\\u5C42\\u7684\\u5143\\u7D20\\u3002 \\u5728\\u4E00\\u4E2A\\u5C40\\u90E8\\u5806\\u53E0\\u73AF\\u5883\\u4E2D\\uFF0C\\u5176\\u5B50\\u5143\\u7D20\\u7684\",(0,n.jsx)(e.code,{children:\"z-index\"}),\"\\u503C\\u662F\\u76F8\\u5BF9\\u4E8E\\u8BE5\\u5143\\u7D20\\u800C\\u4E0D\\u662F\\u6839 document \\u8BBE\\u7F6E\\u7684\\u3002 \\u8BE5\\u4E0A\\u4E0B\\u6587\\u4E4B\\u5916\\u7684\\u5C42--\\u5373\\u5C40\\u90E8\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\u7684\\u540C\\u7EA7\\u5143\\u7D20--\\u4E0D\\u80FD\\u4F4D\\u4E8E\\u5B83\\u7684\\u5C42\\u4E4B\\u95F4\\u3002 \\u5982\\u679C\\u4E00\\u4E2A\\u5143\\u7D20 B \\u4F4D\\u4E8E\\u5143\\u7D20 A \\u7684\\u4E0A\\u9762\\uFF0C\\u5143\\u7D20 A \\u7684\\u4E00\\u4E2A\\u5B50\\u5143\\u7D20 C \\u6C38\\u8FDC\\u4E0D\\u4F1A\\u9AD8\\u4E8E\\u5143\\u7D20 B\\uFF0C\\u5373\\u4F7F\\u5143\\u7D20 C \\u7684\",(0,n.jsx)(e.code,{children:\"z-index\"}),\"\\u6BD4\\u5143\\u7D20 B \\u9AD8\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u6BCF\\u4E2A\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\u90FD\\u662F\\u81EA\\u6210\\u4E00\\u4F53\\u7684--\\u5728\\u5143\\u7D20\\u7684\\u5185\\u5BB9\\u88AB\\u5806\\u53E0\\u540E\\uFF0C\\u6574\\u4E2A\\u5143\\u7D20\\u88AB\\u8BA4\\u4E3A\\u662F\\u6309\\u7167\\u7236\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\u7684\\u5806\\u53E0\\u987A\\u5E8F\\u3002 \\u5C11\\u6570 CSS \\u5C5E\\u6027\\u4F1A\\u89E6\\u53D1\\u4E00\\u4E2A\\u65B0\\u7684\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\uFF0C\\u5982\\u5C0F\\u4E8E 1 \\u7684 \",(0,n.jsx)(e.code,{children:\"opacity\"}),\" \\u3001\",(0,n.jsx)(e.code,{children:\"filter\"}),\" \\u4E0D\\u662F \",(0,n.jsx)(e.code,{children:\"none\"}),\" \\u548C \",(0,n.jsx)(e.code,{children:\"transform\"}),\" \\u4E0D\\u662F \",(0,n.jsx)(e.code,{children:\"none\"}),\" \\u3002\"]}),`\n`,(0,n.jsx)(e.p,{children:(0,n.jsxs)(e.em,{children:[(0,n.jsx)(e.strong,{children:\"\\u6CE8\\u610F\"}),\"\\uFF1A\\u7A76\\u7ADF\\u662F\\u4EC0\\u4E48\\u8BA9\\u4E00\\u4E2A\\u5143\\u7D20\\u6709\\u8D44\\u683C\\u521B\\u5EFA\\u4E00\\u4E2A\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\uFF0C\\u5728\\u8FD9\\u4E00\\u957F\\u4E32\",(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context#The_stacking_context\",children:\"\\u89C4\\u5219\"}),\"\\u4E2D\\u5217\\u51FA\\u3002\"]})})]})}function C(c={}){let{wrapper:e}=c.components||{};return e?(0,n.jsx)(e,Object.assign({},c,{children:(0,n.jsx)(h,c)})):h(c)}var j=C;return u(M);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var a=Object.create;var o=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var p=Object.getPrototypeOf,_=Object.prototype.hasOwnProperty;var g=(c,e)=>()=>(e||c((e={exports:{}}).exports,e),e.exports),f=(c,e)=>{for(var t in e)o(c,t,{get:e[t],enumerable:!0})},r=(c,e,t,i)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let d of m(e))!_.call(c,d)&&d!==t&&o(c,d,{get:()=>e[d],enumerable:!(i=x(e,d))||i.enumerable});return c};var S=(c,e,t)=>(t=c!=null?a(p(c)):{},r(e||!c||!c.__esModule?o(t,\"default\",{value:c,enumerable:!0}):t,c)),z=c=>r(o({},\"__esModule\",{value:!0}),c);var l=g((B,s)=>{s.exports=_jsx_runtime});var M={};f(M,{default:()=>u,frontmatter:()=>C});var n=S(l()),C={title:\"\\u63CF\\u8FF0 `z-index` \\u4EE5\\u53CA\\u5982\\u4F55\\u5F62\\u6210\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\u3002\"};function h(c){let e=Object.assign({p:\"p\",code:\"code\",em:\"em\",strong:\"strong\",a:\"a\"},c.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(e.p,{children:[\"CSS \\u4E2D\\u7684 \",(0,n.jsx)(e.code,{children:\"z-index\"}),\" \\u5C5E\\u6027\\u63A7\\u5236\\u91CD\\u53E0\\u5143\\u7D20\\u7684\\u5782\\u76F4\\u5806\\u53E0\\u987A\\u5E8F\\u3002\",(0,n.jsx)(e.code,{children:\"z-index\"}),\" \\u4EC5\\u5F71\\u54CD\\u5DF2\\u5B9A\\u4F4D\\u7684\\u5143\\u7D20\\uFF08\\u5177\\u6709 \",(0,n.jsx)(e.code,{children:\"position\"}),\" \\u503C\\u4E0D\\u4E3A \",(0,n.jsx)(e.code,{children:\"static\"}),\" \\u7684\\u5143\\u7D20\\uFF09\\u53CA\\u5176\\u540E\\u4EE3\\u6216 flex \\u9879\\u76EE\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u5728\\u6CA1\\u6709\\u4EFB\\u4F55 \",(0,n.jsx)(e.code,{children:\"z-index\"}),\" \\u503C\\u7684\\u60C5\\u51B5\\u4E0B\\uFF0C\\u5143\\u7D20\\u6309\\u7167\\u5B83\\u4EEC\\u5728 DOM \\u4E2D\\u51FA\\u73B0\\u7684\\u987A\\u5E8F\\u5806\\u53E0\\uFF08\\u5728\\u540C\\u4E00\\u5C42\\u7EA7\\u4E2D\\uFF0C\\u6700\\u4E0B\\u9762\\u7684\\u5143\\u7D20\\u51FA\\u73B0\\u5728\\u6700\\u4E0A\\u9762\\uFF09\\u3002\\u5177\\u6709\\u975E\\u9759\\u6001\\u5B9A\\u4F4D\\u7684\\u5143\\u7D20\\uFF08\\u53CA\\u5176\\u5B50\\u5143\\u7D20\\uFF09\\u5C06\\u59CB\\u7EC8\\u51FA\\u73B0\\u5728\\u5177\\u6709\\u9ED8\\u8BA4\\u9759\\u6001\\u5B9A\\u4F4D\\u7684\\u5143\\u7D20\\u4E4B\\u4E0A\\uFF0C\\u800C\\u4E0D\\u7BA1 HTML \\u5C42\\u6B21\\u7ED3\\u6784\\u5982\\u4F55\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\u662F\\u5305\\u542B\\u4E00\\u7EC4\\u5C42\\u7684\\u5143\\u7D20\\u3002\\u5728\\u5C40\\u90E8\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\u4E2D\\uFF0C\\u5176\\u5B50\\u5143\\u7D20\\u7684 \",(0,n.jsx)(e.code,{children:\"z-index\"}),\" \\u503C\\u662F\\u76F8\\u5BF9\\u4E8E\\u8BE5\\u5143\\u7D20\\u8BBE\\u7F6E\\u7684\\uFF0C\\u800C\\u4E0D\\u662F\\u76F8\\u5BF9\\u4E8E\\u6587\\u6863\\u6839\\u5143\\u7D20\\u3002\\u8BE5\\u4E0A\\u4E0B\\u6587\\u4E4B\\u5916\\u7684\\u5C42\\u2014\\u2014\\u5373\\u5C40\\u90E8\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\u7684\\u540C\\u7EA7\\u5143\\u7D20\\u2014\\u2014\\u4E0D\\u80FD\\u4F4D\\u4E8E\\u5176\\u5185\\u7684\\u5C42\\u4E4B\\u95F4\\u3002\\u5982\\u679C\\u5143\\u7D20 B \\u4F4D\\u4E8E\\u5143\\u7D20 A \\u7684\\u9876\\u90E8\\uFF0C\\u800C\\u5143\\u7D20 A \\u7684\\u5B50\\u5143\\u7D20 C \\u6C38\\u8FDC\\u4E0D\\u80FD\\u9AD8\\u4E8E\\u5143\\u7D20 B\\uFF0C\\u5373\\u4F7F\\u5143\\u7D20 C \\u7684 \",(0,n.jsx)(e.code,{children:\"z-index\"}),\" \\u6BD4\\u5143\\u7D20 B \\u9AD8\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u6BCF\\u4E2A\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\u90FD\\u662F\\u81EA\\u5305\\u542B\\u7684 - \\u5728\\u5143\\u7D20\\u7684content\\u5806\\u53E0\\u540E\\uFF0C\\u6574\\u4E2A\\u5143\\u7D20\\u88AB\\u8BA4\\u4E3A\\u5728\\u7236\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\u7684\\u5806\\u53E0\\u987A\\u5E8F\\u4E2D\\u3002\\u5C11\\u6570 CSS \\u5C5E\\u6027\\u4F1A\\u89E6\\u53D1\\u65B0\\u7684\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\uFF0C\\u4F8B\\u5982 \",(0,n.jsx)(e.code,{children:\"opacity\"}),\" \\u5C0F\\u4E8E 1\\u3001\\u4E0D\\u662F \",(0,n.jsx)(e.code,{children:\"none\"}),\" \\u7684 \",(0,n.jsx)(e.code,{children:\"filter\"}),\" \\u4EE5\\u53CA\\u4E0D\\u662F \",(0,n.jsx)(e.code,{children:\"none\"}),\" \\u7684 \",(0,n.jsx)(e.code,{children:\"transform\"}),\"\\u3002\"]}),`\n`,(0,n.jsx)(e.p,{children:(0,n.jsxs)(e.em,{children:[(0,n.jsx)(e.strong,{children:\"\\u6CE8\\u610F\"}),\"\\uFF1A\\u786E\\u5207\\u5730\\u8BF4\\uFF0C\\u4EC0\\u4E48\\u4F7F\\u4E00\\u4E2A\\u5143\\u7D20\\u80FD\\u591F\\u521B\\u5EFA\\u5806\\u53E0\\u4E0A\\u4E0B\\u6587\\u5217\\u5728\\u8FD9\\u4E2A\\u957F\\u957F\\u7684 \",(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context#The_stacking_context\",children:\"\\u89C4\\u5219\"}),\" \\u96C6\\u4E2D\\u3002\"]})})]})}function j(c={}){let{wrapper:e}=c.components||{};return e?(0,n.jsx)(e,Object.assign({},c,{children:(0,n.jsx)(h,c)})):h(c)}var u=j;return z(M);})();\n;return Component;"
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -21,12 +21,12 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "explain-css-sprites-and-how-you-would-implement-them-on-a-page-or-site",
|
||||
"subtitle": null,
|
||||
"title": "解释CSS 图片精灵（雪碧图），以及您如何在页面或网站上实现它们。",
|
||||
"title": "解释 CSS 精灵，以及如何在页面或网站上实现它们。",
|
||||
"topics": [
|
||||
"css",
|
||||
"performance"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/explain-css-sprites-and-how-you-would-implement-them-on-a-page-or-site/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var h=Object.create;var o=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var m=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var S=(c,n)=>()=>(n||c((n={exports:{}}).exports,n),n.exports),x=(c,n)=>{for(var i in n)o(c,i,{get:n[i],enumerable:!0})},d=(c,n,i,l)=>{if(n&&typeof n==\"object\"||typeof n==\"function\")for(let r of g(n))!u.call(c,r)&&r!==i&&o(c,r,{get:()=>n[r],enumerable:!(l=p(n,r))||l.enumerable});return c};var C=(c,n,i)=>(i=c!=null?h(m(c)):{},d(n||!c||!c.__esModule?o(i,\"default\",{value:c,enumerable:!0}):i,c)),_=c=>d(o({},\"__esModule\",{value:!0}),c);var t=S((T,a)=>{a.exports=_jsx_runtime});var f={};x(f,{default:()=>j,frontmatter:()=>b});var e=C(t()),b={title:\"\\u89E3\\u91CACSS \\u56FE\\u7247\\u7CBE\\u7075\\uFF08\\u96EA\\u78A7\\u56FE\\uFF09\\uFF0C\\u4EE5\\u53CA\\u60A8\\u5982\\u4F55\\u5728\\u9875\\u9762\\u6216\\u7F51\\u7AD9\\u4E0A\\u5B9E\\u73B0\\u5B83\\u4EEC\\u3002\"};function s(c){let n=Object.assign({p:\"p\",code:\"code\",h2:\"h2\",ul:\"ul\",li:\"li\",ol:\"ol\",pre:\"pre\",a:\"a\"},c.components);return(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)(n.p,{children:[\"CSS \\u56FE\\u7247\\u7CBE\\u7075\\u5C06\\u591A\\u4E2A\\u56FE\\u7247\\u5408\\u5E76\\u4E3A\\u4E00\\u4E2A\\u66F4\\u5927\\u7684\\u56FE\\u7247\\u6587\\u4EF6\\uFF0C\\u5E76\\u4F7F\\u7528 CSS \",(0,e.jsx)(n.code,{children:\"background-image\"}),\", \",(0,e.jsx)(n.code,{children:\"background-position\"}),\" \\u548C \",(0,e.jsx)(n.code,{children:\"background-size\"}),\" \\u6765\\u9009\\u62E9\\u66F4\\u5927\\u56FE\\u7247\\u7684\\u7279\\u5B9A\\u90E8\\u5206\\u4F5C\\u4E3A\\u6240\\u9700\\u56FE\\u7247\\u3002\"]}),`\n`,(0,e.jsx)(n.p,{children:\"\\u5B83\\u66FE\\u7ECF\\u662F\\u7528\\u4E8E\\u56FE\\u6807\\u7684\\u4E00\\u79CD\\u5E38\\u7528\\u6280\\u672F(\\u4F8B\\u5982\\uFF0CGmail \\u4F7F\\u7528\\u56FE\\u7247\\u7CBE\\u7075\\u4F5C\\u4E3A\\u5176\\u6240\\u6709\\u56FE\\u7247)\\u3002\"}),`\n`,(0,e.jsx)(n.h2,{children:\"\\u4F18\\u70B9\"}),`\n`,(0,e.jsxs)(n.ul,{children:[`\n`,(0,e.jsx)(n.li,{children:\"\\u51CF\\u5C11\\u591A\\u4E2A\\u56FE\\u7247\\u7684 HTTP \\u8BF7\\u6C42\\u6570\\u91CF (\\u6BCF\\u5F20 spritesheet \\u53EA\\u9700\\u8981\\u4E00\\u4E2A\\u8BF7\\u6C42)\\u3002 \\u4F46\\u662F\\u4F7F\\u7528 HTTP2 \\u52A0\\u8F7D\\u591A\\u4E2A\\u56FE\\u7247\\u5DF2\\u4E0D\\u518D\\u662F\\u4E00\\u4E2A\\u95EE\\u9898\\u3002\"}),`\n`,(0,e.jsxs)(n.li,{children:[\"\\u9884\\u5148\\u4E0B\\u8F7D\\u5728\\u9700\\u8981\\u4E4B\\u524D\\u4E0D\\u4F1A\\u4E0B\\u8F7D\\u7684\\u8D44\\u4EA7\\uFF0C\\u5982\\u53EA\\u4F1A\\u51FA\\u73B0\\u5728 \",(0,e.jsx)(n.code,{children:\":hover\"}),\" \\u4F2A\\u72B6\\u6001\\u4E0A\\u7684\\u56FE\\u7247\\u3002 \\u95EA\\u70C1\\u4E0D\\u4F1A\\u88AB\\u770B\\u5230\\u3002\"]}),`\n`]}),`\n`,(0,e.jsx)(n.h2,{children:\"\\u5B9E\\u73B0\\u65B9\\u5F0F\"}),`\n`,(0,e.jsxs)(n.ol,{children:[`\n`,(0,e.jsx)(n.li,{children:\"\\u4F7F\\u7528\\u56FE\\u7247\\u7CBE\\u7075\\u751F\\u6210\\u5668\\u5C06\\u591A\\u4E2A\\u56FE\\u7247\\u5305\\u88C5\\u6210\\u4E00\\u4E2A\\u56FE\\u7247\\u5E76\\u751F\\u6210\\u76F8\\u5E94\\u7684 CSS\"}),`\n`,(0,e.jsxs)(n.li,{children:[\"\\u6BCF\\u4E2A\\u56FE\\u7247\\u90FD\\u6709\\u4E00\\u4E2A\\u5BF9\\u5E94\\u7684 CSS \\u7C7B\\uFF0C\\u5B9A\\u4E49\\u4E86 \",(0,e.jsx)(n.code,{children:\"background-image\"}),\" \\u548C \",(0,e.jsx)(n.code,{children:\"background-position\"}),\" \\u5C5E\\u6027\\u3002\"]}),`\n`,(0,e.jsx)(n.li,{children:\"\\u8981\\u4F7F\\u7528\\u6B64\\u56FE\\u7247\\uFF0C\\u8BF7\\u5C06\\u76F8\\u5E94\\u7684\\u7C7B\\u6DFB\\u52A0\\u5230\\u60A8\\u7684\\u5143\\u7D20\\u4E2D\\u3002\"}),`\n`]}),`\n`,(0,e.jsx)(n.p,{children:\"\\u751F\\u6210\\u7684\\u6837\\u5F0F\\u8868\\u770B\\u8D77\\u6765\\u53EF\\u80FD\\u50CF\\u8FD9\\u6837\\uFF1A\"}),`\n`,(0,e.jsx)(n.pre,{children:(0,e.jsx)(n.code,{className:\"language-css\",children:`.icon {\n background-image: url('https://example.com/images/spritesheet.png');\n width: 24px;\n height: 24px;\n}\n\n.icon-cart {\n background-position: 0 0;\n}\n\n.icon-arrow {\n background-position: -24px 0;\n}\n`})}),`\n`,(0,e.jsx)(n.p,{children:\"\\u5E76\\u4E14\\u53EF\\u4EE5\\u50CF\\u8FD9\\u6837\\u7528\\u5728 HTML \\u4E2D\\uFF1A\"}),`\n`,(0,e.jsx)(n.pre,{children:(0,e.jsx)(n.code,{className:\"language-html\",children:`<span class=\"icon icon-cart\"></span>\n\n<span class=\"icon icon-arrow\"></span>\n`})}),`\n`,(0,e.jsx)(n.h2,{children:\"\\u53C2\\u8003\\u8D44\\u6599\"}),`\n`,(0,e.jsxs)(n.ul,{children:[`\n`,(0,e.jsx)(n.li,{children:(0,e.jsx)(n.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Images/Implementing_image_sprites_in_CSS\",children:\"\\u5728 CSS \\u4E2D\\u5B9E\\u73B0\\u56FE\\u7247\\u7CBE\\u7075 - CSS | MDN\"})}),`\n`]})]})}function k(c={}){let{wrapper:n}=c.components||{};return n?(0,e.jsx)(n,Object.assign({},c,{children:(0,e.jsx)(s,c)})):s(c)}var j=k;return _(f);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var h=Object.create;var o=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var m=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var S=(c,n)=>()=>(n||c((n={exports:{}}).exports,n),n.exports),x=(c,n)=>{for(var i in n)o(c,i,{get:n[i],enumerable:!0})},d=(c,n,i,l)=>{if(n&&typeof n==\"object\"||typeof n==\"function\")for(let r of g(n))!u.call(c,r)&&r!==i&&o(c,r,{get:()=>n[r],enumerable:!(l=p(n,r))||l.enumerable});return c};var C=(c,n,i)=>(i=c!=null?h(m(c)):{},d(n||!c||!c.__esModule?o(i,\"default\",{value:c,enumerable:!0}):i,c)),_=c=>d(o({},\"__esModule\",{value:!0}),c);var t=S((T,a)=>{a.exports=_jsx_runtime});var f={};x(f,{default:()=>j,frontmatter:()=>b});var e=C(t()),b={title:\"\\u89E3\\u91CA CSS \\u7CBE\\u7075\\uFF0C\\u4EE5\\u53CA\\u5982\\u4F55\\u5728\\u9875\\u9762\\u6216\\u7F51\\u7AD9\\u4E0A\\u5B9E\\u73B0\\u5B83\\u4EEC\\u3002\"};function s(c){let n=Object.assign({p:\"p\",code:\"code\",h2:\"h2\",ul:\"ul\",li:\"li\",ol:\"ol\",pre:\"pre\",a:\"a\"},c.components);return(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)(n.p,{children:[\"CSS \\u7CBE\\u7075\\u5C06\\u591A\\u4E2A\\u56FE\\u50CF\\u7EC4\\u5408\\u6210\\u4E00\\u4E2A\\u66F4\\u5927\\u7684\\u56FE\\u50CF\\u6587\\u4EF6\\uFF0C\\u5E76\\u4F7F\\u7528 CSS \",(0,e.jsx)(n.code,{children:\"background-image\"}),\"\\u3001\",(0,e.jsx)(n.code,{children:\"background-position\"}),\" \\u548C \",(0,e.jsx)(n.code,{children:\"background-size\"}),\" \\u7684\\u7EC4\\u5408\\u6765\\u9009\\u62E9\\u66F4\\u5927\\u56FE\\u50CF\\u7684\\u7279\\u5B9A\\u90E8\\u5206\\u4F5C\\u4E3A\\u6240\\u9700\\u7684\\u56FE\\u50CF\\u3002\"]}),`\n`,(0,e.jsx)(n.p,{children:\"\\u5B83\\u66FE\\u7ECF\\u662F\\u4E00\\u79CD\\u5E38\\u7528\\u7684\\u56FE\\u6807\\u6280\\u672F\\uFF08\\u4F8B\\u5982 Gmail \\u5BF9\\u5176\\u6240\\u6709\\u56FE\\u50CF\\u90FD\\u4F7F\\u7528\\u7CBE\\u7075\\u56FE\\uFF09\\u3002\"}),`\n`,(0,e.jsx)(n.h2,{children:\"\\u4F18\\u70B9\"}),`\n`,(0,e.jsxs)(n.ul,{children:[`\n`,(0,e.jsx)(n.li,{children:\"\\u51CF\\u5C11\\u591A\\u4E2A\\u56FE\\u50CF\\u7684 HTTP \\u8BF7\\u6C42\\u6570\\u91CF\\uFF08\\u6BCF\\u4E2A\\u7CBE\\u7075\\u8868\\u53EA\\u9700\\u8981\\u4E00\\u4E2A\\u8BF7\\u6C42\\uFF09\\u3002\\u4F46\\u4F7F\\u7528 HTTP2\\uFF0C\\u52A0\\u8F7D\\u591A\\u4E2A\\u56FE\\u50CF\\u4E0D\\u518D\\u662F\\u4E00\\u4E2A\\u5927\\u95EE\\u9898\\u3002\"}),`\n`,(0,e.jsxs)(n.li,{children:[\"\\u9884\\u5148\\u4E0B\\u8F7D\\u5728\\u9700\\u8981\\u4E4B\\u524D\\u4E0D\\u4F1A\\u4E0B\\u8F7D\\u7684\\u8D44\\u4EA7\\uFF0C\\u4F8B\\u5982\\u4EC5\\u5728 \",(0,e.jsx)(n.code,{children:\":hover\"}),\" \\u4F2A\\u72B6\\u6001\\u4E0B\\u51FA\\u73B0\\u7684\\u56FE\\u50CF\\u3002\\u4E0D\\u4F1A\\u770B\\u5230\\u95EA\\u70C1\\u3002\"]}),`\n`]}),`\n`,(0,e.jsx)(n.h2,{children:\"\\u5982\\u4F55\\u5B9E\\u73B0\"}),`\n`,(0,e.jsxs)(n.ol,{children:[`\n`,(0,e.jsx)(n.li,{children:\"\\u4F7F\\u7528\\u7CBE\\u7075\\u56FE\\u751F\\u6210\\u5668\\u5C06\\u591A\\u4E2A\\u56FE\\u50CF\\u6253\\u5305\\u6210\\u4E00\\u4E2A\\uFF0C\\u5E76\\u4E3A\\u5176\\u751F\\u6210\\u76F8\\u5E94\\u7684 CSS\\u3002\"}),`\n`,(0,e.jsxs)(n.li,{children:[\"\\u6BCF\\u4E2A\\u56FE\\u50CF\\u90FD\\u5C06\\u6709\\u4E00\\u4E2A\\u5BF9\\u5E94\\u7684 CSS \\u7C7B\\uFF0C\\u5176\\u4E2D\\u5B9A\\u4E49\\u4E86 \",(0,e.jsx)(n.code,{children:\"background-image\"}),\" \\u548C \",(0,e.jsx)(n.code,{children:\"background-position\"}),\" \\u5C5E\\u6027\\u3002\"]}),`\n`,(0,e.jsx)(n.li,{children:\"\\u8981\\u4F7F\\u7528\\u8BE5\\u56FE\\u50CF\\uFF0C\\u8BF7\\u5C06\\u76F8\\u5E94\\u7684\\u7C7B\\u6DFB\\u52A0\\u5230\\u60A8\\u7684\\u5143\\u7D20\\u4E2D\\u3002\"}),`\n`]}),`\n`,(0,e.jsx)(n.p,{children:\"\\u751F\\u6210\\u7684\\u6837\\u5F0F\\u8868\\u53EF\\u80FD\\u5982\\u4E0B\\u6240\\u793A\\uFF1A\"}),`\n`,(0,e.jsx)(n.pre,{children:(0,e.jsx)(n.code,{className:\"language-css\",children:`.icon {\n background-image: url('https://example.com/images/spritesheet.png');\n width: 24px;\n height: 24px;\n}\n\n.icon-cart {\n background-position: 0 0;\n}\n\n.icon-arrow {\n background-position: -24px 0;\n}\n`})}),`\n`,(0,e.jsx)(n.p,{children:\"\\u5E76\\u4E14\\u53EF\\u4EE5\\u5728 HTML \\u4E2D\\u8FD9\\u6837\\u4F7F\\u7528\\uFF1A\"}),`\n`,(0,e.jsx)(n.pre,{children:(0,e.jsx)(n.code,{className:\"language-html\",children:`<span class=\"icon icon-cart\"></span>\n\n<span class=\"icon icon-arrow\"></span>\n`})}),`\n`,(0,e.jsx)(n.h2,{children:\"\\u53C2\\u8003\"}),`\n`,(0,e.jsxs)(n.ul,{children:[`\n`,(0,e.jsx)(n.li,{children:(0,e.jsx)(n.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Images/Implementing_image_sprites_in_CSS\",children:\"\\u5728 CSS \\u4E2D\\u5B9E\\u73B0\\u56FE\\u50CF\\u7CBE\\u7075 - CSS\\uFF1A\\u5C42\\u53E0\\u6837\\u5F0F\\u8868 | MDN\"})}),`\n`]})]})}function k(c={}){let{wrapper:n}=c.components||{};return n?(0,e.jsx)(n,Object.assign({},c,{children:(0,e.jsx)(s,c)})):s(c)}var j=k;return _(f);})();\n;return Component;"
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -21,12 +21,12 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "explain-how-a-browser-determines-what-elements-match-a-css-selector",
|
||||
"subtitle": null,
|
||||
"title": "解释浏览器如何决定什么元素与 CSS 选择器匹配。",
|
||||
"title": "解释浏览器如何确定哪些元素与 CSS 选择器匹配。",
|
||||
"topics": [
|
||||
"browser",
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/explain-how-a-browser-determines-what-elements-match-a-css-selector/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var p=Object.create;var r=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var m=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var x=(n,e)=>()=>(e||n((e={exports:{}}).exports,e),e.exports),j=(n,e)=>{for(var c in e)r(n,c,{get:e[c],enumerable:!0})},i=(n,e,c,s)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let o of f(e))!u.call(n,o)&&o!==c&&r(n,o,{get:()=>e[o],enumerable:!(s=l(e,o))||s.enumerable});return n};var _=(n,e,c)=>(c=n!=null?p(m(n)):{},i(e||!n||!n.__esModule?r(c,\"default\",{value:n,enumerable:!0}):c,n)),g=n=>i(r({},\"__esModule\",{value:!0}),n);var d=x((O,a)=>{a.exports=_jsx_runtime});var w={};j(w,{default:()=>S,frontmatter:()=>C});var t=_(d()),C={title:\"\\u89E3\\u91CA\\u6D4F\\u89C8\\u5668\\u5982\\u4F55\\u51B3\\u5B9A\\u4EC0\\u4E48\\u5143\\u7D20\\u4E0E CSS \\u9009\\u62E9\\u5668\\u5339\\u914D\\u3002\"};function h(n){let e=Object.assign({p:\"p\",a:\"a\",code:\"code\"},n.components);return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)(e.p,{children:[\"\\u8FD9\\u4E2A\\u95EE\\u9898\\u4E0E\",(0,t.jsx)(e.a,{href:\"/questions/quiz/what-are-some-of-the-gotchas-for-writing-efficient-css\",children:\"\\u7F16\\u5199\\u9AD8\\u6548\\u7684 CSS\"}),\" \\u7684\\u95EE\\u9898\\u6709\\u5173\\u3002 \\u6D4F\\u89C8\\u5668\\u4ECE\\u6700\\u53F3\\u8FB9\\uFF08\\u5173\\u952E\\u9009\\u62E9\\u5668\\uFF09\\u5230\\u5DE6\\u8FB9\\u5339\\u914D\\u9009\\u62E9\\u5668\\u3002 \\u6D4F\\u89C8\\u5668\\u6839\\u636E\\u5173\\u952E\\u9009\\u62E9\\u5668\\u8FC7\\u6EE4\\u51FA DOM \\u4E2D\\u7684\\u5143\\u7D20\\uFF0C\\u5E76\\u5411\\u4E0A\\u904D\\u5386\\u5176\\u7236\\u5143\\u7D20\\u4EE5\\u786E\\u5B9A\\u5339\\u914D\\u3002 \\u9009\\u62E9\\u5668\\u94FE\\u957F\\u5EA6\\u8D8A\\u77ED\\uFF0C\\u6D4F\\u89C8\\u5668\\u5C31\\u80FD\\u8D8A\\u5FEB\\u786E\\u5B9A\\u8BE5\\u5143\\u7D20\\u662F\\u5426\\u4E0E\\u9009\\u62E9\\u5668\\u5339\\u914D\\u3002\"]}),`\n`,(0,t.jsxs)(e.p,{children:[\"\\u4F8B\\u5982\\uFF0C\\u4F7F\\u7528\\u9009\\u62E9\\u5668\",(0,t.jsx)(e.code,{children:\"p span\"}),\"\\uFF0C \\u6D4F\\u89C8\\u5668\\u5148\\u627E\\u5230\\u6240\\u6709 \",(0,t.jsx)(e.code,{children:\"<span>\"}),\" \\u5143\\u7D20\\uFF0C\\u7136\\u540E\\u6CBF\\u5176\\u7236\\u5143\\u7D20\\u904D\\u5386\\u5230\\u6839\\u8282\\u70B9\\u4EE5\\u627E\\u5230\",(0,t.jsx)(e.code,{children:\"<p>\"}),\" \\u5143\\u7D20\\u3002 \\u5BF9\\u4E8E\\u4E00\\u4E2A\\u7279\\u5B9A\\u7684\",(0,t.jsx)(e.code,{children:\"<span>\"}),\"\\uFF0C\\u53EA\\u8981\\u5B83\\u627E\\u5230\\u4E00\\u4E2A\",(0,t.jsx)(e.code,{children:\"<p>\"}),\"\\uFF0C\\u5B83\\u5C31\\u77E5\\u9053\\u8FD9\\u4E2A\",(0,t.jsx)(e.code,{children:\"<span>\"}),\"\\u7B26\\u5408\\u9009\\u62E9\\u5668\\uFF0C\\u5E76\\u53EF\\u4EE5\\u505C\\u6B62\\u904D\\u5386\\u5B83\\u7684\\u7236\\u5143\\u7D20\\u3002\"]})]})}function M(n={}){let{wrapper:e}=n.components||{};return e?(0,t.jsx)(e,Object.assign({},n,{children:(0,t.jsx)(h,n)})):h(n)}var S=M;return g(w);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var p=Object.create;var r=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var m=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var x=(n,e)=>()=>(e||n((e={exports:{}}).exports,e),e.exports),j=(n,e)=>{for(var c in e)r(n,c,{get:e[c],enumerable:!0})},i=(n,e,c,s)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let o of f(e))!u.call(n,o)&&o!==c&&r(n,o,{get:()=>e[o],enumerable:!(s=l(e,o))||s.enumerable});return n};var _=(n,e,c)=>(c=n!=null?p(m(n)):{},i(e||!n||!n.__esModule?r(c,\"default\",{value:n,enumerable:!0}):c,n)),g=n=>i(r({},\"__esModule\",{value:!0}),n);var d=x((O,a)=>{a.exports=_jsx_runtime});var w={};j(w,{default:()=>S,frontmatter:()=>C});var t=_(d()),C={title:\"\\u89E3\\u91CA\\u6D4F\\u89C8\\u5668\\u5982\\u4F55\\u786E\\u5B9A\\u54EA\\u4E9B\\u5143\\u7D20\\u4E0E CSS \\u9009\\u62E9\\u5668\\u5339\\u914D\\u3002\"};function h(n){let e=Object.assign({p:\"p\",a:\"a\",code:\"code\"},n.components);return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)(e.p,{children:[\"\\u8FD9\\u4E2A\\u95EE\\u9898\\u4E0E\\u5173\\u4E8E \",(0,t.jsx)(e.a,{href:\"/questions/quiz/what-are-some-of-the-gotchas-for-writing-efficient-css\",children:\"\\u7F16\\u5199\\u9AD8\\u6548 CSS\"}),\" \\u7684\\u95EE\\u9898\\u76F8\\u5173\\u3002\\u6D4F\\u89C8\\u5668\\u4ECE\\u6700\\u53F3\\u4FA7\\uFF08\\u5173\\u952E\\u9009\\u62E9\\u5668\\uFF09\\u5230\\u5DE6\\u4FA7\\u5339\\u914D\\u9009\\u62E9\\u5668\\u3002\\u6D4F\\u89C8\\u5668\\u6839\\u636E\\u5173\\u952E\\u9009\\u62E9\\u5668\\u8FC7\\u6EE4 DOM \\u4E2D\\u7684\\u5143\\u7D20\\uFF0C\\u5E76\\u5411\\u4E0A\\u904D\\u5386\\u5176\\u7236\\u5143\\u7D20\\u4EE5\\u786E\\u5B9A\\u5339\\u914D\\u9879\\u3002\\u9009\\u62E9\\u5668\\u94FE\\u7684\\u957F\\u5EA6\\u8D8A\\u77ED\\uFF0C\\u6D4F\\u89C8\\u5668\\u786E\\u5B9A\\u8BE5\\u5143\\u7D20\\u662F\\u5426\\u4E0E\\u9009\\u62E9\\u5668\\u5339\\u914D\\u7684\\u901F\\u5EA6\\u5C31\\u8D8A\\u5FEB\\u3002\"]}),`\n`,(0,t.jsxs)(e.p,{children:[\"\\u4F8B\\u5982\\uFF0C\\u5BF9\\u4E8E\\u9009\\u62E9\\u5668 \",(0,t.jsx)(e.code,{children:\"p span\"}),\"\\uFF0C\\u6D4F\\u89C8\\u5668\\u9996\\u5148\\u627E\\u5230\\u6240\\u6709 \",(0,t.jsx)(e.code,{children:\"<span>\"}),\" \\u5143\\u7D20\\uFF0C\\u5E76\\u5411\\u4E0A\\u904D\\u5386\\u5176\\u7236\\u5143\\u7D20\\uFF0C\\u76F4\\u5230\\u6839\\u5143\\u7D20\\uFF0C\\u4EE5\\u627E\\u5230 \",(0,t.jsx)(e.code,{children:\"<p>\"}),\" \\u5143\\u7D20\\u3002\\u5BF9\\u4E8E\\u7279\\u5B9A\\u7684 \",(0,t.jsx)(e.code,{children:\"<span>\"}),\"\\uFF0C\\u4E00\\u65E6\\u627E\\u5230 \",(0,t.jsx)(e.code,{children:\"<p>\"}),\"\\uFF0C\\u5B83\\u5C31\\u77E5\\u9053 \",(0,t.jsx)(e.code,{children:\"<span>\"}),\" \\u4E0E\\u9009\\u62E9\\u5668\\u5339\\u914D\\uFF0C\\u5E76\\u4E14\\u53EF\\u4EE5\\u505C\\u6B62\\u904D\\u5386\\u5176\\u7236\\u5143\\u7D20\\u3002\"]})]})}function M(n={}){let{wrapper:e}=n.components||{};return e?(0,t.jsx)(e,Object.assign({},n,{children:(0,t.jsx)(h,n)})):h(n)}var S=M;return g(w);})();\n;return Component;"
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
36
apps/web/src/__generated__/questions/quiz/explain-the-composition-pattern-in-react/zh-CN.json
generated
Normal file
36
apps/web/src/__generated__/questions/quiz/explain-the-composition-pattern-in-react/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
32
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-a-microtask-queue/zh-CN.json
generated
Normal file
32
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-a-microtask-queue/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
31
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-lexical-scoping/zh-CN.json
generated
Normal file
31
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-lexical-scoping/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
32
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-partial-application/zh-CN.json
generated
Normal file
32
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-partial-application/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
31
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-scope-in-javascript/zh-CN.json
generated
Normal file
31
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-scope-in-javascript/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
31
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-tagged-templates/zh-CN.json
generated
Normal file
31
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-tagged-templates/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
32
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-the-prototype-pattern/zh-CN.json
generated
Normal file
32
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-the-prototype-pattern/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
31
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-the-singleton-pattern/zh-CN.json
generated
Normal file
31
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-the-singleton-pattern/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
31
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-the-strategy-pattern/zh-CN.json
generated
Normal file
31
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-the-strategy-pattern/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
32
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-the-web-socket-api/zh-CN.json
generated
Normal file
32
apps/web/src/__generated__/questions/quiz/explain-the-concept-of-the-web-socket-api/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
32
apps/web/src/__generated__/questions/quiz/explain-the-different-states-of-a-promise/zh-CN.json
generated
Normal file
32
apps/web/src/__generated__/questions/quiz/explain-the-different-states-of-a-promise/zh-CN.json
generated
Normal file
|
|
@ -0,0 +1,32 @@
|
|||
{
|
||||
"description": null,
|
||||
"metadata": {
|
||||
"access": "free",
|
||||
"author": null,
|
||||
"companies": [],
|
||||
"created": 1630800000,
|
||||
"difficulty": "easy",
|
||||
"duration": 5,
|
||||
"excerpt": null,
|
||||
"featured": false,
|
||||
"format": "quiz",
|
||||
"frameworkDefault": null,
|
||||
"frameworks": [],
|
||||
"href": "/questions/quiz/explain-the-different-states-of-a-promise",
|
||||
"importance": "low",
|
||||
"languages": [],
|
||||
"nextQuestions": [],
|
||||
"published": true,
|
||||
"ranking": 999,
|
||||
"similarQuestions": [],
|
||||
"slug": "explain-the-different-states-of-a-promise",
|
||||
"subtitle": null,
|
||||
"title": "解释 Promise 的不同状态",
|
||||
"topics": [
|
||||
"async",
|
||||
"javascript"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/top-javascript-interview-questions/blob/main/questions/explain-the-different-states-of-a-promise/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var a=Object.create;var o=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var j=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var f=(r,e)=>()=>(e||r((e={exports:{}}).exports,e),e.exports),g=(r,e)=>{for(var c in e)o(r,c,{get:e[c],enumerable:!0})},s=(r,e,c,l)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let i of p(e))!u.call(r,i)&&i!==c&&o(r,i,{get:()=>e[i],enumerable:!(l=m(e,i))||l.enumerable});return r};var P=(r,e,c)=>(c=r!=null?a(j(r)):{},s(e||!r||!r.__esModule?o(c,\"default\",{value:r,enumerable:!0}):c,r)),v=r=>s(o({},\"__esModule\",{value:!0}),r);var h=f((N,d)=>{d.exports=_jsx_runtime});var S={};g(S,{default:()=>b,frontmatter:()=>x});var n=P(h()),x={title:\"\\u89E3\\u91CA Promise \\u7684\\u4E0D\\u540C\\u72B6\\u6001\"};function t(r){let e=Object.assign({h2:\"h2\",p:\"p\",code:\"code\",pre:\"pre\",hr:\"hr\",h3:\"h3\",ul:\"ul\",li:\"li\",a:\"a\"},r.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(e.h2,{children:\"\\u603B\\u7ED3\"}),`\n`,(0,n.jsxs)(e.p,{children:[\"JavaScript \\u4E2D\\u7684 \",(0,n.jsx)(e.code,{children:\"Promise\"}),\" \\u53EF\\u4EE5\\u5904\\u4E8E\\u4E09\\u79CD\\u72B6\\u6001\\u4E4B\\u4E00\\uFF1A\",(0,n.jsx)(e.code,{children:\"pending\"}),\"\\uFF08\\u5F85\\u5B9A\\uFF09\\u3001\",(0,n.jsx)(e.code,{children:\"fulfilled\"}),\"\\uFF08\\u5DF2\\u5B9E\\u73B0\\uFF09\\u6216 \",(0,n.jsx)(e.code,{children:\"rejected\"}),\"\\uFF08\\u5DF2\\u62D2\\u7EDD\\uFF09\\u3002\\u521B\\u5EFA \",(0,n.jsx)(e.code,{children:\"Promise\"}),\" \\u65F6\\uFF0C\\u5B83\\u9996\\u5148\\u5904\\u4E8E \",(0,n.jsx)(e.code,{children:\"pending\"}),\" \\u72B6\\u6001\\u3002\\u5982\\u679C\\u64CD\\u4F5C\\u6210\\u529F\\u5B8C\\u6210\\uFF0C\",(0,n.jsx)(e.code,{children:\"Promise\"}),\" \\u5C06\\u8F6C\\u6362\\u4E3A \",(0,n.jsx)(e.code,{children:\"fulfilled\"}),\" \\u72B6\\u6001\\uFF0C\\u5982\\u679C\\u5931\\u8D25\\uFF0C\\u5219\\u8F6C\\u6362\\u4E3A \",(0,n.jsx)(e.code,{children:\"rejected\"}),\" \\u72B6\\u6001\\u3002 \\u8FD9\\u662F\\u4E00\\u4E2A\\u5FEB\\u901F\\u793A\\u4F8B\\uFF1A\"]}),`\n`,(0,n.jsx)(e.pre,{children:(0,n.jsx)(e.code,{className:\"language-js\",children:`let promise = new Promise((resolve, reject) => {\n // some asynchronous operation\n if (success) {\n resolve('Success!');\n } else {\n reject('Error!');\n }\n});\n`})}),`\n`,(0,n.jsx)(e.hr,{}),`\n`,(0,n.jsx)(e.h2,{children:\"Promise \\u7684\\u4E0D\\u540C\\u72B6\\u6001\"}),`\n`,(0,n.jsx)(e.h3,{children:\"\\u5F85\\u5B9A\"}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u9996\\u6B21\\u521B\\u5EFA \",(0,n.jsx)(e.code,{children:\"Promise\"}),\" \\u65F6\\uFF0C\\u5B83\\u5904\\u4E8E \",(0,n.jsx)(e.code,{children:\"pending\"}),\" \\u72B6\\u6001\\u3002 \\u8FD9\\u610F\\u5473\\u7740\\u5F02\\u6B65\\u64CD\\u4F5C\\u5C1A\\u672A\\u5B8C\\u6210\\u3002\"]}),`\n`,(0,n.jsx)(e.pre,{children:(0,n.jsx)(e.code,{className:\"language-js\",children:`let promise = new Promise((resolve, reject) => {\n // asynchronous operation\n});\n`})}),`\n`,(0,n.jsx)(e.h3,{children:\"\\u5DF2\\u5B9E\\u73B0\"}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u5F53\\u5F02\\u6B65\\u64CD\\u4F5C\\u6210\\u529F\\u5B8C\\u6210\\u65F6\\uFF0C\",(0,n.jsx)(e.code,{children:\"Promise\"}),\" \\u8F6C\\u6362\\u4E3A \",(0,n.jsx)(e.code,{children:\"fulfilled\"}),\" \\u72B6\\u6001\\u3002 \\u8C03\\u7528 \",(0,n.jsx)(e.code,{children:\"resolve\"}),\" \\u51FD\\u6570\\u6765\\u6307\\u793A\\u8FD9\\u4E00\\u70B9\\u3002\"]}),`\n`,(0,n.jsx)(e.pre,{children:(0,n.jsx)(e.code,{className:\"language-js\",children:`let promise = new Promise((resolve, reject) => {\n resolve('Success!');\n});\n`})}),`\n`,(0,n.jsx)(e.h3,{children:\"\\u5DF2\\u62D2\\u7EDD\"}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u5F53\\u5F02\\u6B65\\u64CD\\u4F5C\\u5931\\u8D25\\u65F6\\uFF0C\",(0,n.jsx)(e.code,{children:\"Promise\"}),\" \\u8F6C\\u6362\\u4E3A \",(0,n.jsx)(e.code,{children:\"rejected\"}),\" \\u72B6\\u6001\\u3002 \\u8C03\\u7528 \",(0,n.jsx)(e.code,{children:\"reject\"}),\" \\u51FD\\u6570\\u6765\\u6307\\u793A\\u8FD9\\u4E00\\u70B9\\u3002\"]}),`\n`,(0,n.jsx)(e.pre,{children:(0,n.jsx)(e.code,{className:\"language-js\",children:`let promise = new Promise((resolve, reject) => {\n reject('Error!');\n});\n`})}),`\n`,(0,n.jsx)(e.h2,{children:\"\\u5EF6\\u4F38\\u9605\\u8BFB\"}),`\n`,(0,n.jsxs)(e.ul,{children:[`\n`,(0,n.jsx)(e.li,{children:(0,n.jsx)(e.a,{href:\"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise\",children:\"MDN Web Docs: Promise\"})}),`\n`,(0,n.jsx)(e.li,{children:(0,n.jsx)(e.a,{href:\"https://javascript.info/promise-basics\",children:\"JavaScript.info: Promises\"})}),`\n`,(0,n.jsx)(e.li,{children:(0,n.jsx)(e.a,{href:\"https://promisesaplus.com/\",children:\"Promise/A+ Specification\"})}),`\n`]})]})}function _(r={}){let{wrapper:e}=r.components||{};return e?(0,n.jsx)(e,Object.assign({},r,{children:(0,n.jsx)(t,r)})):t(r)}var b=_;return v(S);})();\n;return Component;"
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
32
apps/web/src/__generated__/questions/quiz/explain-the-event-phases-in-a-browser/zh-CN.json
generated
Normal file
32
apps/web/src/__generated__/questions/quiz/explain-the-event-phases-in-a-browser/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
31
apps/web/src/__generated__/questions/quiz/explain-the-observer-pattern-and-its-use-cases/zh-CN.json
generated
Normal file
31
apps/web/src/__generated__/questions/quiz/explain-the-observer-pattern-and-its-use-cases/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
36
apps/web/src/__generated__/questions/quiz/explain-what-react-hydration-is/zh-CN.json
generated
Normal file
36
apps/web/src/__generated__/questions/quiz/explain-what-react-hydration-is/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -21,11 +21,11 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "have-you-ever-used-a-grid-system-and-if-so-what-do-you-prefer",
|
||||
"subtitle": null,
|
||||
"title": "您是否曾经使用过网格系统，如果使用的话，您喜欢什么？",
|
||||
"title": "你是否使用过网格系统，如果使用过，你更喜欢哪种？",
|
||||
"topics": [
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/have-you-ever-used-a-grid-system-and-if-so-what-do-you-prefer/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var h=Object.create;var o=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var f=Object.getPrototypeOf,m=Object.prototype.hasOwnProperty;var u=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),g=(t,e)=>{for(var c in e)o(t,c,{get:e[c],enumerable:!0})},i=(t,e,c,s)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let r of p(e))!m.call(t,r)&&r!==c&&o(t,r,{get:()=>e[r],enumerable:!(s=x(e,r))||s.enumerable});return t};var j=(t,e,c)=>(c=t!=null?h(f(t)):{},i(e||!t||!t.__esModule?o(c,\"default\",{value:t,enumerable:!0}):c,t)),_=t=>i(o({},\"__esModule\",{value:!0}),t);var a=u((B,d)=>{d.exports=_jsx_runtime});var M={};g(M,{default:()=>C,frontmatter:()=>F});var n=j(a()),F={title:\"\\u60A8\\u662F\\u5426\\u66FE\\u7ECF\\u4F7F\\u7528\\u8FC7\\u7F51\\u683C\\u7CFB\\u7EDF\\uFF0C\\u5982\\u679C\\u4F7F\\u7528\\u7684\\u8BDD\\uFF0C\\u60A8\\u559C\\u6B22\\u4EC0\\u4E48\\uFF1F\"};function l(t){let e=Object.assign({p:\"p\",code:\"code\",a:\"a\"},t.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(e.p,{children:[\"\\u5728 Flex \\u5F00\\u59CB\\u6D41\\u884C\\u4E4B\\u524D\\uFF08\\u5927\\u7EA6\\u5728 2014 \\u5E74\\uFF09\\uFF0C\\u57FA\\u4E8E\",(0,n.jsx)(e.code,{children:\"float\"}),\"\\u7684\\u7F51\\u683C\\u7CFB\\u7EDF\\u662F\\u6700\\u53EF\\u9760\\u7684\\uFF0C\\u56E0\\u4E3A\\u5728\\u73B0\\u6709\\u7684\\u66FF\\u4EE3\\u7CFB\\u7EDF\\uFF08flex\\u3001grid\\uFF09\\u4E2D\\uFF0C\\u5B83\\u4ECD\\u7136\\u62E5\\u6709\\u6700\\u591A\\u7684\\u6D4F\\u89C8\\u5668\\u652F\\u6301\\u3002 Bootstrap \\u4E00\\u76F4\\u5728\\u4F7F\\u7528\",(0,n.jsx)(e.code,{children:\"float\"}),\"\\u65B9\\u6CD5\\uFF0C\\u76F4\\u5230 Bootstrap 4 \\u8F6C\\u800C\\u91C7\\u7528\",(0,n.jsx)(e.code,{children:\"flex\"}),\"\\u65B9\\u6CD5\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u4ECA\\u5929\\uFF0C\",(0,n.jsx)(e.code,{children:\"flex\"}),\" \\u662F\\u5EFA\\u7ACB\\u7F51\\u683C\\u7CFB\\u7EDF\\u7684\\u63A8\\u8350\\u65B9\\u6CD5\\uFF0C\\u5B83\\u6709\",(0,n.jsx)(e.a,{href:\"https://caniuse.com/#search=flex\",children:\"\\u4F53\\u9762\\u7684\\u6D4F\\u89C8\\u5668\\u652F\\u6301 (99.64%)\"}),\"\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u5BF9\\u4E8E\\u559C\\u6B22\\u5192\\u9669\\u7684\\u4EBA\\u6765\\u8BF4\\uFF0C\\u4ED6\\u4EEC\\u53EF\\u4EE5\\u770B\\u770B\",(0,n.jsx)(e.a,{href:\"https://css-tricks.com/snippets/css/complete-guide-grid/\",children:\"CSS Grid Layout\"}),\"\\uFF0C\\u5B83\\u4F7F\\u7528\\u95EA\\u4EAE\\u7684\\u65B0\",(0,n.jsx)(e.code,{children:\"grid\"}),\"\\u5C5E\\u6027\\u3002 Grid \\u662F\\u4E00\\u4E2A\\u4E8C\\u7EF4\\u7F51\\u683C\\u5E03\\u5C40\\u7CFB\\u7EDF\\uFF0C\\u800C Flexbox \\u5219\\u662F\\u4E00\\u4E2A\\u4E00\\u7EF4\\u7684\\u7CFB\\u7EDF\\u3002\"]})]})}function b(t={}){let{wrapper:e}=t.components||{};return e?(0,n.jsx)(e,Object.assign({},t,{children:(0,n.jsx)(l,t)})):l(t)}var C=b;return _(M);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var h=Object.create;var o=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var f=Object.getPrototypeOf,m=Object.prototype.hasOwnProperty;var u=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),g=(t,e)=>{for(var c in e)o(t,c,{get:e[c],enumerable:!0})},i=(t,e,c,s)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let r of p(e))!m.call(t,r)&&r!==c&&o(t,r,{get:()=>e[r],enumerable:!(s=x(e,r))||s.enumerable});return t};var j=(t,e,c)=>(c=t!=null?h(f(t)):{},i(e||!t||!t.__esModule?o(c,\"default\",{value:t,enumerable:!0}):c,t)),_=t=>i(o({},\"__esModule\",{value:!0}),t);var a=u((B,d)=>{d.exports=_jsx_runtime});var M={};g(M,{default:()=>C,frontmatter:()=>F});var n=j(a()),F={title:\"\\u4F60\\u662F\\u5426\\u4F7F\\u7528\\u8FC7\\u7F51\\u683C\\u7CFB\\u7EDF\\uFF0C\\u5982\\u679C\\u4F7F\\u7528\\u8FC7\\uFF0C\\u4F60\\u66F4\\u559C\\u6B22\\u54EA\\u79CD\\uFF1F\"};function l(t){let e=Object.assign({p:\"p\",code:\"code\",a:\"a\"},t.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(e.p,{children:[\"\\u5728 Flex \\u53D8\\u5F97\\u6D41\\u884C\\u4E4B\\u524D\\uFF08\\u5927\\u7EA6\\u5728 2014 \\u5E74\\uFF09\\uFF0C\\u57FA\\u4E8E \",(0,n.jsx)(e.code,{children:\"float\"}),\" \\u7684\\u7F51\\u683C\\u7CFB\\u7EDF\\u662F\\u6700\\u53EF\\u9760\\u7684\\uFF0C\\u56E0\\u4E3A\\u5B83\\u5728\\u73B0\\u6709\\u7684\\u66FF\\u4EE3\\u7CFB\\u7EDF\\uFF08flex\\u3001grid\\uFF09\\u4E2D\\u4ECD\\u7136\\u62E5\\u6709\\u6700\\u591A\\u7684\\u6D4F\\u89C8\\u5668\\u652F\\u6301\\u3002Bootstrap \\u4E00\\u76F4\\u4F7F\\u7528 \",(0,n.jsx)(e.code,{children:\"float\"}),\" \\u65B9\\u6CD5\\uFF0C\\u76F4\\u5230 Bootstrap 4 \\u5207\\u6362\\u5230\\u57FA\\u4E8E \",(0,n.jsx)(e.code,{children:\"flex\"}),\" \\u7684\\u65B9\\u6CD5\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u5982\\u4ECA\\uFF0C\",(0,n.jsx)(e.code,{children:\"flex\"}),\" \\u662F\\u6784\\u5EFA\\u7F51\\u683C\\u7CFB\\u7EDF\\u7684\\u63A8\\u8350\\u65B9\\u6CD5\\uFF0C\\u5E76\\u4E14\\u5177\\u6709 \",(0,n.jsx)(e.a,{href:\"https://caniuse.com/#search=flex\",children:\"\\u4E0D\\u9519\\u7684\\u6D4F\\u89C8\\u5668\\u652F\\u6301 (99.64%)\"}),\"\\u3002\"]}),`\n`,(0,n.jsxs)(e.p,{children:[\"\\u5BF9\\u4E8E\\u559C\\u6B22\\u5192\\u9669\\u7684\\u4EBA\\uFF0C\\u4ED6\\u4EEC\\u53EF\\u4EE5\\u7814\\u7A76 \",(0,n.jsx)(e.a,{href:\"https://css-tricks.com/snippets/css/complete-guide-grid/\",children:\"CSS Grid Layout\"}),\"\\uFF0C\\u5B83\\u4F7F\\u7528\\u5168\\u65B0\\u7684 \",(0,n.jsx)(e.code,{children:\"grid\"}),\" \\u5C5E\\u6027\\u3002Grid \\u662F\\u4E00\\u4E2A\\u57FA\\u4E8E\\u4E8C\\u7EF4\\u7F51\\u683C\\u7684\\u5E03\\u5C40\\u7CFB\\u7EDF\\uFF0C\\u800C Flexbox \\u662F\\u4E00\\u7EF4\\u7684\\u3002\"]})]})}function b(t={}){let{wrapper:e}=t.components||{};return e?(0,n.jsx)(e,Object.assign({},t,{children:(0,n.jsx)(l,t)})):l(t)}var C=b;return _(M);})();\n;return Component;"
|
||||
}
|
||||
|
|
@ -20,12 +20,12 @@
|
|||
"ranking": 100,
|
||||
"similarQuestions": [],
|
||||
"slug": "have-you-ever-worked-with-retina-graphics-if-so-when-and-what-techniques-did-you-use",
|
||||
"subtitle": "如果是这样，你是在什么时候使用的，使用了什么技术？",
|
||||
"title": "您是否曾使用视网膜屏幕工作过？",
|
||||
"subtitle": "如果是，你是什么时候以及使用了什么技术？",
|
||||
"title": "你是否使用过视网膜图形？",
|
||||
"topics": [
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/have-you-ever-worked-with-retina-graphics-if-so-when-and-what-techniques-did-you-use/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var p=Object.create;var s=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var g=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var j=(n,e)=>()=>(e||n((e={exports:{}}).exports,e),e.exports),x=(n,e)=>{for(var i in e)s(n,i,{get:e[i],enumerable:!0})},l=(n,e,i,r)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let c of m(e))!u.call(n,c)&&c!==i&&s(n,c,{get:()=>e[c],enumerable:!(r=h(e,c))||r.enumerable});return n};var f=(n,e,i)=>(i=n!=null?p(g(n)):{},l(e||!n||!n.__esModule?s(i,\"default\",{value:n,enumerable:!0}):i,n)),w=n=>l(s({},\"__esModule\",{value:!0}),n);var o=j((L,d)=>{d.exports=_jsx_runtime});var b={};x(b,{default:()=>M,frontmatter:()=>v});var t=f(o()),v={title:\"\\u60A8\\u662F\\u5426\\u66FE\\u4F7F\\u7528\\u89C6\\u7F51\\u819C\\u5C4F\\u5E55\\u5DE5\\u4F5C\\u8FC7\\uFF1F\",subtitle:\"\\u5982\\u679C\\u662F\\u8FD9\\u6837\\uFF0C\\u4F60\\u662F\\u5728\\u4EC0\\u4E48\\u65F6\\u5019\\u4F7F\\u7528\\u7684\\uFF0C\\u4F7F\\u7528\\u4E86\\u4EC0\\u4E48\\u6280\\u672F\\uFF1F\"};function a(n){let e=Object.assign({p:\"p\",em:\"em\",code:\"code\",pre:\"pre\",a:\"a\"},n.components);return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)(e.p,{children:[\"\\u89C6\\u7F51\\u819C \\uFF08\",(0,t.jsx)(e.em,{children:\"Retina\"}),\"\\uFF09 \\u53EA\\u662F\\u4E00\\u4E2A\\u8425\\u9500\\u672F\\u8BED\\uFF0C\\u6307\\u7684\\u662F\\u9AD8\\u5206\\u8FA8\\u7387\\u5C4F\\u5E55\\uFF0C\\u50CF\\u7D20\\u6BD4\\u5927\\u4E8E 1\\u3002 \\u9700\\u8981\\u4E86\\u89E3\\u7684\\u5173\\u952E\\u662F\\u4F7F\\u7528\\u50CF\\u7D20\\u6BD4\\u503C\\u8868\\u793A\\u8FD9\\u4E9B\\u5C4F\\u5E55\\u6B63\\u5728\\u6A21\\u62DF\\u4F4E\\u5206\\u8FA8\\u7387\\u5C4F\\u5E55\\u4EE5\\u663E\\u793A\\u5927\\u5C0F\\u76F8\\u540C\\u7684\\u5143\\u7D20\\u3002 \\u5982\\u4ECA\\uFF0C\\u6211\\u4EEC\\u8BA4\\u4E3A\\u6240\\u6709\\u7684\\u79FB\\u52A8\\u8BBE\\u5907\\u90FD\\u662F\\u4E8B\\u5B9E\\u4E0A\\u7684\\u89C6\\u7F51\\u819C\\u5C4F\\u5E55\\u3002\"]}),`\n`,(0,t.jsx)(e.p,{children:\"\\u6D4F\\u89C8\\u5668\\u9ED8\\u8BA4\\u6839\\u636E\\u8BBE\\u5907\\u5206\\u8FA8\\u7387\\u6E32\\u67D3 DOM \\u5143\\u7D20\\uFF0C\\u4F46\\u56FE\\u7247\\u9664\\u5916\\u3002\"}),`\n`,(0,t.jsx)(e.p,{children:\"\\u4E3A\\u4E86\\u6709\\u6700\\u4F73\\u89C6\\u7F51\\u819C\\u663E\\u793A\\u7684\\u7CBE\\u5F69\\u56FE\\u5F62\\uFF0C\\u6211\\u4EEC\\u9700\\u8981\\u5C3D\\u53EF\\u80FD\\u4F7F\\u7528\\u9AD8\\u5206\\u8FA8\\u7387\\u56FE\\u7247\\u3002 \\u7136\\u800C\\uFF0C\\u4F7F\\u7528\\u6700\\u9AD8\\u5206\\u8FA8\\u7387\\u56FE\\u7247\\u5C06\\u4F1A\\u5BF9\\u6027\\u80FD\\u4EA7\\u751F\\u5F71\\u54CD\\uFF0C\\u56E0\\u4E3A\\u66F4\\u591A\\u7684\\u5B57\\u8282\\u9700\\u8981\\u5728\\u7F51\\u7EDC\\u4E0A\\u53D1\\u9001\\u3002\"}),`\n`,(0,t.jsxs)(e.p,{children:[\"\\u4E3A\\u4E86\\u514B\\u670D\\u8FD9\\u4E2A\\u95EE\\u9898\\uFF0C\\u6211\\u4EEC\\u53EF\\u4EE5\\u4F7F\\u7528 HTML5 \\u4E2D\\u6307\\u5B9A\\u7684\\u54CD\\u5E94\\u5F0F\\u56FE\\u7247\\u3002 \\u5B83\\u9700\\u8981\\u5728\\u6D4F\\u89C8\\u5668\\u4E2D\\u63D0\\u4F9B\\u540C\\u4E00\\u56FE\\u7247\\u7684\\u4E0D\\u540C\\u5206\\u8FA8\\u7387\\u6587\\u4EF6\\uFF0C\\u5E76\\u8BA9\\u5B83\\u51B3\\u5B9A\\u54EA\\u4E2A\\u56FE\\u7247\\u662F\\u6700\\u4F73\\u7684\\u56FE\\u7247\\uFF0C \\u4F7F\\u7528 html \\u5C5E\\u6027 \",(0,t.jsx)(e.code,{children:\"srcset\"}),\" \\u548C\\u53EF\\u9009\\u7684 \",(0,t.jsx)(e.code,{children:\"sizes\"}),\" \\uFF0C\\u6BD4\\u5982\\uFF1A\"]}),`\n`,(0,t.jsx)(e.pre,{children:(0,t.jsx)(e.code,{className:\"language-html\",children:`<div responsive-background-image>\n <img\n src=\"/images/test-1600.jpg\"\n sizes=\"\n (min-width: 768px) 50vw,\n (min-width: 1024px) 66vw,\n 100vw\"\n srcset=\"\n /images/test-400.jpg 400w,\n /images/test-800.jpg 800w,\n /images/test-1200.jpg 1200w\n \" />\n</div>\n`})}),`\n`,(0,t.jsxs)(e.p,{children:[\"\\u5FC5\\u987B\\u6CE8\\u610F\\uFF0C\\u4E0D\\u652F\\u6301 HTML5 \\u7684 \",(0,t.jsx)(e.code,{children:\"srcset\"}),\" (\\u5373 IE11) \\u7684\\u6D4F\\u89C8\\u5668\\u4F1A\\u5FFD\\u7565\\u5B83\\uFF0C\\u800C\\u4F7F\\u7528 \",(0,t.jsx)(e.code,{children:\"src\"}),\" \\u3002 \\u5982\\u679C\\u6211\\u4EEC\\u771F\\u7684\\u9700\\u8981\\u652F\\u6301 IE11 \\u5E76\\u4E14\\u6211\\u4EEC\\u60F3\\u8981\\u4E3A\\u6027\\u80FD\\u539F\\u56E0\\u63D0\\u4F9B\\u6B64\\u529F\\u80FD\\uFF0C\\u6211\\u4EEC\\u53EF\\u4EE5\\u4F7F\\u7528 JavaScript polyfill\\u3002 \\u4F8B\\u5982\\uFF1A\",(0,t.jsx)(e.a,{href:\"https://scottjehl.github.io/picturefill/\",children:\"Picturefill\"}),\"\\u3002\"]}),`\n`,(0,t.jsx)(e.p,{children:\"\\u5BF9\\u4E8E\\u56FE\\u6807\\uFF0C\\u5C3D\\u53EF\\u80FD\\u4F7F\\u7528 SVG\\uFF0C\\u56E0\\u4E3A\\u65E0\\u8BBA\\u5206\\u8FA8\\u7387\\u5982\\u4F55\\uFF0C\\u5B83\\u4EEC\\u90FD\\u4F1A\\u5448\\u73B0\\u5F97\\u975E\\u5E38\\u6E05\\u6670\\u3002\"})]})}function _(n={}){let{wrapper:e}=n.components||{};return e?(0,t.jsx)(e,Object.assign({},n,{children:(0,t.jsx)(a,n)})):a(n)}var M=_;return w(b);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var h=Object.create;var r=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var g=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var j=(n,e)=>()=>(e||n((e={exports:{}}).exports,e),e.exports),x=(n,e)=>{for(var i in e)r(n,i,{get:e[i],enumerable:!0})},l=(n,e,i,s)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let c of m(e))!u.call(n,c)&&c!==i&&r(n,c,{get:()=>e[c],enumerable:!(s=p(e,c))||s.enumerable});return n};var f=(n,e,i)=>(i=n!=null?h(g(n)):{},l(e||!n||!n.__esModule?r(i,\"default\",{value:n,enumerable:!0}):i,n)),w=n=>l(r({},\"__esModule\",{value:!0}),n);var a=j((L,d)=>{d.exports=_jsx_runtime});var b={};x(b,{default:()=>M,frontmatter:()=>v});var t=f(a()),v={title:\"\\u4F60\\u662F\\u5426\\u4F7F\\u7528\\u8FC7\\u89C6\\u7F51\\u819C\\u56FE\\u5F62\\uFF1F\",subtitle:\"\\u5982\\u679C\\u662F\\uFF0C\\u4F60\\u662F\\u4EC0\\u4E48\\u65F6\\u5019\\u4EE5\\u53CA\\u4F7F\\u7528\\u4E86\\u4EC0\\u4E48\\u6280\\u672F\\uFF1F\"};function o(n){let e=Object.assign({p:\"p\",em:\"em\",code:\"code\",pre:\"pre\",a:\"a\"},n.components);return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)(e.p,{children:[(0,t.jsx)(e.em,{children:\"Retina\"}),\" \\u53EA\\u662F\\u4E00\\u4E2A\\u8425\\u9500\\u672F\\u8BED\\uFF0C\\u6307\\u7684\\u662F\\u50CF\\u7D20\\u6BD4\\u5927\\u4E8E 1 \\u7684\\u9AD8\\u5206\\u8FA8\\u7387\\u5C4F\\u5E55\\u3002\\u9700\\u8981\\u77E5\\u9053\\u7684\\u5173\\u952E\\u662F\\uFF0C\\u4F7F\\u7528\\u50CF\\u7D20\\u6BD4\\u610F\\u5473\\u7740\\u8FD9\\u4E9B\\u663E\\u793A\\u5668\\u6B63\\u5728\\u6A21\\u62DF\\u8F83\\u4F4E\\u5206\\u8FA8\\u7387\\u7684\\u5C4F\\u5E55\\uFF0C\\u4EE5\\u4FBF\\u4EE5\\u76F8\\u540C\\u7684\\u5927\\u5C0F\\u663E\\u793A\\u5143\\u7D20\\u3002\\u5982\\u4ECA\\uFF0C\\u6211\\u4EEC\\u8BA4\\u4E3A\\u6240\\u6709\\u79FB\\u52A8\\u8BBE\\u5907\\u90FD\\u662F \",(0,t.jsx)(e.em,{children:\"retina\"}),\" \\u9ED8\\u8BA4\\u663E\\u793A\\u5668\\u3002\"]}),`\n`,(0,t.jsx)(e.p,{children:\"\\u9ED8\\u8BA4\\u60C5\\u51B5\\u4E0B\\uFF0C\\u6D4F\\u89C8\\u5668\\u4F1A\\u6839\\u636E\\u8BBE\\u5907\\u5206\\u8FA8\\u7387\\u6E32\\u67D3 DOM \\u5143\\u7D20\\uFF0C\\u4F46\\u56FE\\u50CF\\u9664\\u5916\\u3002\"}),`\n`,(0,t.jsx)(e.p,{children:\"\\u4E3A\\u4E86\\u83B7\\u5F97\\u6E05\\u6670\\u3001\\u7F8E\\u89C2\\u7684\\u56FE\\u5F62\\uFF0C\\u5145\\u5206\\u5229\\u7528\\u89C6\\u7F51\\u819C\\u663E\\u793A\\u5668\\uFF0C\\u6211\\u4EEC\\u9700\\u8981\\u5C3D\\u53EF\\u80FD\\u4F7F\\u7528\\u9AD8\\u5206\\u8FA8\\u7387\\u56FE\\u50CF\\u3002\\u4F46\\u662F\\uFF0C\\u59CB\\u7EC8\\u4F7F\\u7528\\u6700\\u9AD8\\u5206\\u8FA8\\u7387\\u7684\\u56FE\\u50CF\\u4F1A\\u5F71\\u54CD\\u6027\\u80FD\\uFF0C\\u56E0\\u4E3A\\u9700\\u8981\\u901A\\u8FC7\\u7F51\\u7EDC\\u53D1\\u9001\\u66F4\\u591A\\u5B57\\u8282\\u3002\"}),`\n`,(0,t.jsxs)(e.p,{children:[\"\\u4E3A\\u4E86\\u514B\\u670D\\u8FD9\\u4E2A\\u95EE\\u9898\\uFF0C\\u6211\\u4EEC\\u53EF\\u4EE5\\u4F7F\\u7528 HTML5 \\u4E2D\\u6307\\u5B9A\\u7684\\u54CD\\u5E94\\u5F0F\\u56FE\\u50CF\\u3002\\u5B83\\u8981\\u6C42\\u5411\\u6D4F\\u89C8\\u5668\\u63D0\\u4F9B\\u76F8\\u540C\\u56FE\\u50CF\\u7684\\u4E0D\\u540C\\u5206\\u8FA8\\u7387\\u6587\\u4EF6\\uFF0C\\u5E76\\u8BA9\\u5B83\\u51B3\\u5B9A\\u54EA\\u5F20\\u56FE\\u50CF\\u6700\\u597D\\uFF0C\\u4F7F\\u7528 html \\u5C5E\\u6027 \",(0,t.jsx)(e.code,{children:\"srcset\"}),\" \\u548C\\u53EF\\u9009\\u7684 \",(0,t.jsx)(e.code,{children:\"sizes\"}),\"\\uFF0C\\u4F8B\\u5982\\uFF1A\"]}),`\n`,(0,t.jsx)(e.pre,{children:(0,t.jsx)(e.code,{className:\"language-html\",children:`<div responsive-background-image>\n <img\n src=\"/images/test-1600.jpg\"\n sizes=\"\n (min-width: 768px) 50vw,\n (min-width: 1024px) 66vw,\n 100vw\"\n srcset=\"\n /images/test-400.jpg 400w,\n /images/test-800.jpg 800w,\n /images/test-1200.jpg 1200w\n \" />\n</div>\n`})}),`\n`,(0,t.jsxs)(e.p,{children:[\"\\u91CD\\u8981\\u7684\\u662F\\u8981\\u6CE8\\u610F\\uFF0C\\u4E0D\\u652F\\u6301 HTML5 \\u7684 \",(0,t.jsx)(e.code,{children:\"srcset\"}),\" \\u7684\\u6D4F\\u89C8\\u5668\\uFF08\\u5373 IE11\\uFF09\\u5C06\\u5FFD\\u7565\\u5B83\\u5E76\\u4F7F\\u7528 \",(0,t.jsx)(e.code,{children:\"src\"}),\"\\u3002\\u5982\\u679C\\u6211\\u4EEC\\u771F\\u7684\\u9700\\u8981\\u652F\\u6301 IE11 \\u5E76\\u4E14\\u51FA\\u4E8E\\u6027\\u80FD\\u539F\\u56E0\\u5E0C\\u671B\\u63D0\\u4F9B\\u6B64\\u529F\\u80FD\\uFF0C\\u6211\\u4EEC\\u53EF\\u4EE5\\u4F7F\\u7528 JavaScript polyfill\\uFF0C\\u4F8B\\u5982 \",(0,t.jsx)(e.a,{href:\"https://scottjehl.github.io/picturefill/\",children:\"Picturefill\"}),\"\\u3002\"]}),`\n`,(0,t.jsx)(e.p,{children:\"\\u5BF9\\u4E8E\\u56FE\\u6807\\uFF0C\\u5C3D\\u53EF\\u80FD\\u4F7F\\u7528 SVG\\uFF0C\\u56E0\\u4E3A\\u5B83\\u4EEC\\u65E0\\u8BBA\\u5206\\u8FA8\\u7387\\u5982\\u4F55\\u90FD\\u80FD\\u975E\\u5E38\\u6E05\\u6670\\u5730\\u6E32\\u67D3\\u3002\"})]})}function _(n={}){let{wrapper:e}=n.components||{};return e?(0,t.jsx)(e,Object.assign({},n,{children:(0,t.jsx)(o,n)})):o(n)}var M=_;return w(b);})();\n;return Component;"
|
||||
}
|
||||
|
|
@ -21,11 +21,11 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "have-you-played-around-with-the-new-css-flexbox-or-grid-specs",
|
||||
"subtitle": null,
|
||||
"title": "你玩过新的CSS Flexbox或Grid规范吗？",
|
||||
"title": "你玩过新的 CSS Flexbox 或 Grid 规范吗？",
|
||||
"topics": [
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/have-you-played-around-with-the-new-css-flexbox-or-grid-specs/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var d=Object.create;var x=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var b=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var F=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),j=(t,e)=>{for(var o in e)x(t,o,{get:e[o],enumerable:!0})},c=(t,e,o,s)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let r of p(e))!u.call(t,r)&&r!==o&&x(t,r,{get:()=>e[r],enumerable:!(s=m(e,r))||s.enumerable});return t};var _=(t,e,o)=>(o=t!=null?d(b(t)):{},c(e||!t||!t.__esModule?x(o,\"default\",{value:t,enumerable:!0}):o,t)),S=t=>c(x({},\"__esModule\",{value:!0}),t);var a=F((M,i)=>{i.exports=_jsx_runtime});var g={};j(g,{default:()=>C,frontmatter:()=>f});var n=_(a()),f={title:\"\\u4F60\\u73A9\\u8FC7\\u65B0\\u7684CSS Flexbox\\u6216Grid\\u89C4\\u8303\\u5417\\uFF1F\"};function l(t){let e=Object.assign({p:\"p\"},t.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(e.p,{children:\"Flexbox \\u4E3B\\u8981\\u7528\\u4E8E 1 \\u7EF4\\u5E03\\u5C40\\uFF0C\\u800C\\u7F51\\u683C\\u5219\\u7528\\u4E8E 2 \\u7EF4\\u5E03\\u5C40\\u3002\"}),`\n`,(0,n.jsx)(e.p,{children:\"Flexbox \\u89E3\\u51B3\\u4E86 CSS \\u4E2D\\u7684\\u8BB8\\u591A\\u5E38\\u89C1\\u95EE\\u9898\\uFF0C\\u4F8B\\u5982\\u5728\\u5BB9\\u5668\\u5185\\u7684\\u5143\\u7D20\\u5782\\u76F4\\u5207\\u5165\\u3001\\u7C98\\u6EDE\\u811A\\u7B49\\u3002 \\u8457\\u540D\\u7684 CSS \\u6846\\u67B6\\uFF0C\\u4F8B\\u5982 Bootstrap \\u548C Bulma \\u662F\\u57FA\\u4E8E Flexbox\\uFF0C\\u800C Flexbox \\u4ECD\\u7136\\u662F\\u521B\\u5EFA\\u5E03\\u5C40\\u7684\\u7ECF\\u8FC7\\u6D4B\\u8BD5\\u548C\\u9A8C\\u8BC1\\u7684\\u65B9\\u5F0F\\u3002\"}),`\n`,(0,n.jsx)(e.p,{children:\"Grid \\u662F\\u521B\\u5EFA\\u7F51\\u683C\\u5E03\\u5C40\\u7684\\u6700\\u76F4\\u89C2\\u7684\\u65B9\\u6CD5\\uFF0C\\u4F46\\u6D4F\\u89C8\\u5668\\u652F\\u6301\\u76EE\\u524D\\u5E76\\u4E0D\\u5E7F\\u6CDB\\u3002 \\u8BB8\\u591A\\u5E03\\u5C40\\u95EE\\u9898\\u5DF2\\u7ECF\\u53EF\\u4EE5\\u901A\\u8FC7 Flexbox \\u89E3\\u51B3\\uFF0C\\u56E0\\u6B64\\u5E76\\u6CA1\\u6709\\u5BF9 Grid \\u7684\\u5DE8\\u5927\\u9700\\u6C42\\u3002\"})]})}function h(t={}){let{wrapper:e}=t.components||{};return e?(0,n.jsx)(e,Object.assign({},t,{children:(0,n.jsx)(l,t)})):l(t)}var C=h;return S(g);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var d=Object.create;var x=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var b=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var F=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),j=(t,e)=>{for(var o in e)x(t,o,{get:e[o],enumerable:!0})},c=(t,e,o,s)=>{if(e&&typeof e==\"object\"||typeof e==\"function\")for(let r of p(e))!u.call(t,r)&&r!==o&&x(t,r,{get:()=>e[r],enumerable:!(s=m(e,r))||s.enumerable});return t};var _=(t,e,o)=>(o=t!=null?d(b(t)):{},c(e||!t||!t.__esModule?x(o,\"default\",{value:t,enumerable:!0}):o,t)),S=t=>c(x({},\"__esModule\",{value:!0}),t);var a=F((M,i)=>{i.exports=_jsx_runtime});var g={};j(g,{default:()=>C,frontmatter:()=>f});var n=_(a()),f={title:\"\\u4F60\\u73A9\\u8FC7\\u65B0\\u7684 CSS Flexbox \\u6216 Grid \\u89C4\\u8303\\u5417\\uFF1F\"};function l(t){let e=Object.assign({p:\"p\"},t.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(e.p,{children:\"Flexbox \\u4E3B\\u8981\\u7528\\u4E8E\\u4E00\\u7EF4\\u5E03\\u5C40\\uFF0C\\u800C Grid \\u7528\\u4E8E\\u4E8C\\u7EF4\\u5E03\\u5C40\\u3002\"}),`\n`,(0,n.jsx)(e.p,{children:\"Flexbox \\u89E3\\u51B3\\u4E86 CSS \\u4E2D\\u7684\\u8BB8\\u591A\\u5E38\\u89C1\\u95EE\\u9898\\uFF0C\\u4F8B\\u5982\\u5728\\u5BB9\\u5668\\u5185\\u5782\\u76F4\\u5C45\\u4E2D\\u5143\\u7D20\\u3001\\u7C98\\u6027\\u9875\\u811A\\u7B49\\u3002 \\u8457\\u540D\\u7684 CSS \\u6846\\u67B6\\uFF0C\\u5982 Bootstrap \\u548C Bulma \\u90FD\\u57FA\\u4E8E Flexbox\\uFF0CFlexbox \\u4ECD\\u7136\\u662F\\u521B\\u5EFA\\u5E03\\u5C40\\u7684\\u7ECF\\u8FC7\\u6D4B\\u8BD5\\u548C\\u9A8C\\u8BC1\\u7684\\u65B9\\u6CD5\\u3002\"}),`\n`,(0,n.jsx)(e.p,{children:\"\\u5230\\u76EE\\u524D\\u4E3A\\u6B62\\uFF0CGrid \\u662F\\u521B\\u5EFA\\u57FA\\u4E8E\\u7F51\\u683C\\u7684\\u5E03\\u5C40\\u6700\\u76F4\\u89C2\\u7684\\u65B9\\u6CD5\\uFF0C\\u4F46\\u76EE\\u524D\\u6D4F\\u89C8\\u5668\\u652F\\u6301\\u8303\\u56F4\\u5E76\\u4E0D\\u5E7F\\u6CDB\\u3002 \\u8BB8\\u591A\\u5E03\\u5C40\\u95EE\\u9898\\u5DF2\\u7ECF\\u53EF\\u4EE5\\u7528 Flexbox \\u89E3\\u51B3\\uFF0C\\u56E0\\u6B64\\u5BF9 Grid \\u7684\\u9700\\u6C42\\u5E76\\u4E0D\\u5927\\u3002\"})]})}function h(t={}){let{wrapper:e}=t.components||{};return e?(0,n.jsx)(e,Object.assign({},t,{children:(0,n.jsx)(l,t)})):l(t)}var C=h;return S(g);})();\n;return Component;"
|
||||
}
|
||||
|
|
@ -21,11 +21,11 @@
|
|||
"similarQuestions": [],
|
||||
"slug": "have-you-used-or-implemented-media-queries-or-mobile-specific-layouts-css",
|
||||
"subtitle": null,
|
||||
"title": "你是否使用或配置过媒体查询或移动端专用布局/CSS？",
|
||||
"title": "你是否使用或实现了媒体查询或移动设备特定的布局/CSS？",
|
||||
"topics": [
|
||||
"css"
|
||||
],
|
||||
"gitHubEditUrl": "https://github.com/yangshun/front-end-interview-handbook/blob/main/packages/quiz/questions/have-you-used-or-implemented-media-queries-or-mobile-specific-layouts-css/zh-CN.mdx"
|
||||
},
|
||||
"solution": "var Component=(()=>{var x=Object.create;var r=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var j=Object.getPrototypeOf,_=Object.prototype.hasOwnProperty;var d=(t,n)=>()=>(n||t((n={exports:{}}).exports,n),n.exports),l=(t,n)=>{for(var e in n)r(t,e,{get:n[e],enumerable:!0})},i=(t,n,e,s)=>{if(n&&typeof n==\"object\"||typeof n==\"function\")for(let o of f(n))!_.call(t,o)&&o!==e&&r(t,o,{get:()=>n[o],enumerable:!(s=p(n,o))||s.enumerable});return t};var C=(t,n,e)=>(e=t!=null?x(j(t)):{},i(n||!t||!t.__esModule?r(e,\"default\",{value:t,enumerable:!0}):e,t)),M=t=>i(r({},\"__esModule\",{value:!0}),t);var m=d((S,a)=>{a.exports=_jsx_runtime});var D={};l(D,{default:()=>h,frontmatter:()=>b});var c=C(m()),b={title:\"\\u4F60\\u662F\\u5426\\u4F7F\\u7528\\u6216\\u914D\\u7F6E\\u8FC7\\u5A92\\u4F53\\u67E5\\u8BE2\\u6216\\u79FB\\u52A8\\u7AEF\\u4E13\\u7528\\u5E03\\u5C40/CSS\\uFF1F\"};function u(t){let n=Object.assign({p:\"p\"},t.components);return(0,c.jsx)(n.p,{children:\"\\u4E00\\u4E2A\\u4F8B\\u5B50\\u662F\\uFF0C\\u5728\\u67D0\\u4E2A\\u65AD\\u70B9\\u4E4B\\u540E\\uFF0C\\u5C06\\u4E00\\u4E2A\\u5806\\u53E0\\u7684\\u80F6\\u56CA\\u5BFC\\u822A\\u8F6C\\u53D8\\u4E3A\\u56FA\\u5B9A\\u5E95\\u90E8\\u7684\\u6807\\u7B7E\\u5BFC\\u822A\\u3002\"})}function g(t={}){let{wrapper:n}=t.components||{};return n?(0,c.jsx)(n,Object.assign({},t,{children:(0,c.jsx)(u,t)})):u(t)}var h=g;return M(D);})();\n;return Component;"
|
||||
"solution": "var Component=(()=>{var x=Object.create;var r=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var j=Object.getPrototypeOf,_=Object.prototype.hasOwnProperty;var d=(t,n)=>()=>(n||t((n={exports:{}}).exports,n),n.exports),l=(t,n)=>{for(var e in n)r(t,e,{get:n[e],enumerable:!0})},i=(t,n,e,s)=>{if(n&&typeof n==\"object\"||typeof n==\"function\")for(let o of f(n))!_.call(t,o)&&o!==e&&r(t,o,{get:()=>n[o],enumerable:!(s=p(n,o))||s.enumerable});return t};var C=(t,n,e)=>(e=t!=null?x(j(t)):{},i(n||!t||!t.__esModule?r(e,\"default\",{value:t,enumerable:!0}):e,t)),M=t=>i(r({},\"__esModule\",{value:!0}),t);var m=d((S,a)=>{a.exports=_jsx_runtime});var D={};l(D,{default:()=>h,frontmatter:()=>b});var c=C(m()),b={title:\"\\u4F60\\u662F\\u5426\\u4F7F\\u7528\\u6216\\u5B9E\\u73B0\\u4E86\\u5A92\\u4F53\\u67E5\\u8BE2\\u6216\\u79FB\\u52A8\\u8BBE\\u5907\\u7279\\u5B9A\\u7684\\u5E03\\u5C40/CSS\\uFF1F\"};function u(t){let n=Object.assign({p:\"p\"},t.components);return(0,c.jsx)(n.p,{children:\"\\u4E00\\u4E2A\\u4F8B\\u5B50\\u662F\\u5C06\\u5806\\u53E0\\u7684\\u836F\\u4E38\\u5BFC\\u822A\\u8F6C\\u6362\\u4E3A\\u8D85\\u8FC7\\u67D0\\u4E2A\\u65AD\\u70B9\\u7684\\u56FA\\u5B9A\\u5E95\\u90E8\\u6807\\u7B7E\\u5BFC\\u822A\\u3002\"})}function g(t={}){let{wrapper:n}=t.components||{};return n?(0,c.jsx)(n,Object.assign({},t,{children:(0,c.jsx)(u,t)})):u(t)}var h=g;return M(D);})();\n;return Component;"
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
31
apps/web/src/__generated__/questions/quiz/how-can-you-avoid-problems-related-to-hoisting/zh-CN.json
generated
Normal file
31
apps/web/src/__generated__/questions/quiz/how-can-you-avoid-problems-related-to-hoisting/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
31
apps/web/src/__generated__/questions/quiz/how-can-you-create-custom-error-objects/zh-CN.json
generated
Normal file
31
apps/web/src/__generated__/questions/quiz/how-can-you-create-custom-error-objects/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
32
apps/web/src/__generated__/questions/quiz/how-can-you-prevent-clickjacking-attacks/zh-CN.json
generated
Normal file
32
apps/web/src/__generated__/questions/quiz/how-can-you-prevent-clickjacking-attacks/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
33
apps/web/src/__generated__/questions/quiz/how-do-iframe-on-a-page-communicate/zh-CN.json
generated
Normal file
33
apps/web/src/__generated__/questions/quiz/how-do-iframe-on-a-page-communicate/zh-CN.json
generated
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue