{"id":228,"date":"2025-07-23T13:29:39","date_gmt":"2025-07-23T04:29:39","guid":{"rendered":"https:\/\/kyum.chu.jp\/wp\/?p=228"},"modified":"2025-08-23T10:04:40","modified_gmt":"2025-08-23T01:04:40","slug":"css-position%e3%81%ae%e5%ae%9a%e7%be%a9%e6%96%b9%e6%b3%95","status":"publish","type":"post","link":"https:\/\/achamaweb.tech\/?p=228","title":{"rendered":"CSS position\u306e\u5b9a\u7fa9\u65b9\u6cd5"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\"><code>position<\/code>\u30d7\u30ed\u30d1\u30c6\u30a3\u306f\u3001\u8981\u7d20\u304c\u30c9\u30ad\u30e5\u30e1\u30f3\u30c8\u5185\u3067\u3069\u306e\u3088\u3046\u306b\u914d\u7f6e\u3055\u308c\u308b\u304b\u3092\u5236\u5fa1\u3057\u307e\u3059\u3002<br>\u3053\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u306f\u3001\u8981\u7d20\u306e\u914d\u7f6e\u65b9\u6cd5\uff08\u901a\u5e38\u306e\u30d5\u30ed\u30fc\u306b\u5f93\u3046\u304b\u3001\u7279\u5b9a\u306e\u57fa\u6e96\u70b9\u304b\u3089\u306e\u30aa\u30d5\u30bb\u30c3\u30c8\u3092\u6301\u3064\u304b\u306a\u3069\uff09\u3092\u6c7a\u5b9a\u3057\u3001<code>top<\/code>, <code>right<\/code>, <code>bottom<\/code>, <code>left<\/code>\u3068\u3044\u3063\u305f\u30aa\u30d5\u30bb\u30c3\u30c8\u30d7\u30ed\u30d1\u30c6\u30a3\u3068\u7d44\u307f\u5408\u308f\u305b\u3066\u4f7f\u7528\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n\n\n\n<style>\n        body {\n            font-family: Arial, sans-serif;\n            margin: 20px;\n            background-color: #f4f4f4;\n            color: #333;\n            line-height: 1.6;\n        }\n\n        h1, h2, h3 {\n            color: #2c3e50;\n            margin-top: 30px;\n            border-bottom: 2px solid #ddd;\n            padding-bottom: 10px;\n        }\n\n        .section-container {\n            margin-bottom: 40px;\n            padding: 20px;\n            background-color: #fff;\n            border-radius: 8px;\n            box-shadow: 0 2px 5px rgba(0,0,0,0.1);\n        }\n\n        table {\n            width: 100%;\n            border-collapse: collapse;\n            margin-top: 20px;\n            margin-bottom: 20px;\n        }\n\n        th, td {\n            border: 1px solid #ddd;\n            padding: 10px 15px;\n            text-align: left;\n            vertical-align: top;\n        }\n\n        th {\n            background-color: #e9ecef;\n            font-weight: bold;\n            color: #555;\n        }\n\n        code {\n            background-color: #f0f0f0;\n            padding: 2px 5px;\n            border-radius: 3px;\n            font-family: 'Consolas', 'Monaco', monospace;\n            color: #c7254e;\n            white-space: nowrap;\n        }\n\n        pre {\n            background-color: #e9ecef;\n            padding: 15px;\n            border-radius: 5px;\n            overflow-x: auto;\n            font-family: 'Consolas', 'Monaco', monospace;\n            color: #34495e;\n            font-size: 0.9em;\n            margin-top: 10px;\n        }\n\n        .property-value-cell {\n            font-weight: bold;\n        }\n        .property-description {\n            font-size: 0.8em;\n            color: #666;\n            margin-top: 5px;\n        }\n\n        \/* \u30d7\u30ec\u30d3\u30e5\u30fc\u30a8\u30ea\u30a2\u306e\u30b9\u30bf\u30a4\u30eb *\/\n        .preview-area {\n            display: flex;\n            flex-wrap: wrap;\n            gap: 15px;\n            margin-top: 10px;\n            border: 1px dashed #ccc;\n            padding: 10px;\n            background-color: #f9f9f9;\n            min-height: 150px; \/* \u30d7\u30ec\u30d3\u30e5\u30fc\u30a8\u30ea\u30a2\u306e\u6700\u5c0f\u9ad8\u3055\u3092\u78ba\u4fdd *\/\n            position: relative; \/* absolute\u8981\u7d20\u306e\u57fa\u6e96\u306b\u3059\u308b\u305f\u3081 *\/\n        }\n\n        .preview-box {\n            border: 1px solid #aaa;\n            background-color: #e0f2f7;\n            text-align: center;\n            line-height: 1.5;\n            color: #333;\n            font-size: 0.9em;\n            box-sizing: border-box;\n            padding: 5px;\n            min-width: 80px;\n            height: 50px;\n            display: flex;\n            justify-content: center;\n            align-items: center;\n        }\n\n        \/* \u5404position\u5024\u306b\u5408\u308f\u305b\u305f\u30d7\u30ec\u30d3\u30e5\u30fc\u30dc\u30c3\u30af\u30b9\u306e\u30b9\u30bf\u30a4\u30eb *\/\n        .position-static-parent {\n            border: 2px dashed #a2d2ff;\n            background-color: #e7f5ff;\n            padding: 10px;\n            margin-bottom: 20px;\n        }\n        .position-static {\n            position: static;\n            background-color: #b3e0ff;\n            margin: 5px;\n        }\n\n        .position-relative-parent {\n            border: 2px dashed #ffc0cb;\n            background-color: #ffe0eb;\n            padding: 10px;\n            margin-bottom: 20px;\n            position: relative; \/* \u5b50\u8981\u7d20\u306eabsolute\u306e\u57fa\u6e96\u306b\u306a\u308b *\/\n        }\n        .position-relative {\n            position: relative;\n            top: 10px;\n            left: 10px;\n            background-color: #ffb6c1;\n            margin: 5px;\n        }\n\n        .position-absolute-parent {\n            border: 2px dashed #c8a2c8;\n            background-color: #e6e6fa;\n            padding: 10px;\n            margin-bottom: 20px;\n            position: relative; \/* \u5b50\u8981\u7d20\u306eabsolute\u306e\u57fa\u6e96\u306b\u306a\u308b *\/\n            min-height: 100px; \/* \u5b50\u8981\u7d20\u304c\u306f\u307f\u51fa\u3055\u306a\u3044\u3088\u3046\u306b\u89aa\u306e\u9ad8\u3055\u78ba\u4fdd *\/\n        }\n        .position-absolute {\n            position: absolute;\n            top: 20px;\n            right: 20px;\n            background-color: #add8e6;\n            z-index: 10;\n        }\n        .absolute-sibling {\n            background-color: #f0f8ff;\n            padding: 5px;\n            margin: 5px;\n            border: 1px solid #cceeff;\n        }\n\n        .position-fixed {\n            position: fixed;\n            top: 20px;\n            right: 20px;\n            background-color: #ffdead;\n            border: 2px solid #daa520;\n            color: #8b4513;\n            padding: 10px;\n            z-index: 100;\n            width: 100px;\n            height: 50px;\n            display: flex;\n            justify-content: center;\n            align-items: center;\n        }\n\n        .position-sticky-parent {\n            height: 300px; \/* \u30b9\u30af\u30ed\u30fc\u30eb\u53ef\u80fd\u306a\u9818\u57df\u3092\u4f5c\u6210 *\/\n            overflow-y: scroll;\n            border: 2px dashed #90ee90;\n            background-color: #f0fff0;\n            padding: 10px;\n            margin-bottom: 20px;\n        }\n        .sticky-content {\n            height: 150px;\n            background-color: #e6ffe6;\n            margin-bottom: 10px;\n            padding: 10px;\n            border: 1px solid #aaffaa;\n        }\n        .position-sticky {\n            position: sticky;\n            top: 0; \/* \u30b9\u30af\u30ed\u30fc\u30eb\u3057\u3066\u3053\u306e\u4f4d\u7f6e\u306b\u6765\u305f\u3089\u56fa\u5b9a *\/\n            background-color: #c1ffc1;\n            border: 2px solid #3cb371;\n            padding: 10px;\n            text-align: center;\n            font-weight: bold;\n            z-index: 50;\n        }\n\n        \/* \u30c6\u30fc\u30d6\u30eb\u5185\u306e\u95a2\u9023CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u306e\u8aac\u660e *\/\n        .related-css-description {\n            font-size: 0.8em;\n            color: #444;\n            margin-top: 8px;\n            padding-left: 5px;\n            border-left: 3px solid #eee;\n        }\n\n        \/* \u5217\u5e45\u306e\u5236\u9650 *\/\n        .col-max-30rem {\n            max-width: 30rem;\n            word-break: break-word; \/* \u9577\u3044\u5358\u8a9e\u304c\u306f\u307f\u51fa\u3055\u306a\u3044\u3088\u3046\u306b *\/\n        }\n    <\/style>\n\n    <div class=\"block-group-box\">\n        <table>\n            <thead>\n                <tr>\n                    <th class=\"col-max-30rem\">\u30d7\u30ed\u30d1\u30c6\u30a3\u5024<\/th>\n                    <th class=\"col-max-30rem\">\u95a2\u9023CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u306e\u5f71\u97ff<\/th>\n                    <th>CSS\u30b3\u30fc\u30c9\u4f8b<\/th>\n                    <th>\u30d7\u30ec\u30d3\u30e5\u30fc<\/th>\n                <\/tr>\n            <\/thead>\n            <tbody>\n                <tr>\n                    <td class=\"property-value-cell col-max-30rem\">static\n                        <div class=\"property-description\">\u8981\u7d20\u3092\u901a\u5e38\u306e\u30c9\u30ad\u30e5\u30e1\u30f3\u30c8\u30d5\u30ed\u30fc\u306b\u6cbf\u3063\u3066\u914d\u7f6e\u3057\u307e\u3059\u3002\u3053\u308c\u304c\u30c7\u30d5\u30a9\u30eb\u30c8\u5024\u3067\u3059\u3002<\/div>\n                    <\/td>\n                    <td>\n                        <div class=\"related-css-description\">\n                            <strong><code>top<\/code>, <code>right<\/code>, <code>bottom<\/code>, <code>left<\/code>:<\/strong> \u7121\u52b9\u3002<br>\n                            <strong><code>z-index<\/code>:<\/strong> \u7121\u52b9\u3002<br>\n                            <strong><code>padding<\/code>, <code>margin<\/code>:<\/strong> \u6709\u52b9\u3002<br>\n                            <strong><code>text-align<\/code>:<\/strong> \u30d6\u30ed\u30c3\u30af\u5185\u306e\u30a4\u30f3\u30e9\u30a4\u30f3\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u63c3\u3048\u308b\u304c\u3001\u30d6\u30ed\u30c3\u30af\u81ea\u4f53\u306b\u306f\u5f71\u97ff\u3057\u306a\u3044\u3002<br>\n                            <strong><code>vertical-align<\/code>:<\/strong> \u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\u306b\u6709\u52b9\u3002\n                        <\/div>\n                    <\/td>\n                    <td><pre><code>.element {<br>  position: static;<br>  margin: 5px;<br>  padding: 10px;<br>  background-color: #b3e0ff;<br>}<br><\/code><\/pre><\/td>\n                    <td>\n                        <div class=\"preview-area position-static-parent\">\n                            <div class=\"preview-box position-static\">Static Box 1<\/div>\n                            <div class=\"preview-box position-static\">Static Box 2<\/div>\n                        <\/div>\n                    <\/td>\n                <\/tr>\n                <tr>\n                    <td class=\"property-value-cell col-max-30rem\">relative\n                        <div class=\"property-description\">\u8981\u7d20\u3092\u901a\u5e38\u306e\u30d5\u30ed\u30fc\u306b\u6cbf\u3063\u3066\u914d\u7f6e\u3057\u307e\u3059\u304c\u3001<code>top<\/code>, <code>right<\/code>, <code>bottom<\/code>, <code>left<\/code>\u30d7\u30ed\u30d1\u30c6\u30a3\u306b\u3088\u3063\u3066\u3001\u305d\u306e\u672c\u6765\u306e\u4f4d\u7f6e\u304b\u3089\u30aa\u30d5\u30bb\u30c3\u30c8\u3055\u308c\u307e\u3059\u3002\u30aa\u30d5\u30bb\u30c3\u30c8\u3055\u308c\u3066\u3082\u3001\u5143\u306e\u5834\u6240\u306f\u5360\u6709\u3057\u7d9a\u3051\u307e\u3059\u3002<\/div>\n                    <\/td>\n                    <td>\n                        <div class=\"related-css-description\">\n                            <strong><code>top<\/code>, <code>right<\/code>, <code>bottom<\/code>, <code>left<\/code>:<\/strong> \u6709\u52b9\uff08\u5143\u306e\u4f4d\u7f6e\u304b\u3089\u306e\u76f8\u5bfe\u7684\u306a\u79fb\u52d5\uff09\u3002<br>\n                            <strong><code>z-index<\/code>:<\/strong> \u6709\u52b9\uff08\u91cd\u306a\u308a\u9806\u3092\u5236\u5fa1\uff09\u3002<br>\n                            <strong><code>padding<\/code>, <code>margin<\/code>:<\/strong> \u6709\u52b9\u3002<br>\n                            <strong><code>text-align<\/code>:<\/strong> \u30d6\u30ed\u30c3\u30af\u5185\u306e\u30a4\u30f3\u30e9\u30a4\u30f3\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u63c3\u3048\u308b\u3002<br>\n                            <strong><code>vertical-align<\/code>:<\/strong> \u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\u306b\u6709\u52b9\u3002\n                        <\/div>\n                    <\/td>\n                    <td><pre><code>.element {<br>  position: relative;<br>  top: 10px;<br>  left: 10px;<br>  background-color: #ffb6c1;<br>}<br><\/code><\/pre><\/td>\n                    <td>\n                        <div class=\"preview-area position-relative-parent\">\n                            <div class=\"preview-box position-relative\">Relative Box<\/div>\n                            <div class=\"preview-box\">\u901a\u5e38\u30d5\u30ed\u30fc\u306e\u8981\u7d20<\/div>\n                        <\/div>\n                    <\/td>\n                <\/tr>\n                <tr>\n                    <td class=\"property-value-cell col-max-30rem\">absolute\n                        <div class=\"property-description\">\u8981\u7d20\u3092\u901a\u5e38\u306e\u30d5\u30ed\u30fc\u304b\u3089\u5b8c\u5168\u306b\u524a\u9664\u3057\u3001\u6700\u3082\u8fd1\u3044<code>position<\/code>\u30d7\u30ed\u30d1\u30c6\u30a3\u304c<code>static<\/code>\u4ee5\u5916\uff08<code>relative<\/code>, <code>absolute<\/code>, <code>fixed<\/code>, <code>sticky<\/code>\uff09\u306e\u7956\u5148\u8981\u7d20\u3092\u57fa\u6e96\u306b\u914d\u7f6e\u3057\u307e\u3059\u3002\u305d\u306e\u3088\u3046\u306a\u7956\u5148\u8981\u7d20\u304c\u306a\u3044\u5834\u5408\u306f\u3001\u521d\u671f\u5305\u542b\u30d6\u30ed\u30c3\u30af\uff08\u901a\u5e38\u306f<code>&lt;html&gt;<\/code>\u8981\u7d20\uff09\u3092\u57fa\u6e96\u306b\u914d\u7f6e\u3055\u308c\u307e\u3059\u3002<\/div>\n                    <\/td>\n                    <td>\n                        <div class=\"related-css-description\">\n                            <strong><code>top<\/code>, <code>right<\/code>, <code>bottom<\/code>, <code>left<\/code>:<\/strong> \u6709\u52b9\uff08\u57fa\u6e96\u8981\u7d20\u304b\u3089\u306e\u7d76\u5bfe\u7684\u306a\u4f4d\u7f6e\uff09\u3002<br>\n                            <strong><code>z-index<\/code>:<\/strong> \u6709\u52b9\uff08\u91cd\u306a\u308a\u9806\u3092\u5236\u5fa1\uff09\u3002<br>\n                            <strong><code>padding<\/code>, <code>margin<\/code>:<\/strong> \u6709\u52b9\u3002<br>\n                            <strong><code>text-align<\/code>, <code>vertical-align<\/code>:<\/strong> \u81ea\u8eab\u306e\u5b50\u8981\u7d20\u306b\u306f\u9069\u7528\u3055\u308c\u308b\u304c\u3001\u81ea\u8eab\u306e\u914d\u7f6e\u306b\u306f\u5f71\u97ff\u3057\u306a\u3044\u3002\n                        <\/div>\n                    <\/td>\n                    <td><pre><code>.parent {<br>  position: relative; \/* \u57fa\u6e96 *\/<br>}<br>.element {<br>  position: absolute;<br>  top: 20px;<br>  right: 20px;<br>  background-color: #add8e6;<br>  z-index: 10;<br>}<br><\/code><\/pre><\/td>\n                    <td>\n                        <div class=\"preview-area position-absolute-parent\">\n                            <div class=\"preview-box position-absolute\">Absolute Box<\/div>\n                            <div class=\"absolute-sibling preview-box\">Sibling 1<\/div>\n                            <div class=\"absolute-sibling preview-box\">Sibling 2<\/div>\n                        <\/div>\n                    <\/td>\n                <\/tr>\n                <tr>\n                    <td class=\"property-value-cell col-max-30rem\">fixed\n                        <div class=\"property-description\">\u8981\u7d20\u3092\u901a\u5e38\u306e\u30d5\u30ed\u30fc\u304b\u3089\u5b8c\u5168\u306b\u524a\u9664\u3057\u3001\u30d3\u30e5\u30fc\u30dd\u30fc\u30c8\uff08\u30d6\u30e9\u30a6\u30b6\u306e\u8868\u793a\u9818\u57df\uff09\u3092\u57fa\u6e96\u306b\u914d\u7f6e\u3057\u307e\u3059\u3002\u30da\u30fc\u30b8\u3092\u30b9\u30af\u30ed\u30fc\u30eb\u3057\u3066\u3082\u3001\u8981\u7d20\u306f\u5e38\u306b\u540c\u3058\u4f4d\u7f6e\u306b\u7559\u307e\u308a\u307e\u3059\u3002<\/div>\n                    <\/td>\n                    <td>\n                        <div class=\"related-css-description\">\n                            <strong><code>top<\/code>, <code>right<\/code>, <code>bottom<\/code>, <code>left<\/code>:<\/strong> \u6709\u52b9\uff08\u30d3\u30e5\u30fc\u30dd\u30fc\u30c8\u304b\u3089\u306e\u7d76\u5bfe\u7684\u306a\u4f4d\u7f6e\uff09\u3002<br>\n                            <strong><code>z-index<\/code>:<\/strong> \u6709\u52b9\uff08\u91cd\u306a\u308a\u9806\u3092\u5236\u5fa1\uff09\u3002<br>\n                            <strong><code>padding<\/code>, <code>margin<\/code>:<\/strong> \u6709\u52b9\u3002<br>\n                            <strong><code>text-align<\/code>, <code>vertical-align<\/code>:<\/strong> \u81ea\u8eab\u306e\u5b50\u8981\u7d20\u306b\u306f\u9069\u7528\u3055\u308c\u308b\u304c\u3001\u81ea\u8eab\u306e\u914d\u7f6e\u306b\u306f\u5f71\u97ff\u3057\u306a\u3044\u3002\n                        <\/div>\n                    <\/td>\n                    <td><pre><code>.element {<br>  position: fixed;<br>  top: 20px;<br>  right: 20px;<br>  background-color: #ffdead;<br>  z-index: 100;<br>}<br><\/code><\/pre><\/td>\n                    <td>\n                        <div class=\"preview-area\" style=\"height: 200px; overflow: auto; border: 1px dashed #ccc; padding: 10px; background-color: #f9f9f9;\">\n                            <p style=\"height: 300px;\">\u3053\u3053\u306b\u30b9\u30af\u30ed\u30fc\u30eb\u53ef\u80fd\u306a\u30b3\u30f3\u30c6\u30f3\u30c4\u304c\u3042\u308a\u307e\u3059\u3002<br>\u30b9\u30af\u30ed\u30fc\u30eb\u3057\u3066\u307f\u3066\u304f\u3060\u3055\u3044\u3002<br><br>Fixed\u8981\u7d20\u306f\u5e38\u306b\u53f3\u4e0a\u306b\u8868\u793a\u3055\u308c\u307e\u3059\u3002<br><br><br><br><br><br>\u30b9\u30af\u30ed\u30fc\u30eb\u53ef\u80fd\u306a\u30b3\u30f3\u30c6\u30f3\u30c4<\/p>\n                            <div class=\"position-fixed\">Fixed Box<\/div>\n                        <\/div>\n                    <\/td>\n                <\/tr>\n                <tr>\n                    <td class=\"property-value-cell col-max-30rem\">sticky\n                        <div class=\"property-description\">\u8981\u7d20\u306f\u901a\u5e38\u306e\u30d5\u30ed\u30fc\u306b\u6cbf\u3063\u3066\u914d\u7f6e\u3055\u308c\u307e\u3059\u304c\u3001\u30b9\u30af\u30ed\u30fc\u30eb\u4f4d\u7f6e\u306b\u5fdc\u3058\u3066<code>fixed<\/code>\u306e\u3088\u3046\u306b\u632f\u308b\u821e\u3044\u307e\u3059\u3002\u6307\u5b9a\u3055\u308c\u305f\u30aa\u30d5\u30bb\u30c3\u30c8\uff08\u4f8b: <code>top: 0;<\/code>\uff09\u306b\u9054\u3059\u308b\u3068\u3001\u305d\u306e\u4f4d\u7f6e\u3067\u56fa\u5b9a\u3055\u308c\u307e\u3059\u3002<\/div>\n                    <\/td>\n                    <td>\n                        <div class=\"related-css-description\">\n                            <strong><code>top<\/code>, <code>right<\/code>, <code>bottom<\/code>, <code>left<\/code>:<\/strong> \u6709\u52b9\uff08\u56fa\u5b9a\u3055\u308c\u308b\u4f4d\u7f6e\u3092\u6307\u5b9a\uff09\u3002<br>\n                            <strong><code>z-index<\/code>:<\/strong> \u6709\u52b9\uff08\u91cd\u306a\u308a\u9806\u3092\u5236\u5fa1\uff09\u3002<br>\n                            <strong><code>padding<\/code>, <code>margin<\/code>:<\/strong> \u6709\u52b9\u3002<br>\n                            <strong><code>text-align<\/code>, <code>vertical-align<\/code>:<\/strong> \u81ea\u8eab\u306e\u5b50\u8981\u7d20\u306b\u306f\u9069\u7528\u3055\u308c\u308b\u304c\u3001\u81ea\u8eab\u306e\u914d\u7f6e\u306b\u306f\u5f71\u97ff\u3057\u306a\u3044\u3002\n                        <\/div>\n                    <\/td>\n                    <td><pre><code>.parent {<br>  height: 300px;<br>  overflow-y: scroll;<br>}<br>.element {<br>  position: sticky;<br>  top: 0;<br>  background-color: #c1ffc1;<br>  z-index: 50;<br>}<br><\/code><\/pre><\/td>\n                    <td>\n                        <div class=\"preview-area position-sticky-parent\">\n                            <div class=\"sticky-content\">\u30b9\u30af\u30ed\u30fc\u30eb\u3057\u3066Sticky Box\u3092\u56fa\u5b9a\u3057\u3066\u307f\u3066\u304f\u3060\u3055\u3044\u3002<\/div>\n                            <div class=\"preview-box position-sticky\">Sticky Box<\/div>\n                            <div class=\"sticky-content\">\u3055\u3089\u306b\u4e0b\u306e\u30b3\u30f3\u30c6\u30f3\u30c4<\/div>\n                            <div class=\"sticky-content\">\u3055\u3089\u306b\u4e0b\u306e\u30b3\u30f3\u30c6\u30f3\u30c4<\/div>\n                            <div class=\"sticky-content\">\u3055\u3089\u306b\u4e0b\u306e\u30b3\u30f3\u30c6\u30f3\u30c4<\/div>\n                        <\/div>\n                    <\/td>\n                <\/tr>\n            <\/tbody>\n        <\/table>\n    <\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>position\u30d7\u30ed\u30d1\u30c6\u30a3\u306f\u3001\u8981\u7d20\u304c\u30c9\u30ad\u30e5\u30e1\u30f3\u30c8\u5185\u3067\u3069\u306e\u3088\u3046\u306b\u914d\u7f6e\u3055\u308c\u308b\u304b\u3092\u5236\u5fa1\u3057\u307e\u3059\u3002\u3053\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u306f\u3001\u8981\u7d20\u306e\u914d\u7f6e\u65b9\u6cd5\uff08\u901a\u5e38\u306e\u30d5\u30ed\u30fc\u306b\u5f93\u3046\u304b\u3001\u7279\u5b9a\u306e\u57fa\u6e96\u70b9\u304b\u3089\u306e\u30aa\u30d5\u30bb\u30c3\u30c8\u3092\u6301\u3064\u304b\u306a\u3069\uff09\u3092\u6c7a\u5b9a\u3057\u3001top, right,  [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[10,15],"tags":[],"class_list":["post-228","post","type-post","status-publish","format-standard","hentry","category-css","category-web-development"],"acf":[],"_links":{"self":[{"href":"https:\/\/achamaweb.tech\/index.php?rest_route=\/wp\/v2\/posts\/228","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/achamaweb.tech\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/achamaweb.tech\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/achamaweb.tech\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/achamaweb.tech\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=228"}],"version-history":[{"count":4,"href":"https:\/\/achamaweb.tech\/index.php?rest_route=\/wp\/v2\/posts\/228\/revisions"}],"predecessor-version":[{"id":341,"href":"https:\/\/achamaweb.tech\/index.php?rest_route=\/wp\/v2\/posts\/228\/revisions\/341"}],"wp:attachment":[{"href":"https:\/\/achamaweb.tech\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=228"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/achamaweb.tech\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=228"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/achamaweb.tech\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=228"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}