{"id":4367,"date":"2026-03-26T15:59:14","date_gmt":"2026-03-26T08:59:14","guid":{"rendered":"https:\/\/wpdesign.vn\/css-kiem-soat-hien-thi-overflow-clipping-va-masking\/"},"modified":"2026-05-04T15:00:05","modified_gmt":"2026-05-04T08:00:05","slug":"css-kiem-soat-hien-thi-overflow-clipping-va-masking","status":"publish","type":"post","link":"https:\/\/wpdesign.vn\/vi\/css-kiem-soat-hien-thi-overflow-clipping-va-masking\/","title":{"rendered":"CSS: Ki\u1ec3m So\u00e1t Hi\u1ec3n Th\u1ecb Overflow, Clipping V\u00e0 Masking"},"content":{"rendered":"\n

Trong ki\u1ebfn tr\u00fac giao di\u1ec7n hi\u1ec7n \u0111\u1ea1i, vi\u1ec7c qu\u1ea3n l\u00fd ph\u1ea7n n\u1ed9i dung v\u01b0\u1ee3t ra ngo\u00e0i gi\u1edbi h\u1ea1n c\u1ee7a ph\u1ea7n t\u1eed kh\u00f4ng ch\u1ec9 \u0111\u01a1n thu\u1ea7n l\u00e0 \u1ea9n \u0111i c\u00e1c th\u00e0nh ph\u1ea7n th\u1eeba. \u0110\u00f3 l\u00e0 s\u1ef1 c\u00e2n b\u1eb1ng gi\u1eefa Layout Logic<\/strong>, Rendering Performance<\/strong> v\u00e0 Visual Effects<\/strong>. B\u00e0i vi\u1ebft n\u00e0y s\u1ebd ph\u00e2n t\u00edch chuy\u00ean s\u00e2u b\u1ed1n c\u01a1 ch\u1ebf c\u1ed1t l\u00f5i: overflow: hidden<\/code>, overflow: clip<\/code>, clip-path<\/code> v\u00e0 mask<\/code>, nh\u1eb1m x\u00e1c \u0111\u1ecbnh ranh gi\u1edbi gi\u1eefa ch\u00fang trong pipeline hi\u1ec3n th\u1ecb c\u1ee7a tr\u00ecnh duy\u1ec7t. <\/p>\n\n

1. B\u1ea3n ch\u1ea5t c\u1ee7a Clipping trong Rendering Pipeline<\/h4>\n\n

Tr\u01b0\u1edbc khi \u0111i v\u00e0o c\u00fa ph\u00e1p, ch\u00fang ta c\u1ea7n hi\u1ec3u v\u1ecb tr\u00ed c\u1ee7a c\u00e1c thu\u1ed9c t\u00ednh n\u00e0y trong qu\u00e1 tr\u00ecnh tr\u00ecnh duy\u1ec7t chuy\u1ec3n \u0111\u1ed5i m\u00e3 ngu\u1ed3n th\u00e0nh \u0111i\u1ec3m \u1ea3nh (pixels).<\/p>\n\n

    \n
  • Layout Stage:<\/strong> overflow: hidden<\/code> \u1ea3nh h\u01b0\u1edfng tr\u1ef1c ti\u1ebfp \u0111\u1ebfn vi\u1ec7c h\u00ecnh th\u00e0nh m\u1ed9t Scroll Container<\/em> v\u00e0 Block Formatting Context (BFC)<\/em>.<\/li>\n\n\n\n
  • Paint Stage:<\/strong> clip-path<\/code> ho\u1ea1t \u0111\u1ed9ng ch\u1ee7 y\u1ebfu \u1edf giai \u0111o\u1ea1n n\u00e0y, x\u00e1c \u0111\u1ecbnh v\u00f9ng h\u00ecnh h\u1ecdc (geometry) n\u00e0o c\u1ee7a ph\u1ea7n t\u1eed s\u1ebd \u0111\u01b0\u1ee3c \u0111\u1ed5 m\u00e0u.<\/li>\n\n\n\n
  • Compositing Stage:<\/strong> mask<\/code> th\u01b0\u1eddng can thi\u1ec7p \u1edf t\u1ea7ng cu\u1ed1i c\u00f9ng, n\u01a1i tr\u00ecnh duy\u1ec7t k\u1ebft h\u1ee3p c\u00e1c l\u1edbp (layers) d\u1ef1a tr\u00ean gi\u00e1 tr\u1ecb Alpha ho\u1eb7c Luminance.<\/li>\n<\/ul>\n\n

    Vi\u1ec7c ch\u1ecdn sai c\u00f4ng c\u1ee5 kh\u00f4ng ch\u1ec9 g\u00e2y l\u00e3ng ph\u00ed t\u00e0i nguy\u00ean GPU m\u00e0 c\u00f2n c\u00f3 th\u1ec3 ph\u00e1 v\u1ee1 logic cu\u1ed9n (scrolling) c\u1ee7a h\u1ec7 th\u1ed1ng.<\/p>\n\n

    2. Overflow: Hidden \u2013 C\u01a1 ch\u1ebf “C\u1eaft” truy\u1ec1n th\u1ed1ng<\/h4>\n\n

    overflow: hidden<\/code> l\u00e0 gi\u1ea3i ph\u00e1p kinh \u0111i\u1ec3n nh\u1ea5t, nh\u01b0ng th\u01b0\u1eddng b\u1ecb hi\u1ec3u nh\u1ea7m l\u00e0 ch\u1ec9 \u0111\u1ec3 \u1ea9n n\u1ed9i dung.<\/p>\n\n

    2.1. C\u01a1 ch\u1ebf t\u1ea1o l\u1eadp BFC<\/h6>\n\n

    \u0110i\u1ec3m quan tr\u1ecdng nh\u1ea5t c\u1ee7a hidden<\/code> kh\u00f4ng n\u1eb1m \u1edf vi\u1ec7c \u1ea9n n\u1ed9i dung, m\u00e0 l\u00e0 vi\u1ec7c n\u00f3 t\u1ea1o ra m\u1ed9t Block Formatting Context (BFC)<\/strong>. \u0110i\u1ec1u n\u00e0y gi\u00fap: <\/p>\n\n

      \n
    • Ng\u0103n ch\u1eb7n t\u00ecnh tr\u1ea1ng Margin Collapse (g\u1ed9p l\u1ec1).<\/li>\n\n\n\n
    • Ch\u1ee9a \u0111\u01b0\u1ee3c c\u00e1c ph\u1ea7n t\u1eed con \u0111ang \u1edf tr\u1ea1ng th\u00e1i float<\/code>.<\/li>\n\n\n\n
    • X\u00e1c \u0111\u1ecbnh l\u1ea1i ranh gi\u1edbi c\u1ee7a ph\u1ea7n t\u1eed \u0111\u1ed1i v\u1edbi c\u00e1c ph\u1ea7n t\u1eed xung quanh.<\/li>\n<\/ul>\n\n
      2.2. Kh\u1ea3 n\u0103ng cu\u1ed9n ng\u1ea7m (Programmatic Scrolling)<\/h6>\n\n

      D\u00f9 t\u00ean l\u00e0 “hidden”, nh\u01b0ng v\u1ec1 m\u1eb7t k\u1ef9 thu\u1eadt, ph\u1ea7n t\u1eed v\u1eabn l\u00e0 m\u1ed9t Scroll Container<\/strong>. Ng\u01b0\u1eddi d\u00f9ng kh\u00f4ng th\u1ec3 d\u00f9ng thanh cu\u1ed9n, nh\u01b0ng JavaScript v\u1eabn c\u00f3 th\u1ec3 can thi\u1ec7p v\u00e0o thu\u1ed9c t\u00ednh scrollTop<\/code> ho\u1eb7c scrollLeft<\/code>. \u0110\u00e2y l\u00e0 k\u1ebd h\u1edf v\u1ec1 hi\u1ec7u n\u0103ng n\u1ebfu b\u1ea1n ch\u1ec9 mu\u1ed1n c\u1eaft \u1ea3nh m\u00e0 kh\u00f4ng c\u1ea7n t\u00ednh n\u0103ng cu\u1ed9n. <\/p>\n\n

      3. Overflow: Clip \u2013 B\u01b0\u1edbc ti\u1ebfn v\u1ec1 hi\u1ec7u n\u0103ng Layout<\/h4>\n\n

      \u0110\u01b0\u1ee3c gi\u1edbi thi\u1ec7u trong CSS Overflow Module Level 3, overflow: clip<\/code> l\u00e0 phi\u00ean b\u1ea3n “tinh g\u1ecdn” c\u1ee7a hidden<\/code>.<\/p>\n\n

      3.1. S\u1ef1 kh\u00e1c bi\u1ec7t v\u1ec1 Scroll Container<\/h6>\n\n

      Kh\u00e1c v\u1edbi hidden<\/code>, overflow: clip<\/code> kh\u00f4ng<\/strong> t\u1ea1o ra scroll container. N\u00f3 tri\u1ec7t ti\u00eau ho\u00e0n to\u00e0n kh\u1ea3 n\u0103ng cu\u1ed9n, k\u1ec3 c\u1ea3 b\u1eb1ng JavaScript. \u0110i\u1ec1u n\u00e0y cho ph\u00e9p tr\u00ecnh duy\u1ec7t b\u1ecf qua c\u00e1c t\u00ednh to\u00e1n li\u00ean quan \u0111\u1ebfn v\u00f9ng ch\u1ee9a cu\u1ed9n, gi\u00fap t\u1ed1i \u01b0u h\u00f3a b\u1ed9 nh\u1edb. <\/p>\n\n

      3.2. K\u1ebft h\u1ee3p v\u1edbi overflow-clip-margin<\/code><\/h6>\n\n

      M\u1ed9t \u01b0u \u0111i\u1ec3m v\u01b0\u1ee3t tr\u1ed9i c\u1ee7a clip<\/code> l\u00e0 thu\u1ed9c t\u00ednh \u0111i k\u00e8m overflow-clip-margin<\/code>. B\u1ea1n c\u00f3 th\u1ec3 ch\u1ec9 \u0111\u1ecbnh n\u1ed9i dung \u0111\u01b0\u1ee3c ph\u00e9p tr\u00e0n ra ngo\u00e0i bao nhi\u00eau pixels tr\u01b0\u1edbc khi th\u1ef1c s\u1ef1 b\u1ecb c\u1eaft. \u0110i\u1ec1u n\u00e0y c\u1ef1c k\u1ef3 h\u1eefu \u00edch cho c\u00e1c hi\u1ec7u \u1ee9ng \u0111\u1ed5 b\u00f3ng (box-shadow) ho\u1eb7c c\u00e1c ph\u1ea7n t\u1eed trang tr\u00ed nh\u1ecf \u1edf r\u00eca. <\/p>\n\n

      4. Clip-path: \u0110\u1ecbnh h\u00ecnh b\u1eb1ng H\u00ecnh h\u1ecdc (Geometry)<\/h4>\n\n

      N\u1ebfu overflow<\/code> gi\u1edbi h\u1ea1n trong khung h\u00ecnh ch\u1eef nh\u1eadt, th\u00ec clip-path<\/code> gi\u1ea3i ph\u00f3ng ph\u1ea7n t\u1eed kh\u1ecfi c\u00e1c kh\u1ed1i h\u1ed9p (box-model) truy\u1ec1n th\u1ed1ng.<\/p>\n\n

      4.1. C\u00e1c d\u1ea1ng Vector Shape<\/h6>\n\n
        \n
      • Basic Shapes:<\/strong> circle()<\/code>, ellipse()<\/code>, inset()<\/code>, polygon()<\/code>.<\/li>\n\n\n\n
      • SVG Source:<\/strong> S\u1eed d\u1ee5ng url(#id)<\/code> \u0111\u1ec3 l\u1ea5y c\u00e1c \u0111\u01b0\u1eddng d\u1eabn (path) ph\u1ee9c t\u1ea1p t\u1eeb SVG. \u0110i\u1ec1u n\u00e0y cho ph\u00e9p ch\u00fang ta t\u1ea1o ra c\u00e1c giao di\u1ec7n kh\u00f4ng quy t\u1eafc (non-rectangular UI). <\/li>\n<\/ul>\n\n
        4.2. Hi\u1ec7u n\u0103ng v\u00e0 T\u0103ng t\u1ed1c ph\u1ea7n c\u1ee9ng<\/h6>\n\n

        clip-path<\/code> th\u01b0\u1eddng \u0111\u01b0\u1ee3c x\u1eed l\u00fd \u1edf t\u1ea7ng Paint. Tuy nhi\u00ean, khi k\u1ebft h\u1ee3p v\u1edbi transition<\/code> ho\u1eb7c animation<\/code>, n\u1ebfu c\u00e1c shape c\u00f3 c\u00f9ng s\u1ed1 l\u01b0\u1ee3ng \u0111i\u1ec3m n\u00fat (anchor points), tr\u00ecnh duy\u1ec7t c\u00f3 th\u1ec3 th\u1ef1c hi\u1ec7n n\u1ed9i suy (interpolation) m\u01b0\u1ee3t m\u00e0 tr\u00ean GPU. <\/p>\n\n

        4.3. Gi\u1edbi h\u1ea1n v\u1ec1 t\u01b0\u01a1ng t\u00e1c<\/h6>\n\n

        C\u1ea7n l\u01b0u \u00fd: V\u00f9ng b\u1ecb c\u1eaft b\u1edfi clip-path<\/code> s\u1ebd kh\u00f4ng nh\u1eadn s\u1ef1 ki\u1ec7n chu\u1ed9t (pointer events). \u0110i\u1ec1u n\u00e0y kh\u00e1c ho\u00e0n to\u00e0n v\u1edbi vi\u1ec7c d\u00f9ng opacity: 0<\/code> hay visibility: hidden<\/code>. <\/p>\n\n

        5. CSS Masking: Ngh\u1ec7 thu\u1eadt c\u1ee7a s\u1ef1 trong su\u1ed1t (Alpha Channel)<\/h4>\n\n

        mask<\/code> l\u00e0 k\u1ef9 thu\u1eadt cao c\u1ea5p nh\u1ea5t, cho ph\u00e9p can thi\u1ec7p v\u00e0o \u0111\u1ed9 hi\u1ec3n th\u1ecb c\u1ee7a t\u1eebng pixel d\u1ef1a tr\u00ean m\u1ed9t h\u00ecnh \u1ea3nh m\u1eb7t n\u1ea1.<\/p>\n\n

        5.1. C\u01a1 ch\u1ebf Mask-image<\/h6>\n\n

        Thay v\u00ec c\u1eaft theo \u0111\u01b0\u1eddng bi\u00ean c\u1ee9ng (hard edge) nh\u01b0 clip-path<\/code>, mask<\/code> s\u1eed d\u1ee5ng:<\/p>\n\n

          \n
        • Alpha Masking:<\/strong> V\u00f9ng n\u00e0o c\u1ee7a \u1ea3nh m\u1eb7t n\u1ea1 trong su\u1ed1t, ph\u1ea7n t\u1eed s\u1ebd \u1ea9n \u0111i. V\u00f9ng n\u00e0o \u0111\u1ee5c, ph\u1ea7n t\u1eed s\u1ebd hi\u1ec3n th\u1ecb. <\/li>\n\n\n\n
        • Luminance Masking:<\/strong> D\u1ef1a v\u00e0o \u0111\u1ed9 s\u00e1ng t\u1ed1i \u0111\u1ec3 quy\u1ebft \u0111\u1ecbnh \u0111\u1ed9 hi\u1ec3n th\u1ecb.<\/li>\n<\/ul>\n\n
          5.2. S\u1ee9c m\u1ea1nh c\u1ee7a Gradient Mask<\/h6>\n\n

          \u1ee8ng d\u1ee5ng ph\u1ed5 bi\u1ebfn nh\u1ea5t c\u1ee7a mask<\/code> hi\u1ec7n nay l\u00e0 t\u1ea1o hi\u1ec7u \u1ee9ng “Fade out” (m\u1edd d\u1ea7n) \u1edf c\u00e1c c\u1ea1nh c\u1ee7a danh s\u00e1ch ho\u1eb7c h\u00ecnh \u1ea3nh b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng linear-gradient<\/code>. \u0110\u00e2y l\u00e0 \u0111i\u1ec1u m\u00e0 overflow: hidden<\/code> hay clip-path<\/code> kh\u00f4ng th\u1ec3 th\u1ef1c hi\u1ec7n \u0111\u01b0\u1ee3c do t\u00ednh ch\u1ea5t bi\u00ean c\u1ee9ng c\u1ee7a ch\u00fang. <\/p>\n\n

          6. Ma tr\u1eadn so s\u00e1nh chuy\u00ean s\u00e2u<\/h4>\n\n
          Ti\u00eau ch\u00ed<\/strong><\/td>Overflow: Hidden\/Clip<\/strong><\/td>Clip-path<\/strong><\/td>Mask<\/strong><\/td><\/tr><\/thead>
          H\u00ecnh d\u1ea1ng<\/strong><\/td>H\u00ecnh ch\u1eef nh\u1eadt (Rectangle)<\/td>H\u00ecnh h\u1ecdc t\u00f9y bi\u1ebfn (Vector)<\/td>H\u00ecnh \u1ea3nh\/Gradient (Raster\/Alpha)<\/td><\/tr>
          T\u1ea7ng x\u1eed l\u00fd<\/strong><\/td>Layout\/Paint<\/td>Paint<\/td>Compositing<\/td><\/tr>
          Hi\u1ec7u n\u0103ng<\/strong><\/td>R\u1ea5t cao<\/td>Trung b\u00ecnh<\/td>Th\u1ea5p (T\u1ed1n t\u00e0i nguy\u00ean GPU)<\/td><\/tr>
          S\u1ef1 ki\u1ec7n chu\u1ed9t<\/strong><\/td>Theo Border-box<\/td>Theo Shape \u0111\u00e3 c\u1eaft<\/td>Theo Shape (t\u00f9y tr\u00ecnh duy\u1ec7t)<\/td><\/tr>
          Kh\u1ea3 n\u0103ng Border<\/strong><\/td>Gi\u1eef \u0111\u01b0\u1ee3c Border<\/td>C\u1eaft m\u1ea5t Border<\/td>C\u1eaft m\u1ea5t Border<\/td><\/tr><\/tbody><\/table><\/figure>\n\n

          7. Chi\u1ebfn l\u01b0\u1ee3c l\u1ef1a ch\u1ecdn c\u00f4ng c\u1ee5 (Decision Making)<\/h4>\n\n

          \u0110\u1ec3 x\u00e2y d\u1ef1ng m\u1ed9t h\u1ec7 th\u1ed1ng UI t\u1ed1i \u01b0u, h\u00e3y \u00e1p d\u1ee5ng quy t\u1eafc \u01b0u ti\u00ean t\u1eeb th\u1ea5p \u0111\u1ebfn cao:<\/p>\n\n

            \n
          1. S\u1eed d\u1ee5ng overflow: clip<\/code><\/strong> khi b\u1ea1n ch\u1ec9 c\u1ea7n c\u1eaft n\u1ed9i dung th\u1eeba \u0111\u1ec3 \u0111\u1ea3m b\u1ea3o hi\u1ec7u n\u0103ng cao nh\u1ea5t v\u00e0 kh\u00f4ng c\u1ea7n cu\u1ed9n.<\/li>\n\n\n\n
          2. S\u1eed d\u1ee5ng overflow: hidden<\/code><\/strong> khi c\u1ea7n t\u1ea1o BFC ho\u1eb7c th\u1ef1c hi\u1ec7n c\u00e1c k\u1ef9 thu\u1eadt cu\u1ed9n b\u1eb1ng JS (nh\u01b0 Slider\/Carousel t\u1ef1 ch\u1ebf).<\/li>\n\n\n\n
          3. S\u1eed d\u1ee5ng clip-path<\/code><\/strong> khi c\u1ea7n c\u00e1c h\u00ecnh kh\u1ed1i \u0111\u1eb7c bi\u1ec7t (hexagon, star, diagonal lines) m\u00e0 v\u1eabn gi\u1eef \u0111\u01b0\u1ee3c \u0111\u1ed9 s\u1eafc n\u00e9t c\u1ee7a vector.<\/li>\n\n\n\n
          4. S\u1eed d\u1ee5ng mask<\/code><\/strong> ch\u1ec9 khi y\u00eau c\u1ea7u c\u00e1c hi\u1ec7u \u1ee9ng chuy\u1ec3n c\u1ea5p (soft edges), m\u1edd d\u1ea7n, ho\u1eb7c c\u00e1c h\u1ecda ti\u1ebft ph\u1ee9c t\u1ea1p kh\u00f4ng th\u1ec3 m\u00f4 t\u1ea3 b\u1eb1ng to\u00e1n h\u1ecdc h\u00ecnh h\u1ecdc.<\/li>\n<\/ol>\n\n

            8. K\u1ebft lu\u1eadn<\/h4>\n\n

            Vi\u1ec7c l\u00e0m ch\u1ee7 c\u00e1c k\u1ef9 thu\u1eadt Clipping v\u00e0 Masking kh\u00f4ng ch\u1ec9 gi\u00fap ch\u00fang ta hi\u1ec7n th\u1ef1c h\u00f3a c\u00e1c b\u1ea3n thi\u1ebft k\u1ebf ph\u1ee9c t\u1ea1p m\u00e0 c\u00f2n th\u1ec3 hi\u1ec7n t\u01b0 duy t\u1ed1i \u01b0u h\u00f3a h\u1ec7 th\u1ed1ng. M\u1ed9t Technical Writer hay Developer gi\u1ecfi s\u1ebd kh\u00f4ng h\u1ecfi “L\u00e0m sao \u0111\u1ec3 \u1ea9n c\u00e1i n\u00e0y?”, m\u00e0 s\u1ebd h\u1ecfi “C\u00f4ng c\u1ee5 \u1ea9n n\u00e0o s\u1ebd t\u1ed1i \u01b0u nh\u1ea5t cho Rendering Pipeline trong tr\u01b0\u1eddng h\u1ee3p n\u00e0y?”. <\/p>\n\n

            Hi\u1ec3u r\u00f5 s\u1ef1 kh\u00e1c bi\u1ec7t gi\u1eefa c\u00e1c t\u1ea7ng Layout, Paint v\u00e0 Compositing ch\u00ednh l\u00e0 ch\u00eca kh\u00f3a \u0111\u1ec3 t\u1ea1o ra nh\u1eefng tr\u1ea3i nghi\u1ec7m Web m\u01b0\u1ee3t m\u00e0 v\u00e0 chuy\u00ean nghi\u1ec7p.<\/p>\n","protected":false},"excerpt":{"rendered":"

            Trong ki\u1ebfn tr\u00fac giao di\u1ec7n hi\u1ec7n \u0111\u1ea1i, vi\u1ec7c qu\u1ea3n l\u00fd ph\u1ea7n n\u1ed9i dung v\u01b0\u1ee3t ra ngo\u00e0i gi\u1edbi h\u1ea1n c\u1ee7a ph\u1ea7n […]<\/p>\n","protected":false},"author":4,"featured_media":4366,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[25],"tags":[],"class_list":["post-4367","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-publishing"],"acf":[],"_links":{"self":[{"href":"https:\/\/wpdesign.vn\/vi\/wp-json\/wp\/v2\/posts\/4367","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpdesign.vn\/vi\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpdesign.vn\/vi\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpdesign.vn\/vi\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/wpdesign.vn\/vi\/wp-json\/wp\/v2\/comments?post=4367"}],"version-history":[{"count":1,"href":"https:\/\/wpdesign.vn\/vi\/wp-json\/wp\/v2\/posts\/4367\/revisions"}],"predecessor-version":[{"id":4368,"href":"https:\/\/wpdesign.vn\/vi\/wp-json\/wp\/v2\/posts\/4367\/revisions\/4368"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpdesign.vn\/vi\/wp-json\/wp\/v2\/media\/4366"}],"wp:attachment":[{"href":"https:\/\/wpdesign.vn\/vi\/wp-json\/wp\/v2\/media?parent=4367"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpdesign.vn\/vi\/wp-json\/wp\/v2\/categories?post=4367"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpdesign.vn\/vi\/wp-json\/wp\/v2\/tags?post=4367"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}