{"id":12001,"date":"2024-08-28T13:56:20","date_gmt":"2024-08-28T04:56:20","guid":{"rendered":"https:\/\/wfp.ashisuto.co.jp\/learning\/?p=12001"},"modified":"2024-08-30T08:51:42","modified_gmt":"2024-08-29T23:51:42","slug":"%e3%80%90designer%e3%80%91%e3%83%9a%e3%83%bc%e3%82%b8%e3%81%ae%e7%b7%a8%e9%9b%86%ef%bc%88css%ef%bc%89","status":"publish","type":"post","link":"https:\/\/wfp.ashisuto.co.jp\/learning\/reference\/12001\/","title":{"rendered":"\u3010Designer\u3011\u30da\u30fc\u30b8\u306e\u7de8\u96c6\uff08css\uff09"},"content":{"rendered":"\n<div class=\"wp-block-liquid-speech-balloon liquid-speech-balloon-wrap liquid-speech-balloon-00\"><div class=\"liquid-speech-balloon-avatar\"><\/div><div class=\"liquid-speech-balloon-text\" style=\"border-color:#459bce;background-color:#459bce;color:#fffefe\"><p>Designer\u753b\u9762\u304b\u3089CSS\u306e\u7de8\u96c6\u3092\u3057\u3088\u3046\u266a<\/p><div class=\"liquid-speech-balloon-arrow\" style=\"border-color:transparent #459bce transparent transparent\"><\/div><\/div><\/div>\n\n\n\n<div style=\"height:15px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-snow-monkey-blocks-box smb-box\" style=\"--smb-box--background-opacity:1;--smb-box--border-width:1px\"><div class=\"smb-box__background\"><\/div><div class=\"smb-box__body is-layout-constrained wp-block-box-is-layout-constrained\">\n<h3 class=\"wp-block-heading\">\u5b9f\u88c5\u30a4\u30e1\u30fc\u30b8<\/h3>\n\n\n\n<div class=\"wp-block-columns has-2-columns is-layout-flex wp-container-core-columns-is-layout-1 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure data-wp-context=\"{&quot;uploadedSrc&quot;:&quot;https:\\\/\\\/wfp.ashisuto.co.jp\\\/learning\\\/wp-content\\\/uploads\\\/image-1354.png&quot;,&quot;figureClassNames&quot;:&quot;wp-block-image size-full is-style-vk-image-border&quot;,&quot;figureStyles&quot;:null,&quot;imgClassNames&quot;:&quot;wp-image-12230&quot;,&quot;imgStyles&quot;:null,&quot;targetWidth&quot;:463,&quot;targetHeight&quot;:240,&quot;scaleAttr&quot;:false,&quot;ariaLabel&quot;:&quot;\\u753b\\u50cf\\u3092\\u62e1\\u5927&quot;,&quot;alt&quot;:&quot;&quot;}\" data-wp-interactive=\"core\/image\" class=\"wp-block-image size-full is-style-vk-image-border wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"463\" height=\"240\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-content\/uploads\/image-1354.png\" alt=\"\" class=\"wp-image-12230\" srcset=\"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-content\/uploads\/image-1354.png 463w, https:\/\/wfp.ashisuto.co.jp\/learning\/wp-content\/uploads\/image-1354-300x156.png 300w, https:\/\/wfp.ashisuto.co.jp\/learning\/wp-content\/uploads\/image-1354-400x207.png 400w\" sizes=\"(max-width: 463px) 100vw, 463px\" \/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"\u753b\u50cf\u3092\u62e1\u5927\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on-async--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"context.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"context.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n<figure data-wp-context=\"{&quot;uploadedSrc&quot;:&quot;https:\\\/\\\/wfp.ashisuto.co.jp\\\/learning\\\/wp-content\\\/uploads\\\/image-1355.png&quot;,&quot;figureClassNames&quot;:&quot;wp-block-image size-full is-style-vk-image-border&quot;,&quot;figureStyles&quot;:null,&quot;imgClassNames&quot;:&quot;wp-image-12231&quot;,&quot;imgStyles&quot;:null,&quot;targetWidth&quot;:346,&quot;targetHeight&quot;:325,&quot;scaleAttr&quot;:false,&quot;ariaLabel&quot;:&quot;\\u753b\\u50cf\\u3092\\u62e1\\u5927&quot;,&quot;alt&quot;:&quot;&quot;}\" data-wp-interactive=\"core\/image\" class=\"wp-block-image size-full is-style-vk-image-border wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"346\" height=\"325\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-content\/uploads\/image-1355.png\" alt=\"\" class=\"wp-image-12231\" srcset=\"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-content\/uploads\/image-1355.png 346w, https:\/\/wfp.ashisuto.co.jp\/learning\/wp-content\/uploads\/image-1355-300x282.png 300w, https:\/\/wfp.ashisuto.co.jp\/learning\/wp-content\/uploads\/image-1355-319x300.png 319w\" sizes=\"(max-width: 346px) 100vw, 346px\" \/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"\u753b\u50cf\u3092\u62e1\u5927\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on-async--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"context.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"context.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n<p class=\"has-text-align-left\"><span class=\"sme-font-size has-small-font-size\">\u52d5\u4f5c\u78ba\u8a8d\u30d0\u30fc\u30b8\u30e7\u30f3 <span class=\"sme-badge has-carrot-orange-background-color\">v9.3<\/span><\/span><\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p>CSS\u3092\u6307\u5b9a\u3059\u308b\u3053\u3068\u3067\u30da\u30fc\u30b8\u306e\u898b\u305f\u76ee\u3092\u88c5\u98fe\u3059\u308b\u3053\u3068\u304c\u53ef\u80fd\u3067\u3059\u3002<br>\u4f8b\u3067\u306f\u3001\u30da\u30fc\u30b8\u30bf\u30a4\u30c8\u30eb\u3078CSS\u3092\u9069\u7528\u3057\u898b\u305f\u76ee\u306e\u88c5\u98fe\u3092\u3057\u307e\u3059\u3002<\/p>\n<\/div>\n<\/div>\n\n\n\n<ul class=\"wp-block-list is-style-sme-list-remark vk_block-margin-0--margin-top has-bright-blue-color has-text-color has-small-font-size\">\n<li>\u672c\u30da\u30fc\u30b8\u306f\u3001\u52d5\u4f5c\u78ba\u8a8d\u30d0\u30fc\u30b8\u30e7\u30f3\u3067\u306e\u60c5\u5831\u3092\u30d9\u30fc\u30b9\u306b\u4f5c\u6210\u3057\u3066\u3044\u307e\u3059\u3002<\/li>\n\n\n\n<li>\u304a\u5ba2\u69d8\u304c\u3054\u5229\u7528\u306e\u30d0\u30fc\u30b8\u30e7\u30f3\u306b\u3088\u308a\u3001\u753b\u9762\u30ad\u30e3\u30d7\u30c1\u30e3\u304c\u5b9f\u969b\u306e\u753b\u9762\u3068\u7570\u306a\u308b\u5834\u5408\u304c\u3042\u308a\u307e\u3059\u3002<\/li>\n<\/ul>\n<\/div><\/div>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-buttons is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-1 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-white-color has-mirage-background-color has-text-color has-background wp-element-button\" href=\"\/learning\/login\/\">\u3053\u306e\u5148\u3092\u3054\u89a7\u306b\u306a\u308b\u306b\u306f\u3054\u5951\u7d04\u304c\u5fc5\u8981\u3067\u3059<\/a><\/div>\n<\/div>\n\n\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\t\t<div class=\"wpulike wpulike-default \" ><div class=\"wp_ulike_general_class wp_ulike_is_not_liked\"><button type=\"button\"\n\t\t\t\t\taria-label=\"\u3044\u3044\u306d\u30dc\u30bf\u30f3\"\n\t\t\t\t\tdata-ulike-id=\"12001\"\n\t\t\t\t\tdata-ulike-nonce=\"abadf3d6d2\"\n\t\t\t\t\tdata-ulike-type=\"post\"\n\t\t\t\t\tdata-ulike-template=\"wpulike-default\"\n\t\t\t\t\tdata-ulike-display-likers=\"\"\n\t\t\t\t\tdata-ulike-likers-style=\"popover\"\n\t\t\t\t\tclass=\"wp_ulike_btn wp_ulike_put_image wp_post_btn_12001\"><\/button><span class=\"count-box wp_ulike_counter_up\" data-ulike-counter-value=\"0\"><\/span>\t\t\t<\/div><\/div>\n\t\n","protected":false},"excerpt":{"rendered":"<p>\u624b\u9806 \u691c\u7d22\u30ef\u30fc\u30c9\u300c054\u300d\u203b\u78ba\u8a8d\u65b9\u6cd5\u306f\u30b3\u30c1\u30e9...<\/p>\n","protected":false},"author":4,"featured_media":4913,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5,30],"tags":[61321,63],"class_list":["post-12001","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-reference","category-pageportal","tag-page","tag-css"],"_links":{"self":[{"href":"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-json\/wp\/v2\/posts\/12001"}],"collection":[{"href":"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-json\/wp\/v2\/comments?post=12001"}],"version-history":[{"count":7,"href":"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-json\/wp\/v2\/posts\/12001\/revisions"}],"predecessor-version":[{"id":12257,"href":"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-json\/wp\/v2\/posts\/12001\/revisions\/12257"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-json\/wp\/v2\/media\/4913"}],"wp:attachment":[{"href":"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-json\/wp\/v2\/media?parent=12001"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-json\/wp\/v2\/categories?post=12001"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wfp.ashisuto.co.jp\/learning\/wp-json\/wp\/v2\/tags?post=12001"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}