{"id":183,"date":"2023-01-27T21:38:01","date_gmt":"2023-01-27T12:38:01","guid":{"rendered":"https:\/\/phantom-cgray03.xyz\/?p=183"},"modified":"2023-02-07T18:01:10","modified_gmt":"2023-02-07T09:01:10","slug":"post-183","status":"publish","type":"post","link":"https:\/\/phantom-cgray03.xyz\/?p=183","title":{"rendered":"\u3010\u5439\u304d\u51fa\u3057\u3011\u53f3\u30a2\u30a4\u30b3\u30f3\u5439\u304d\u51fa\u305702-R"},"content":{"rendered":"
\n
<\/div>\n
\n
\n

\u3053\u3061\u3089\u306b\u6587\u7ae0\u3092\u8ffd\u52a0\u3002\u8272\u5909\u66f4\u3082\u3067\u304d\u307e\u3059\u3002<\/p>\n<\/div>\n<\/div>\n<\/div>\n

\u4e0b\u8a18Beyond\u30b3\u30fc\u30c9<\/p>\n

JS head<\/p>\n

\u306a\u3057<\/p>\n

HTML<\/p>\n

<div class=\"balloon_right_02R\">\r\n    <div class=\"faceicon_right_02R\">\r\n        <!--\u753b\u50cf\u306e\u5165\u308c\u66ff\u3048\u306f\u4e0b\u8a18URL\u5909\u66f4\u3082\u3057\u304f\u306f\u5de6\u306b\u8868\u793a\u3055\u308c\u3066\u3044\u308b\u753b\u50cf\u3092\u9078\u629e\u3057\u305f\u5f8c\u306b\u4e0a\u90e8\u306e\u753b\u50cf\u30dc\u30bf\u30f3\u304b\u3089\u3082\u5165\u308c\u66ff\u3048\u53ef\u80fd-->\r\n        <img class=\"lazyload\" src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/631031\/65882372-a684-416b-a484-fe55664b6da8.png\" draggable=\"false\" height=\"51\" width=\"51\">\r\n        <!--\u30a2\u30a4\u30b3\u30f3\u540d\u304c\u4e0d\u8981\u306a\u5834\u5408\u306f\u4e0b\u8a18\uff11\u884c\u3092\u524a\u9664\u3057\u3066\u304f\u3060\u3055\u3044-->\r\n\r\n    <\/div>\r\n    <div class=\"chatting\">\r\n        <div class=\"says_right_02R\">\r\n            <p>\u3053\u3061\u3089\u306b\u6587\u7ae0\u3092\u8ffd\u52a0\u3002\u8272\u5909\u66f4\u3082\u3067\u304d\u307e\u3059\u3002<\/p>\r\n        <\/div>\r\n    <\/div>\r\n<\/div><\/code><\/pre>\n
CSS<\/p>\n
 .balloon_right_02R {\r\n  width: 100%;\r\n  \/*\u5468\u308a\u306e\u4f59\u767d\u3002\u4e0a\u4e0b\uff5c\u5de6\u53f3*\/\r\n  margin: 1.5em 0;\r\n  overflow: hidden;\r\n  display: flex;\r\n  flex-direction: row-reverse;\r\n}\r\n\r\n .chatting {\r\n  \/*\u5439\u304d\u51fa\u3057\u306e\u5e45\u3092\u5909\u66f4\u3059\u308b\u5834\u5408\u3001\u4e0b\u8a18auto\u3092\u524a\u9664\u3057\u306620%\u304b\u3089100%\u306e\u5024\u3092\u6307\u5b9a\u3057\u3066\u304f\u3060\u3055\u3044*\/\r\n  width: auto;\r\n}\r\n\r\n .faceicon_right_02R {\r\n  flex-basis: 55px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n .faceicon_right_02R img {\r\n  width: 55px;\r\n  max-width: 55px;\r\n  height: 55px !important;\r\n  object-fit: cover;\r\n  \/*\u753b\u50cf\u5468\u308a\u306e\u7dda\u306e\u6307\u5b9a\u3002\u5de6\u304b\u3089\u3001\u7dda\u306e\u7a2e\u985e\u3001\u7dda\u306e\u592a\u3055\u3001\u7dda\u306e\u8272*\/\r\n  border: solid 3px #F17E95;\r\n  border-radius: 50%;\r\n  box-sizing: border-box;\r\n}\r\n\r\n .name {\r\n  \/*\u30a2\u30a4\u30b3\u30f3\u540d\u306e\u6587\u5b57\u30b5\u30a4\u30ba*\/\r\n  font-size: 10px;\r\n  \/*\u30a2\u30a4\u30b3\u30f3\u540d\u306e\u6587\u5b57\u306e\u8272*\/\r\n  color: #808080;\r\n  text-align: center;\r\n}\r\n\r\n .says_right_02R {\r\n  display: block;\r\n  position: relative;\r\n  margin: 0 20px 0 0;\r\n  padding: 10px;\r\n  border-radius: 10pt;\r\n  \/*\u30dc\u30fc\u30c0\u30fc\u306e\u8272\u3092\u8abf\u6574\u3067\u304d\u307e\u3059\u3001\u4e0b\u306e.says:after\u306eborder-left\u3068\u8272\u3092\u5408\u308f\u305b\u3066\u304f\u3060\u3055\u3044*\/\r\n  border: 3px solid #F17E95;\r\n  \/*\u5439\u304d\u51fa\u3057\u306e\u80cc\u666f\u8272*\/\r\n  background: #F7DEE6;\r\n}\r\n\r\n .says_right_02R:before {\r\n  content: \"\";\r\n  position: absolute;\r\n  top: 24px;\r\n  right: -19px;\r\n  margin-top: -11px;\r\n  border: 11px solid transparent;\r\n  border-left: 11px solid #F7DEE6;\r\n  z-index: 2;\r\n}\r\n\r\n .says_right_02R:after {\r\n  content: \"\";\r\n  position: absolute;\r\n  top: 24px;\r\n  right: -28px;\r\n  margin-top: -14px;\r\n  border: 14px solid transparent;\r\n  \/*\u30dc\u30fc\u30c0\u30fc\u306e\u8272\u3092\u8abf\u6574\u3067\u304d\u307e\u3059*\/\r\n  border-left: 14px solid #F17E95;\r\n  z-index: 1;\r\n}\r\n\r\n .says_right_02R p {\r\n  margin: 0;\r\n  padding: 0;\r\n  letter-spacing: -0.01em;\r\n}<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"
\u3053\u3061\u3089\u306b\u6587\u7ae0\u3092\u8ffd\u52a0\u3002\u8272\u5909\u66f4\u3082\u3067\u304d\u307e\u3059\u3002 \u4e0b\u8a18Beyond\u30b3\u30fc\u30c9 JS head \u306a\u3057 HTML lt;div class=”balloon_right_02R”gt; lt;div class=”faceicon_<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[14,11],"tags":[4,13,12],"class_list":["post-183","post","type-post","status-publish","format-standard","hentry","category-addquicktag","category-11","tag-simplicity02","tag-13","tag-12"],"_links":{"self":[{"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/posts\/183","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=183"}],"version-history":[{"count":2,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/posts\/183\/revisions"}],"predecessor-version":[{"id":219,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/posts\/183\/revisions\/219"}],"wp:attachment":[{"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=183"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=183"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=183"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}