{"id":24541,"date":"2023-07-01T11:47:33","date_gmt":"2023-07-01T02:47:33","guid":{"rendered":"http:\/\/nori.company\/?p=24541"},"modified":"2023-07-01T11:47:33","modified_gmt":"2023-07-01T02:47:33","slug":"%eb%af%b8%eb%9e%98%ec%9d%98-css-state-container-queries","status":"publish","type":"post","link":"https:\/\/nori.company\/?p=24541","title":{"rendered":"\ubbf8\ub798\uc758 CSS: State Container Queries"},"content":{"rendered":"<ul>\n<li>\ud06c\ub85c\ubbf8\uc6c0 \ud300\uc774 \uc0c8\ub85c\uc6b4 \ud0c0\uc785\uc758 \ucffc\ub9ac\ub97c \uc2e4\ud5d8\uc911<\/li>\n<li>\uc791\ub144\uc5d4 Size Container Query\uac00 \uba54\uc774\uc800 \ube0c\ub77c\uc6b0\uc800\ub4e4\uc5d0\uc11c \ubaa8\ub450 \uc9c0\uc6d0 \uc2dc\uc791\n<ul>\n<li>\ucee8\ud14c\uc774\ub108\uc758 \ub108\ube44 \uae30\uc900\uc73c\ub85c \ucffc\ub9ac \uac00\ub2a5<\/li>\n<\/ul>\n<\/li>\n<li>\uc5ec\uae30\uc5d0 \ucd94\uac00\ub85c \uc774\uc81c Style \ucffc\ub9ac\ub3c4 \uac00\ub2a5 : \ud2b9\uc815 CSS \ubcc0\uc218\uac00 \uc788\ub294\uc9c0 \ud655\uc778. \uc544\uc9c1 \ud06c\ub86c \uce74\ub098\ub9ac\uc5d0\uc11c\ub9cc \uac00\ub2a5<\/li>\n<li>&#8230;\n<p>\ucd9c\ucc98 : <a href=\"https:\/\/news.hada.io\/topic?id=9566\" target=\"_blank\" rel=\"noopener\">GeekNews &#8211; \uac1c\ubc1c\/\uae30\uc220\/\uc2a4\ud0c0\ud2b8\uc5c5 \ub274\uc2a4 \uc11c\ube44\uc2a4 <\/a>\n<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>\ud06c\ub85c\ubbf8\uc6c0 \ud300\uc774 \uc0c8\ub85c\uc6b4 \ud0c0\uc785\uc758 \ucffc\ub9ac\ub97c \uc2e4\ud5d8\uc911 \uc791\ub144\uc5d4 Size Container Query\uac00 \uba54\uc774\uc800 \ube0c\ub77c\uc6b0\uc800\ub4e4\uc5d0\uc11c \ubaa8\ub450 \uc9c0\uc6d0 \uc2dc\uc791 \ucee8\ud14c\uc774\ub108\uc758 \ub108\ube44 \uae30\uc900\uc73c\ub85c \ucffc\ub9ac \uac00\ub2a5&hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[138],"tags":[163],"class_list":["post-24541","post","type-post","status-publish","format-standard","hentry","category-it","tag-geeknews-----"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/pa3PO4-6nP","jetpack-related-posts":[{"id":30332,"url":"https:\/\/nori.company\/?p=30332","url_meta":{"origin":24541,"position":0},"title":"Screenshot-To-Code &#8211; GPT-4V\ub85c \ud654\uba74 \ucea1\uccd0\ub97c \ucf54\ub4dc\ub85c \ubcc0\ud658\ud558\uae30","author":"\ub178\ub9ac\ucef4\ud37c\ub2c8","date":"2023\ub144 11\uc6d4 19\uc77c","format":false,"excerpt":"GPT-4 Vision \uc744 \uc774\uc6a9\ud574\uc11c \ud654\uba74 \uc2a4\ud06c\ub9b0\uc0f7\uc744 HTML\/Tailwind CSS \ucf54\ub4dc\ub85c \ubcc0\ud658 \ud654\uba74\uc5d0 \uc774\ubbf8\uc9c0\ub294 DALL-E 3 \ub97c \uc774\uc6a9\ud574\uc11c \ube44\uc2b7\ud558\uac8c \ubcf4\uc774\ub294 \uc774\ubbf8\uc9c0\ub97c \uc0dd\uc131\ud574\uc11c \ub300\uccb4 \uac00\ub2a5 \ucd94\uac00 \ud504\ub86c\ud504\ud2b8\ub97c \uc785\ub825\ud574\uc11c \uc6d0\ud558\ub294 \ub300\ub85c \uc0dd\uc131\ub418\ub294 \ucf54\ub4dc\ub97c \uc218\uc815 \uac00\ub2a5 React\/Vite \ud504\ub860\ud2b8\uc5d4\ub4dc + FastAPI \ubc31\uc5d4\ub4dc ... \ucd9c\ucc98 : GeekNews - \uac1c\ubc1c\/\uae30\uc220\/\uc2a4\ud0c0\ud2b8\uc5c5 \ub274\uc2a4 \uc11c\ube44\uc2a4","rel":"","context":"&quot;IT&quot;\uc5d0\uc11c","block_context":{"text":"IT","link":"https:\/\/nori.company\/?cat=138"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":26600,"url":"https:\/\/nori.company\/?p=26600","url_meta":{"origin":24541,"position":1},"title":"Lightning CSS &#8211; Rust\ub85c \uc791\uc131\ub41c \ucd08\uace0\uc18d CSS \ud30c\uc11c","author":"\ub178\ub9ac\ucef4\ud37c\ub2c8","date":"2023\ub144 8\uc6d4 24\uc77c","format":false,"excerpt":"Parcel \uacfc \ud568\uaed8 \uc0ac\uc6a9\ud558\uae30 \uc704\ud574 \ub9cc\ub4e0 \ucd08\uace0\uc18d CSS \ud30c\uc11c\/\ud2b8\ub79c\uc2a4\ud3ec\uba38\/\ubc88\ub4e4\ub7ec\/\ubbf8\ub2c8\ud30c\uc774\uc5b4 CSSNano \uc5d0 \ube44\ud574\uc11c 100\ubc30 \uc774\uc0c1, ESBuild \ubcf4\ub2e4 4\ubc30 \uc774\uc0c1 \ube60\ub984 \uc2a4\ud0e0\ub4dc\uc5bc\ub860 \ub77c\uc774\ube0c\ub7ec\ub9ac, CLI, \ub610\ub294 \ub2e4\ub978 \ub3c4\uad6c\uc758 \ud50c\ub7ec\uadf8\uc778\uc73c\ub85c \uc0ac\uc6a9 \uac00\ub2a5 \ub2e4\ub978 \ub3c4\uad6c\ub4e4\uacfc \ub2ec\ub9ac \uc18d\uc131 \ubc38\ub958\ub97c CSS \uc2a4\ud399\uc758 \ubb38\ubc95... \ucd9c\ucc98 : GeekNews - \uac1c\ubc1c\/\uae30\uc220\/\uc2a4\ud0c0\ud2b8\uc5c5 \ub274\uc2a4 \uc11c\ube44\uc2a4","rel":"","context":"&quot;IT&quot;\uc5d0\uc11c","block_context":{"text":"IT","link":"https:\/\/nori.company\/?cat=138"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":25452,"url":"https:\/\/nori.company\/?p=25452","url_meta":{"origin":24541,"position":2},"title":"Octos &#8211; HTML Live Wallpaper Engine","author":"\ub178\ub9ac\ucef4\ud37c\ub2c8","date":"2023\ub144 7\uc6d4 28\uc77c","format":false,"excerpt":"HTML, CSS, JS\ub85c \ub9cc\ub4e0 Windows\uc6a9 \uc778\ud130\ub799\ud2f0\ube0c \uc6d4\ud398\uc774\ud37c \uc5d4\uc9c4 API\ub97c \uc774\uc6a9\ud558\uc5ec \uc790\uc2e0\ub9cc\uc758 \uc6d4\ud398\uc774\ud37c \uc0dd\uc131 \uac00\ub2a5 \ub9c8\uc6b0\uc2a4\/\ud0a4\ubcf4\ub4dc \uc9c0\uc6d0 \ubbf8\ub514\uc5b4 \ud50c\ub808\uc774\ubc31 \ucee8\ud2b8\ub864 \uc9c0\uc6d0 ... \ucd9c\ucc98 : GeekNews - \uac1c\ubc1c\/\uae30\uc220\/\uc2a4\ud0c0\ud2b8\uc5c5 \ub274\uc2a4 \uc11c\ube44\uc2a4","rel":"","context":"&quot;IT&quot;\uc5d0\uc11c","block_context":{"text":"IT","link":"https:\/\/nori.company\/?cat=138"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":22775,"url":"https:\/\/nori.company\/?p=22775","url_meta":{"origin":24541,"position":3},"title":"Bullet Train &#8211; Ruby on Rails \uae30\ubc18 SaaS Framework","author":"\ub178\ub9ac\ucef4\ud37c\ub2c8","date":"2023\ub144 4\uc6d4 28\uc77c","format":false,"excerpt":"MIT \ub77c\uc774\uc13c\uc2a4 \uc624\ud508\uc18c\uc2a4 \ucc28\uc138\ub300 Scaffolding : \uc790\uc2e0\ub9cc\uc758 \ud544\ub4dc \ucd94\uac00 \uac00\ub2a5 \uc0ac\uc6a9\uc790 \uc778\uc99d, Role, \ud300\/\uba64\ubc84\uc27d \ubc0f \ucd08\ub300 Tailwind CSS \ud14c\ub9c8 REST API \uc81c\uacf5 Outgoing Webhook ... \ucd9c\ucc98 : GeekNews - \uac1c\ubc1c\/\uae30\uc220\/\uc2a4\ud0c0\ud2b8\uc5c5 \ub274\uc2a4 \uc11c\ube44\uc2a4","rel":"","context":"&quot;IT&quot;\uc5d0\uc11c","block_context":{"text":"IT","link":"https:\/\/nori.company\/?cat=138"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":27878,"url":"https:\/\/nori.company\/?p=27878","url_meta":{"origin":24541,"position":4},"title":"Safari 17.0\uc758 WebKit \uae30\ub2a5\ub4e4","author":"\ub178\ub9ac\ucef4\ud37c\ub2c8","date":"2023\ub144 9\uc6d4 22\uc77c","format":false,"excerpt":"iOS\/iPadOS 17\uc5d0 \ud3ec\ud568\ub41c \uc0ac\ud30c\ub9ac 17.0\uc758 \uae30\ub2a5\ub4e4 HTML \uc0c8\ub85c\uc6b4 <search> \uc5d8\ub9ac\uba3c\ud2b8 popover \uc18d\uc131 \uc9c0\uc6d0 \ucd94\uac00 auto\/manual <select> \ub0b4\ubd80\uc5d0\uc11c <hr> \ub85c \uad6c\ubd84\uc790 \uac00\ub2a5 CSS fon... \ucd9c\ucc98 : GeekNews - \uac1c\ubc1c\/\uae30\uc220\/\uc2a4\ud0c0\ud2b8\uc5c5 \ub274\uc2a4 \uc11c\ube44\uc2a4","rel":"","context":"&quot;IT&quot;\uc5d0\uc11c","block_context":{"text":"IT","link":"https:\/\/nori.company\/?cat=138"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":24553,"url":"https:\/\/nori.company\/?p=24553","url_meta":{"origin":24541,"position":5},"title":"Chalk.ist &#8211; \uc608\uc05c \uc18c\uc2a4 \ucf54\ub4dc \uc774\ubbf8\uc9c0 \ub9cc\ub4e4\uae30","author":"\ub178\ub9ac\ucef4\ud37c\ub2c8","date":"2023\ub144 7\uc6d4 2\uc77c","format":false,"excerpt":"\uc18c\uc2a4\ucf54\ub4dc\ub97c \ubc30\uacbd\/\uc708\ub3c4\uc6b0\uc640 \ud568\uaed8 \uc774\ubbf8\uc9c0\ub85c \ub9cc\ub4e4\uc5b4\uc8fc\ub294 \uc0ac\uc774\ud2b8 \ub77c\uc778\ub118\ubc84, \ubc30\uacbd, \ub9ac\ud50c\ub809\uc158, \ud328\ub529 \ub4f1 \uc124\uc815 \ud2b8\uc704\ud130 ID \ubc43\uc9c0 \ucd94\uac00 \uac00\ub2a5 TypeScript, JavaScript, Go, Python, PHP, C#, JSON, YAML, HTML, Markdown, CSS, Bash \ub4f1 \uc9c0\uc6d0 ... \ucd9c\ucc98 : GeekNews - \uac1c\ubc1c\/\uae30\uc220\/\uc2a4\ud0c0\ud2b8\uc5c5 \ub274\uc2a4 \uc11c\ube44\uc2a4","rel":"","context":"&quot;IT&quot;\uc5d0\uc11c","block_context":{"text":"IT","link":"https:\/\/nori.company\/?cat=138"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/nori.company\/index.php?rest_route=\/wp\/v2\/posts\/24541","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nori.company\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nori.company\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nori.company\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nori.company\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=24541"}],"version-history":[{"count":1,"href":"https:\/\/nori.company\/index.php?rest_route=\/wp\/v2\/posts\/24541\/revisions"}],"predecessor-version":[{"id":24542,"href":"https:\/\/nori.company\/index.php?rest_route=\/wp\/v2\/posts\/24541\/revisions\/24542"}],"wp:attachment":[{"href":"https:\/\/nori.company\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=24541"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nori.company\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=24541"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nori.company\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=24541"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}