{"id":1017,"date":"2026-03-05T11:33:44","date_gmt":"2026-03-05T02:33:44","guid":{"rendered":"https:\/\/iseed.jp\/blog2\/?p=1017"},"modified":"2026-08-03T12:42:35","modified_gmt":"2026-08-03T03:42:35","slug":"css-plugin","status":"publish","type":"post","link":"https:\/\/iseed.jp\/blog\/css-plugin\/","title":{"rendered":"\u3088\u304f\u4f7f\u3046CSS\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u4e00\u89a7\uff01\u521d\u5fc3\u8005\u5411\u3051\u306b\u73fe\u5f79\u30c7\u30b6\u30a4\u30ca\u30fc\u304c\u53b3\u9078\u3057\u3066\u7d39\u4ecb"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">\u300c\u30db\u30fc\u30e0\u30da\u30fc\u30b8\u3092\u4f5c\u308a\u305f\u3044\uff01\u300d<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cWordpress\u3084\u30d6\u30ed\u30b0\u3092\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3057\u305f\u3044\uff01\u300d<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u3093\u306a\u6642\u306b\u6b20\u304b\u305b\u306a\u3044\u306e\u304c\u6587\u5b57\u3084\u8981\u7d20\u3092\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3059\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3057\u304b\u3057\u3001\u3044\u304d\u306a\u308a\u5168\u3066\u306eCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u899a\u3048\u3066\u4f7f\u3044\u3053\u306a\u3059\u306e\u306f\u4e2d\u3005\u96e3\u3057\u3044\u3067\u3059\u3088\u306d\u2026<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u3053\u3067\u4eca\u56de\u306f\u5b9f\u969b\u306b\u3088\u304f\u4f7f\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u306e\u307f\u3092\u30ab\u30c6\u30b4\u30ea\u5225\u306b\u53b3\u9078\u3057\u3066\u307f\u307e\u3057\u305f\uff01<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30b3\u30d4\u30da\u3067\u305d\u306e\u307e\u307e\u4f7f\u3048\u308b\u30b3\u30fc\u30c9\u4f8b\u3082\u3042\u308a\u307e\u3059\u306e\u3067\u3001\u305c\u3072\u6d3b\u7528\u3057\u3066\u307f\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n<div class=\"swell-block-postLink\">\t\t\t<div class=\"p-blogCard -internal\" data-type=\"type1\" data-onclick=\"clickLink\">\n\t\t\t\t<div class=\"p-blogCard__inner\">\n\t\t\t\t\t<span class=\"p-blogCard__caption\">\u3042\u308f\u305b\u3066\u8aad\u307f\u305f\u3044<\/span>\n\t\t\t\t\t<div class=\"p-blogCard__thumb c-postThumb\"><figure class=\"c-postThumb__figure\"><img decoding=\"async\" src=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/01\/css-top-300x200.webp\" alt=\"\" class=\"c-postThumb__img u-obf-cover\" width=\"320\" height=\"180\"><\/figure><\/div>\t\t\t\t\t<div class=\"p-blogCard__body\">\n\t\t\t\t\t\t<a class=\"p-blogCard__title\" href=\"https:\/\/iseed.jp\/blog\/css\/\">\u3010\u521d\u5fc3\u8005\u5fc5\u898b\u3011CSS\u3068\u306f\uff1fCSS\u306e\u66f8\u304d\u65b9\u3068\u57fa\u672c\u3092\u308f\u304b\u308a\u3084\u3059\u304f\u89e3\u8aac\uff01<\/a>\n\t\t\t\t\t\t<span class=\"p-blogCard__excerpt\">Web\u5236\u4f5c\u306b\u6b20\u304b\u305b\u306a\u3044\uff62CSS\uff63\u3002\u8a00\u8449\u306f\u77e5\u3063\u3066\u3044\u3066\u3082\u3001\u3069\u306e\u3088\u3046\u306a\u3082\u306e\u304b\u77e5\u3089\u306a\u3044\u4eba\u3082\u591a\u3044\u306e\u3067\u306f\u306a\u3044\u3067\u3057\u3087\u3046\u304b\u3002 \u3053\u306e\u8a18\u4e8b\u3067\u306fCSS\u306e\u57fa\u790e\u77e5\u8b58\u3084HTML\u3068\u306e\u9055\u3044\u306b\u52a0\u3048\u3066\u3001CSS\u306e\u66f8&#8230;<\/span>\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\n<h2 class=\"wp-block-heading\">\u3088\u304f\u4f7f\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3010\u30d5\u30a9\u30f3\u30c8\u7cfb\u3011<\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>CSS\u30d7\u30ed\u30d1\u30c6\u30a3<\/th><th>\u610f\u5473<\/th><\/tr><\/thead><tbody><tr><td>color<\/td><td>\u30d5\u30a9\u30f3\u30c8\u306e\u8272\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>font-size<\/td><td>\u30d5\u30a9\u30f3\u30c8\u306e\u5927\u304d\u3055\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>font-weight<\/td><td>\u30d5\u30a9\u30f3\u30c8\u306e\u592a\u3055\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>font-family<\/td><td>\u30d5\u30a9\u30f3\u30c8\u306e\u7a2e\u985e\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>font<\/td><td>\u30d5\u30a9\u30f3\u30c8\u95a2\u9023\u3092\u4e00\u62ec\u3067\u6307\u5b9a<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u300ccolor:\u300d\u30d5\u30a9\u30f3\u30c8\u306e\u8272<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300ccolor:\u300d\u306f\u6587\u5b57\u306e\u8272\u3092\u5909\u3048\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u8272\u306f\u30ab\u30e9\u30fc\u30cd\u30fc\u30e0\uff08red,blue\uff09\u3084\u30ab\u30e9\u30fc\u30b3\u30fc\u30c9\uff08#FFFFFF\uff09\u306e\u307b\u304b\u3001rgba\u3067\u6307\u5b9a\u3059\u308b\u3053\u3068\u3082\u53ef\u80fd\u3067\u3059\u3002rgba\u3067\u6307\u5b9a\u3057\u305f\u5834\u5408\u306f\u900f\u660e\u5ea6\u3092\u5909\u3048\u308b\u3053\u3068\u3082\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30d7\u30ed\u30d1\u30c6\u30a3\u540d\u304c\u300cfont-color:\u300d\u3067\u306f\u306a\u3044\u3053\u3068\u3068\u3001\u8981\u7d20\u306e\u8272\u306f\u5909\u3048\u3089\u308c\u306a\u3044\u3053\u3068\u306b\u6ce8\u610f\u304c\u5fc5\u8981\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">color\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">color\u30d7\u30ed\u30d1\u30c6\u30a3\u306eCSS\u306b\u306f\u4e3b\u306b3\u3064\u306e\u6307\u5b9a\u65b9\u6cd5\u304c\u3042\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4ee5\u4e0b\u306f\u3001\u8d64\u8272\u3092\u6307\u5b9a\u3059\u308b\u5834\u5408\u306e\u4f8b\u3067\u3059\u3002<\/p>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u30ab\u30e9\u30fc\u30cd\u30fc\u30e0\u3067\u6307\u5b9a *\/\ncolor: red;\n\n\/* \u30ab\u30e9\u30fc\u30b3\u30fc\u30c9\u3067\u6307\u5b9a *\/\ncolor: #FF0000;\n\n\/* RGB\u3067\u6307\u5b9a *\/\ncolor: rgb(255, 0, 0)<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">\u306a\u304a\u3001\u8a18\u8ff0\u4f8b\u306b\u3042\u308b\u7dd1\u8272\u306e\u30c6\u30ad\u30b9\u30c8\u306f\u30b3\u30e1\u30f3\u30c8\u30a2\u30a6\u30c8\u3067\u3059\u3002<span class=\"swl-bg-color has-black-background-color\"><span class=\"swl-inline-color has-swl-deep-03-color\"><span class=\"swl-fz u-fz-s\"> <\/span><\/span><span class=\"swl-fz u-fz-s\"><span class=\"swl-inline-color has-swl-main-thin-color\">\/* \u3053\u3053\u304c\u30b3\u30e1\u30f3\u30c8\u30a2\u30a6\u30c8\u3067\u3059 *\/ <\/span><\/span><\/span>\u306e\u3088\u3046\u306b\u30b9\u30e9\u30c3\u30b7\u30e5\u3068\u30a2\u30b9\u30bf\u30ea\u30b9\u30af\u3067\u631f\u3080\u3053\u3068\u3067\u3001\u30b3\u30fc\u30c9\u306e\u4e00\u90e8\u3092\u5b9f\u884c\u3055\u308c\u306a\u3044\u3088\u3046\u306b\u7121\u52b9\u5316\u3057\u3001\u30e1\u30e2\u3084\u8aac\u660e\u3092\u66f8\u304d\u52a0\u3048\u308b\u305f\u3081\u306b\u8a18\u8ff0\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">RGB\u30ab\u30e9\u30fc\u306e\u4e0d\u900f\u660e\u5ea6\u3092\u8a2d\u5b9a\u3059\u308bCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u4e0d\u900f\u660e\u5ea6100%\uff08\u5b8c\u5168\u306b\u898b\u3048\u308b\uff09 *\/\ncolor: rgba(255, 0, 0, 1.0);\n\n\/* \u4e0d\u900f\u660e\u5ea650%\uff08\u534a\u900f\u660e\uff09 *\/\ncolor: rgba(255, 0, 0, 0.5);\n\n\/* \u4e0d\u900f\u660e\u5ea60%\uff08\u5b8c\u5168\u306b\u900f\u660e\uff09 *\/\ncolor: rgba(255, 0, 0, 0.0);<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cfont-size:\u300d\u30d5\u30a9\u30f3\u30c8\u306e\u5927\u304d\u3055<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cfont-size:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u306f\u6587\u5b57\u306e\u5927\u304d\u3055\u3092\u8a2d\u5b9a\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30d5\u30a9\u30f3\u30c8\u306e\u5927\u304d\u3055\u306fpx\u3092\u4f7f\u3063\u3066\u5024\u3092\u76f4\u63a5\u6307\u5b9a\u3059\u308b\u65b9\u6cd5\u3068\u3001%\u3084em\u3001vw\u306a\u3069\u3092\u4f7f\u3063\u3066\u76f8\u5bfe\u7684\u306b\u6307\u5b9a\u3059\u308b\u65b9\u6cd5\u304c\u3042\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5358\u4f4d\u306b\u3088\u308a\u7279\u6027\u304c\u7570\u306a\u308b\u305f\u3081\u3001\u6761\u4ef6\u306b\u3042\u308f\u305b\u3066\u4f7f\u3044\u5206\u3051\u3089\u308c\u308b\u3088\u3046\u306b\u3057\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">font-size\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* px\u3067\u6307\u5b9a *\/\nfont-size: 16px;\n\n\/* em\u3067\u6307\u5b9a *\/\nfont-size: 1.2em;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cpx\u300d\u306f \u30b5\u30a4\u30ba\u3092\u7d76\u5bfe\u5024\u6307\u5b9a\u3059\u308b\u3082\u306e\u3067\u3001\u4f8b\u306e\u3088\u3046\u306b16px\u3068\u6307\u5b9a\u3059\u308c\u3070\u5fc5\u305a16px\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4e00\u65b9\u3001\u300cem\u300d\u306f\u4ed6\u306e\u8981\u7d20\u306b\u6bd4\u4f8b\u3057\u3066\u6570\u5024\u304c\u6c7a\u307e\u308b\u3082\u306e\u3067\u3001\u57fa\u6e96\u3068\u306a\u308b\u89aa\u8981\u7d20\u306e\u30b5\u30a4\u30ba\u300c\u4f55\u6587\u5b57\u5206\u300d\u3068\u3057\u3066\u3001\u6570\u5024\u304c\u5909\u52d5\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f8b\u3048\u3070\u3001\u89aa\u8981\u7d20\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u304c10px\u3067\u3001\u5b50\u8981\u7d20\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u306b1.2em\u3092\u6307\u5b9a\u3059\u308b\u3068\u300110px\u306e1.2\u6587\u5b57\u5206\uff1d12px\u3068\u306a\u308b\u308f\u3051\u3067\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cfont-weight:\u300d\u30d5\u30a9\u30f3\u30c8\u306e\u592a\u3055<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cfont-weight:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u306f\u6587\u5b57\u306e\u592a\u3055\u3092\u6307\u5b9a\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u592a\u304f\u3057\u305f\u3044\u6587\u5b57\u306b\u5bfe\u3057\u3066\u3001\u30d7\u30ed\u30d1\u30c6\u30a3\u306b\u300cfont-weight: bold;\u300d\u3092\u3001\u5024\u306b\u300cbold\u300d\u3092\u5165\u308c\u308b\u4f7f\u3044\u65b9\u304c\u6700\u3082\u4e00\u822c\u7684\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u306e\u4ed6\u3001\u30d5\u30a9\u30f3\u30c8\u306e\u7a2e\u985e\u306b\u3088\u3063\u3066\u306f\u5024\u90e8\u5206\u306b\u300c100\uff5e900\u300d\u306e\u6570\u5024\u3092\u5165\u308c\u3066\u3001\u7d30\u304b\u304f\u592a\u3055\u3092\u8a2d\u5b9a\u3059\u308b\u3053\u3068\u3082\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">font-weight\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u592a\u5b57\u306b\u3059\u308b\uff08\u30ad\u30fc\u30ef\u30fc\u30c9\u6307\u5b9a\uff09 *\/\nfont-weight: bold;\n\n \/* \u592a\u5b57\u306b\u3059\u308b\uff08\u6570\u5024\u6307\u5b9a\u3002bold\u3068\u540c\u3058\u610f\u5473\u306e700\uff09 *\/\nfont-weight: 700;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cfont-family:\u300d\u30d5\u30a9\u30f3\u30c8\u306e\u7a2e\u985e<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cfont-family:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u306f\u3001\u6587\u5b57\u306e\u7a2e\u985e\u306e\u8a2d\u5b9a\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30b4\u30b7\u30c3\u30af\u4f53\u306f\u300csans-serif\u300d\u3001\u660e\u671d\u4f53\u306f\u300cserif\u300d\u3068\u8a2d\u5b9a\u3059\u308b\u4ee5\u5916\u306b\u3001\u30d5\u30a9\u30f3\u30c8\u540d\u3092\u76f4\u63a5\u8a18\u8f09\u3057\u8a2d\u5b9a\u3059\u308b\u3053\u3068\u3082\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001Web\u30d5\u30a9\u30f3\u30c8\u3092\u7d44\u307f\u5408\u308f\u305b\u308c\u3070\u66f4\u306b\u8c4a\u5bcc\u306a\u7a2e\u985e\u306e\u5b57\u4f53\u3092\u4f7f\u7528\u3067\u304d\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">font-family\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u30b4\u30b7\u30c3\u30af\u4f53 *\/\nfont-family: sans-serif;\n\n\/* \u660e\u671d\u4f53 *\/\nfont-family: serif;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cfont:\u300d\u30d5\u30a9\u30f3\u30c8\u95a2\u9023\u3092\u4e00\u62ec\u3067\u6307\u5b9a<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u307e\u3067\u306e\u6587\u5b57\u95a2\u9023\u306e\u8a2d\u5b9a\u3092\u4e00\u62ec\u3067\u884c\u3048\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u304c\u300cfont:\u300d\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u6587\u5b57\u306e\u30b5\u30a4\u30ba\uff08font-size\uff09\u3068\u6587\u5b57\u306e\u7a2e\u985e\uff08font-family\uff09\u306e\u8a18\u8f09\u304c\u5fc5\u9808\u3068\u306a\u308a\u3001\u305d\u308c\u4ee5\u5916\u306e\u6570\u5024\u306f\u4efb\u610f\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3042\u3089\u3086\u308b\u8a2d\u5b9a\u30921\u884c\u3067\u5b8c\u7d50\u3067\u304d\u308b\u305f\u3081\u3001\u899a\u3048\u3066\u304a\u304f\u3068\u3068\u3066\u3082\u4fbf\u5229\u306a\u30d7\u30ed\u30d1\u30c6\u30a3\u3068\u8a00\u3048\u308b\u3067\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">color\u30d7\u30ed\u30d1\u30c6\u30a3\u306e\u5024\u306f\u8a2d\u5b9a\u3067\u304d\u307e\u305b\u3093\u306e\u3067\u6ce8\u610f\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">font\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u592a\u5b57 16px \u30b4\u30b7\u30c3\u30af\u4f53 *\/\nfont: bold 16px sans-serif;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u3088\u304f\u4f7f\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3010\u30c6\u30ad\u30b9\u30c8\u7cfb\u3011<\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>CSS\u30d7\u30ed\u30d1\u30c6\u30a3<\/th><th>\u610f\u5473<\/th><\/tr><\/thead><tbody><tr><td>line-height<\/td><td>\u884c\u306e\u9ad8\u3055\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>letter-spacing<\/td><td>\u6587\u5b57\u306e\u9593\u9694\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>text-align<\/td><td>\u6a2a\u65b9\u5411\u306e\u6587\u5b57\u4f4d\u7f6e\u3092\u8a2d\u5b9a\uff08\u5de6\u53f3\u4e2d\u592e\uff09<\/td><\/tr><tr><td>vertical-align<\/td><td>\u7e26\u65b9\u5411\u306e\u6587\u5b57\u4f4d\u7f6e\u3092\u8a2d\u5b9a\uff08\u4e0a\u4e0b\u4e2d\u592e\uff09<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cline-height:\u300d\u884c\u306e\u9ad8\u3055<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u6587\u7ae0\u306e\u884c\u306e\u9ad8\u3055\u3092\u8a2d\u5b9a\u3057\u305f\u3044\u6642\u306b\u4f7f\u3046\u306e\u304c\u300cline-height:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u884c\u306e\u9ad8\u3055\u306f1\u3092\u57fa\u6e96\u306b\u30011.1\u4ee5\u4e0a\u3067\u5e83\u3081\u30010.9\u4ee5\u4e0b\u3067\u72ed\u3081\u3068\u6587\u5b57\u306e\u4e0a\u4e0b\u306e\u4f59\u767d\u3092\u6307\u5b9a\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u6570\u5024\u4ee5\u5916\u306b\u3082\u300cpx\u300d\u300cem\u300d\u300c%\u300d\u306a\u3069\u3067\u306e\u6307\u5b9a\u3082\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">line-height\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u884c\u9593\u3092\u72ed\u304f\u3059\u308b\uff08\u884c\u306e\u9ad8\u3055\u30920.8\u500d\u306b\uff09 *\/\nline-height: 0.8;\n\n\/* \u884c\u306e\u9ad8\u3055\u3092\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u306e2\u500d\u306b\u8a2d\u5b9a\uff08\u76f8\u5bfe\u5358\u4f4dem\uff09 *\/\nline-height: 2em;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cletter-spacing:\u300d\u6587\u5b57\u306e\u9593\u9694<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u6587\u5b57\u540c\u58eb\u306e\u9593\u9694\u3092\u6307\u5b9a\u3057\u305f\u3044\u5834\u5408\u306f\u300cletter-spacing:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u7528\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cpx\u300d\u3084\u300cem\u300d\u306a\u3069\u306e\u5358\u4f4d\u3092\u4f7f\u3063\u305f\u6307\u5b9a\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u6587\u5b57\u306e\u9593\u9694\u306f\u76f8\u5bfe\u7684\u306b\u6307\u5b9a\u3057\u305f\u65b9\u304c\u4f7f\u3044\u52dd\u624b\u304c\u3044\u3044\u305f\u3081\u3001\u300cem\u300d\u3067\u306e\u8a2d\u5b9a\u304c\u304a\u3059\u3059\u3081\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">letter-spacing\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u6587\u5b57\u306e\u9593\u9694\u30921\u30d4\u30af\u30bb\u30eb\u7a7a\u3051\u308b\uff08\u7d76\u5bfe\u5358\u4f4d\uff09 *\/\nletter-spacing: 1px;\n\n\/* \u6587\u5b57\u306e\u9593\u9694\u3092\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u306e0.1\u500d\u7a7a\u3051\u308b\uff08\u76f8\u5bfe\u5358\u4f4d\uff09 *\/\nletter-spacing: 0.1em;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300ctext-align:\u300d\u6a2a\u65b9\u5411\u306e\u6587\u5b57\u4f4d\u7f6e<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300ctext-align:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u3048\u3070\u3001\u6587\u5b57\u3092\u5de6\u53f3\u4e2d\u592e\u306e\u3069\u308c\u306b\u5bc4\u305b\u308b\u304b\u3092\u8a2d\u5b9a\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u521d\u671f\u5024\u306f\u5de6\u5bc4\u305b\uff08left\uff09\u306b\u306a\u3063\u3066\u3044\u307e\u3059\u304c\u3001\u898b\u51fa\u3057\u306a\u3069\u3067\u306f\u4e2d\u592e\u5bc4\u305b\uff08center\uff09\u3092\u4f7f\u3046\u3053\u3068\u3082\u591a\u3044\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001\u6298\u308a\u8fd4\u3057\u306e\u3042\u308b\u6587\u7ae0\u306e\u53f3\u5074\u3092\u7dba\u9e97\u306b\u63c3\u3048\u308b\u300cjustify\u300d\u306e\u8a2d\u5b9a\u3082\u899a\u3048\u3066\u304a\u304f\u3068\u4fbf\u5229\u304b\u3082\u3057\u308c\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">text-align\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u5de6\u5bc4\u305b *\/\ntext-align: left;\n\n\/* \u53f3\u5bc4\u305b *\/\ntext-align: right;\n\n\/* \u4e2d\u592e\u5bc4\u305b *\/\ntext-align: center;\n\n\/* \u4e21\u7aef\u63c3\u3048 *\/\ntext-align: justify;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cvertical-align:\u300d\u7e26\u65b9\u5411\u306e\u6587\u5b57\u4f4d\u7f6e<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cvertical-align:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u306f\u30c6\u30ad\u30b9\u30c8\u3084\u753b\u50cf\u306e\u7e26\u65b9\u5411\u306e\u6587\u5b57\u4f4d\u7f6e\u3092\u6307\u5b9a\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5148\u307b\u3069\u306e\u300ctext-align:\u300d\u306b\u6bd4\u3079\u308b\u3068\u4f7f\u7528\u983b\u5ea6\u306f\u4f4e\u304f\u306a\u308a\u307e\u3059\u304c\u3001\u305f\u3068\u3048\u3070\u30c6\u30fc\u30d6\u30eb\u30bb\u30eb\u5185\u306e\u8981\u7d20\u306e\u7e26\u4f4d\u7f6e\u3092\u5909\u3048\u305f\u3044\u5834\u5408\u306b\u3088\u304f\u4f7f\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30a4\u30f3\u30e9\u30a4\u30f3\u3084\u30c6\u30fc\u30d6\u30eb\u8981\u7d20\u306b\u306e\u307f\u9069\u7528\u3057\u3001\u30d6\u30ed\u30c3\u30af\u8981\u7d20\u306a\u3069\u306b\u306f\u9069\u7528\u3057\u306a\u3044\u306e\u3067\u6ce8\u610f\u304c\u5fc5\u8981\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">vertical-align\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u30d9\u30fc\u30b9\u30e9\u30a4\u30f3\u3092\u63c3\u3048\u308b *\/\nvertical-align: baseline;\n\n\/* \u4e0a\u5bc4\u305b *\/\nvertical-align: top;\n\n\/* \u4e2d\u592e\u5bc4\u305b *\/\nvertical-align: middle;\n\n\/* \u4e0b\u5bc4\u305b *\/\nvertical-align: bottom;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u3088\u304f\u4f7f\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3010\u30b5\u30a4\u30ba\u7cfb\u3011<\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>CSS\u30d7\u30ed\u30d1\u30c6\u30a3<\/th><th>\u610f\u5473<\/th><\/tr><\/thead><tbody><tr><td>width<\/td><td>\u6a2a\u5e45\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>height<\/td><td>\u7e26\u5e45\u3092\u8a2d\u5b9a<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cwidth:\u300d\u6a2a\u5e45<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u8981\u7d20\u306e\u6a2a\u5e45\u3092\u6307\u5b9a\u3059\u308b\u306e\u304c\u300cwidth:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30b5\u30a4\u30ba\u3092\u56fa\u5b9a\u3057\u305f\u3044\u5834\u5408\u306f\u300cpx\u300d\u3001\u76f8\u5bfe\u7684\u306b\u8a2d\u5b9a\u3057\u305f\u3044\u5834\u5408\u306f\u300c%\u300d\u3084\u300cvw\u300d\u306a\u3069\u306e\u5358\u4f4d\u304c\u3042\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001\u5e45\u3092\u6307\u5b9a\u3057\u305f\u304f\u306a\u3044\u5834\u5408\u306f\u300cauto\u300d\u306b\u8a2d\u5b9a\u3059\u308b\u3053\u3068\u3067\u6a2a\u5e45\u304c\u81ea\u52d5\u7684\u306b\u6c7a\u307e\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">width\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u5e45\u3092600\u30d4\u30af\u30bb\u30eb\u306b\u56fa\u5b9a\u3059\u308b *\/\nwidth: 600px;\n\n\/* \u89aa\u8981\u7d20\u306e\u5e45\u3044\u3063\u3071\u3044\u306b\u5e83\u304c\u308b *\/\nwidth: 100%;\n\n\/* \u30d3\u30e5\u30fc\u30dd\u30fc\u30c8\uff08\u753b\u9762\u306e\u5e45\uff09\u306e50%\u306e\u5e45\u306b\u8a2d\u5b9a\u3059\u308b *\/\nwidth: 50vw;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cheight:\u300d\u7e26\u5e45<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u8981\u7d20\u306e\u7e26\u5e45\u3092\u6307\u5b9a\u3059\u308b\u306e\u304c\u300cheight:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u57fa\u672c\u7684\u306a\u4f7f\u3044\u65b9\u306f\u6a2a\u5e45\u3092\u6c7a\u3081\u308b\u300cwidth:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3068\u540c\u3058\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001width\u3068height\u306e\u3069\u3061\u3089\u3082\u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\u306b\u306f\u4f7f\u3048\u306a\u3044\u306e\u3067\u6ce8\u610f\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">height\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u9ad8\u3055\u3092200\u30d4\u30af\u30bb\u30eb\u306b\u56fa\u5b9a *\/\nheight: 200px;\n\n\/* \u30d3\u30e5\u30fc\u30dd\u30fc\u30c8\uff08\u753b\u9762\u306e\u9ad8\u3055\uff09\u306e10%\u306e\u9ad8\u3055\u306b\u8a2d\u5b9a *\/\nheight: 10vh;\n\n\/* \u30b3\u30f3\u30c6\u30f3\u30c4\u306e\u9ad8\u3055\u306b\u5fdc\u3058\u3066\u81ea\u52d5\u7684\u306b\u5909\u5316 *\/\nheight: auto;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h4 class=\"wp-block-heading\">max-,min-\u3067\u7e26\u6a2a\u5e45\u306e\u6700\u5927or\u6700\u5c0f\u5024\u3092\u6307\u5b9a<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">width\u3068height\u30d7\u30ed\u30d1\u30c6\u30a3\u306f\u3001\u300cmax-width:\u300d\u300cmin-height:\u300d\u306e\u3088\u3046\u306b\u8a18\u8f09\u3059\u308b\u3068\u6700\u5c0f\u5024\u307e\u305f\u306f\u6700\u5927\u5024\u306e\u6307\u5b9a\u3082\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305f\u3068\u3048\u3070\u300cmax-width: 600px;\u300d\u3068\u6307\u5b9a\u3059\u308c\u3070\u3001\u8981\u7d20\u304c600px\u3088\u308a\u5927\u304d\u304f\u306a\u308b\u3053\u3068\u306f\u3042\u308a\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cwidth:100%;\u300d\u306a\u3069\u306e%\u5358\u4f4d\u3068\u4e00\u7dd2\u306b\u8a2d\u5b9a\u3059\u308b\u3068\u300c\u8981\u7d20\u3092\u753b\u9762\u6a2a\u5e45100%\u306b\u8868\u793a\u3059\u308b\u304c600px\u3088\u308a\u5927\u304d\u304f\u3057\u306a\u3044\u300d\u3068\u3044\u3046\u8a2d\u5b9a\u304c\u53ef\u80fd\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cmin-width:\u300d\u300cmin-height:\u300d\u306e\u5834\u5408\u306f\u9006\u306b\u8981\u7d20\u304c\u6307\u5b9a\u30b5\u30a4\u30ba\u3088\u308a\u5c0f\u3055\u304f\u306a\u308b\u3053\u3068\u306f\u3042\u308a\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u8a2d\u5b9a\u3067\u753b\u9762\u30b5\u30a4\u30ba\u306b\u5408\u308f\u305b\u8981\u7d20\u3092\u898b\u3084\u3059\u304f\u8868\u793a\u3057\u305f\u3044\u6642\u306a\u3069\u306b\u3088\u304f\u4f7f\u3046\u8a2d\u5b9a\u306a\u306e\u3067\u3001\u899a\u3048\u3066\u304a\u304f\u3068\u4fbf\u5229\u3067\u3059\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u3088\u304f\u4f7f\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3010\u4f59\u767d\u7cfb\u3011<\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>CSS\u30d7\u30ed\u30d1\u30c6\u30a3<\/th><th>\u610f\u5473<\/th><\/tr><\/thead><tbody><tr><td>padding<\/td><td>\u8981\u7d20\u306e\u5185\u5074\u306e\u4f59\u767d\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>margin<\/td><td>\u8981\u7d20\u306e\u5916\u5074\u306e\u4f59\u767d\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>box-sizing<\/td><td>\u8981\u7d20\u306e\u30b5\u30a4\u30ba\u306e\u8a08\u7b97\u65b9\u6cd5\u3092\u6307\u5b9a<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cpadding:\u300d\u8981\u7d20\u306e\u5185\u5074\u306e\u4f59\u767d<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u8981\u7d20\u306e\u5185\u5074\u306e\u4f59\u767d\u3092\u8a2d\u5b9a\u3057\u305f\u3044\u5834\u5408\u306b\u4f7f\u3046\u306e\u304c\u300cpadding:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cpadding: 10px;\u300d\u3068\u8a2d\u5b9a\u3059\u308c\u3070\u3001\u8981\u7d20\u306e\u5185\u5074\u306e4\u8fba\u5168\u3066\u306b10px\u306e\u4f59\u767d\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5358\u4f4d\u306f\u300cpx\u300d\u300c%\u300d\u300cvw\u300d\u300cvh\u300d\u306a\u3069\u304c\u4f7f\u7528\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001\u300cpadding-left:\u300d\u300cpadding-top:\u300d\u306a\u3069\u3068\u8a18\u8f09\u3059\u308c\u30701\u8fba\u306e\u307f\u306e\u4f59\u767d\u304c\u8a2d\u5b9a\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4ed6\u306b\u3082\u300cpadding: 0 10px 10px 0;\u300d\u306a\u30691\u3064\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u7570\u306a\u308b\u8a2d\u5b9a\u3092\u307e\u3068\u3081\u308b\u3053\u3068\u3082\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">padding\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u4e0a\u4e0b\u5de6\u53f3\u306b20px\u306e\u30d1\u30c7\u30a3\u30f3\u30b0 *\/\npadding: 20px;\n\n\/* \u4e0a\u4e0b\u306b10px\u3001\u5de6\u53f3\u306b0px\u306e\u30d1\u30c7\u30a3\u30f3\u30b0 *\/\npadding: 10px 0;\n\n\/* \u5de6\u5074\u306b5px\u306e\u30d1\u30c7\u30a3\u30f3\u30b0 *\/\npadding-left: 5px;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cmargin:\u300d\u8981\u7d20\u306e\u5916\u5074\u306e\u4f59\u767d<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u8981\u7d20\u306e\u5916\u5074\u306e\u4f59\u767d\u3092\u8a2d\u5b9a\u3059\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u304c\u300cmargin:\u300d\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u57fa\u672c\u7684\u306b\u306fpadding\u3068\u4f7f\u3044\u65b9\u3082\u4f7f\u3048\u308b\u5358\u4f4d\u3082\u540c\u3058\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u96a3\u63a5\u3059\u308b\u8981\u7d20\u306e\uff4dargin\u540c\u58eb\u304c\u91cd\u306a\u308b\u3068margin\u306e\u76f8\u6bba\u3068\u3044\u3046\u73fe\u8c61\u304c\u8d77\u3053\u308b\u305f\u3081\u6ce8\u610f\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">margin\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u4e0a\u4e0b\u5de6\u53f3\u306b20px\u306e\u30de\u30fc\u30b8\u30f3 *\/\nmargin: 20px;\n\n\/* \u4e0a\u4e0b\u306b10px\u3001\u5de6\u53f3\u306b0px\u306e\u30de\u30fc\u30b8\u30f3 *\/\nmargin: 10px 0;\n\n\/* \u4e0a\u5074\u306b5px\u306e\u30de\u30fc\u30b8\u30f3 *\/\nmargin-top: 5px;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h4 class=\"wp-block-heading\">padding\u3068margin\u306e\u533a\u5225<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cpadding\u3068margin\u306e\u4f7f\u3044\u5206\u3051\u304c\u96e3\u3057\u3044\u300d\u3068\u3044\u3046\u8a71\u3092\u3088\u304f\u8033\u306b\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><span class=\"swl-marker mark_yellow\"><strong>padding\u306f\u8981\u7d20\u306e\u5185\u5074\u306b\u4f59\u767d<\/strong><\/span>\u3092\u4f5c\u308a\u3001<strong><span class=\"swl-marker mark_yellow\">margin\u306f\u5916\u5074\u306b\u4f59\u767d<\/span><\/strong>\u3092\u4f5c\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u57fa\u672c\u7684\u306b\u4f59\u767d\u3068\u5e72\u6e09\u3055\u305b\u305f\u3044\u4ed6\u306e\u8981\u7d20\u304c\u8981\u7d20\u5185\u306b\u3042\u308b\u5834\u5408\u306fpadding\u3001\u8981\u7d20\u306e\u5916\u306b\u3042\u308b\u5834\u5408\u306fmargin\u3068\u3044\u3046\u611f\u899a\u3067\u4f7f\u3044\u5206\u3051\u308b\u3068\u3088\u3044\u3067\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cbox-sizing:\u300d\u8981\u7d20\u306e\u30b5\u30a4\u30ba\u306e\u8a08\u7b97\u65b9\u6cd5<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u4ed5\u7d44\u307f\u304c\u308f\u304b\u308a\u306b\u304f\u3044\u3082\u306e\u306e\u91cd\u8981\u306aCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u304c\u3053\u306e\u300cbox-sizing:\u300d\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u306fpadding\u3001margin\u3001border\u306a\u3069\u3067\u8a2d\u5b9a\u3057\u305f\u6570\u5024\u3092\u3001\u8981\u7d20\u306e\u5143\u306e\u9ad8\u3055\uff08height\uff09\u3084\u5e45\uff08width\uff09\u306b\u542b\u3081\u308b\u304b\u3092\u6307\u5b9a\u3059\u308b\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5024\u306b\u306f\u300ccontent-box;\u300d\u304b\u300cborder-box;\u300d\u304c\u5165\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">content-box;<\/h4>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"701\" src=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/08\/css-property-1-1024x701.webp\" alt=\"content-box;\u306e\u8aac\u660e\" class=\"wp-image-6226\" srcset=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/08\/css-property-1-1024x701.webp 1024w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/08\/css-property-1-300x205.webp 300w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/08\/css-property-1-768x525.webp 768w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/08\/css-property-1.webp 1200w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">content-box;\u306f\u3001\u8981\u7d20\u306ewidth\u3068height\u306b<span class=\"swl-marker mark_orange\">border\u3068padding\u306e\u30b5\u30a4\u30ba\u3092\u542b\u307f\u307e\u305b\u3093\u3002<\/span><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u306e\u304b\u308f\u308a\u3001\u5916\u5074\u306b\u8db3\u3055\u308c\u308b\u4ed5\u7d44\u307f\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u306a\u304a\u3001box-sizing\u30d7\u30ed\u30d1\u30c6\u30a3\u306e\u521d\u671f\u5024\u3067\u4f55\u3082\u6307\u5b9a\u3057\u306a\u3044\u9650\u308a\u306f\u3001\u81ea\u52d5\u7684\u306b\u3053\u306e\u5024\u304c\u8a2d\u5b9a\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">border-box;<\/h4>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"701\" src=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/08\/css-property-2-1024x701.webp\" alt=\"border-box;\u306e\u8aac\u660e\" class=\"wp-image-6227\" srcset=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/08\/css-property-2-1024x701.webp 1024w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/08\/css-property-2-300x205.webp 300w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/08\/css-property-2-768x525.webp 768w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/08\/css-property-2.webp 1200w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n<p class=\"wp-block-paragraph\">border-box;\u306f\u3001\u8981\u7d20\u306ewidth\u3068height\u306b<span class=\"swl-marker mark_orange\">border\u3068padding\u306e\u30b5\u30a4\u30ba\u3092\u542b\u307f\u307e\u3059\u3002<\/span><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30ec\u30a4\u30a2\u30a6\u30c8\u306e\u8a08\u7b97\u3092\u7c21\u5358\u306b\u3059\u308b\u305f\u3081\u306b\u3001\u5168\u8981\u7d20\u306b\u4e00\u62ec\u3067\u3053\u306e\u5024\u3092\u8a2d\u5b9a\u3059\u308b\u306e\u304c\u4e3b\u6d41\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">content-box;\u3068border-box;\u306e\u6bd4\u8f03\u4f8b<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">\u4e0a\u8a18\u30672\u3064\u306e\u9055\u3044\u3092\u8aac\u660e\u3057\u307e\u3057\u305f\u304c\u3001\u5b9f\u969b\u306b\u3069\u3046\u4f5c\u7528\u3059\u308b\u306e\u304b\u5206\u304b\u308a\u3065\u3089\u3044\u304b\u3068\u601d\u3044\u307e\u3059\u306e\u3067\u3001\u3053\u3053\u3067\u5177\u4f53\u4f8b\u3092\u898b\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"649\" src=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/10\/css-property-3-1024x649.webp\" alt=\"content-box;\u3068border-box;\u306e\u6bd4\u8f03\u4f8b\" class=\"wp-image-6233\" srcset=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/10\/css-property-3-1024x649.webp 1024w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/10\/css-property-3-300x190.webp 300w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/10\/css-property-3-768x487.webp 768w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/10\/css-property-3.webp 1200w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n<p class=\"wp-block-paragraph\">width: 500px\u3001height: 400px\u3001padding: 120px\u306e\u8981\u7d20\u304c\u3042\u308b\u3068\u3057\u3066\u3001\u5b9f\u969b\u306e\u30b5\u30a4\u30ba\u306f\u4e0a\u56f3\u306e\u3088\u3046\u306b\u7570\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<div class=\"wp-block-custom-box-with-style\"><div class=\"is-style-underline withTitle border-2 rounded-lg overflow-hidden bg-[#F8F8F8] border-transparent\"><span role=\"heading\" class=\"block font-bold !mx-0 !my-0 before:!hidden border-b border-[#D3E0E0] !pt-5 md:!pt-6 !px-2 !pb-3 !mx-4 md:!mx-6\">\u300cbox-sizing: content-box;\u300d\u3092\u8a2d\u5b9a or \u672a\u8a2d\u5b9a\u306e\u5834\u5408<\/span><div class=\"!p-5 md:!p-8 !pt-5 md:!pt-6 !m-0 [&amp;&gt;*]:!mb-4 [&amp;&gt;*]:last:!mb-0\">\n<p class=\"wp-block-paragraph\">\u8981\u7d20\uff08<code>&lt;a&gt;<\/code>\u3084<code>&lt;div&gt;<\/code>\u306a\u3069\uff09\u306e\u4e2d\u8eab\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u30b5\u30a4\u30ba\uff08width: 500px\u3001height: 100px\uff09\u306bpadding: 10px\u306f\u542b\u307e\u308c\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u306e\u304b\u308f\u308apadding \u306f\u3053\u306e\u30b5\u30a4\u30ba\u306b \u8ffd\u52a0\u3055\u308c\u308b \u305f\u3081\u3001\u5b9f\u969b\u306e\u8868\u793a\u30b5\u30a4\u30ba\uff08\u5916\u5074\u307e\u3067\u542b\u3081\u305f\u30b5\u30a4\u30ba\uff09\u306f\u4ee5\u4e0b\u306e\u901a\u308a\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3010\u6a2a\u5e45\u3011<br>500px + 10px\uff08\u5de6\uff09 + 10px\uff08\u53f3\uff09\uff1d520px<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3010\u7e26\u5e45\u3011<br>100px + 10px\uff08\u4e0a\uff09 + 10px\uff08\u4e0b\uff09\uff1d120px<\/p>\n<\/div><\/div><\/div>\n\n\n\n<div class=\"wp-block-custom-box-with-style\"><div class=\"is-style-underline withTitle border-2 rounded-lg overflow-hidden bg-[#F8F8F8] border-transparent\"><span role=\"heading\" class=\"block font-bold !mx-0 !my-0 before:!hidden border-b border-[#D3E0E0] !pt-5 md:!pt-6 !px-2 !pb-3 !mx-4 md:!mx-6\">\u300cbox-sizing: border-box;\u300d\u3092\u8a2d\u5b9a\u3057\u305f\u5834\u5408<\/span><div class=\"!p-5 md:!p-8 !pt-5 md:!pt-6 !m-0 [&amp;&gt;*]:!mb-4 [&amp;&gt;*]:last:!mb-0\">\n<p class=\"wp-block-paragraph\">\u8981\u7d20\uff08<code>&lt;a&gt;<\/code>\u3084<code>&lt;div&gt;<\/code>\u306a\u3069\uff09\u306e\u4e2d\u8eab\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u30b5\u30a4\u30ba\u306f <strong>\u300cpadding \u3084 border \u3082\u542b\u3081\u305f\u5168\u4f53\u30b5\u30a4\u30ba\u300d<\/strong>\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3064\u307e\u308a\u3001padding \u3092\u8a2d\u5b9a\u3059\u308b\u3068\u3001\u305d\u306e\u5206\u3060\u3051\u4e2d\u8eab\uff08content\uff09\u306e\u8868\u793a\u9818\u57df\u304c\u7e2e\u307e\u308b \u5f62\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3010\u6a2a\u5e45\u3011<br>\u5168\u4f53\u3067500px \u2192 \u4e2d\u8eab\u306f 500px &#8211; 10px\uff08\u5de6\uff09 &#8211; 10px\uff08\u53f3\uff09\uff1d480px<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3010\u7e26\u5e45\u3011<br>\u5168\u4f53\u3067100px \u2192 \u4e2d\u8eab\u306f 100px &#8211; 10px\uff08\u4e0a\uff09 &#8211; 10px\uff08\u4e0b\uff09\uff1d80px<\/p>\n<\/div><\/div><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u3088\u3046\u306bcontent-box\u3092\u8a2d\u5b9a\u3057\u305f\u6642\u306f\u3001width\u306a\u3069\u3067\u8a2d\u5b9a\u3057\u305f\u30b5\u30a4\u30ba\u306bpadding\u306a\u3069\u306e\u6570\u5024\u304c\u66f4\u306b\u52a0\u7b97\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">border-box\u306e\u6642\u306fwidth\u3067\u8a2d\u5b9a\u3057\u305f\u6570\u5024\u304c\u512a\u5148\u3055\u308c\u3001\u305d\u308c\u3088\u308a\u8981\u7d20\u306e\u5927\u304d\u3055\u304c\u81a8\u3089\u3080\u3053\u3068\u306f\u3042\u308a\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306ebox-sizing\u306e\u8a2d\u5b9a\u3092\u610f\u8b58\u3057\u306a\u3044\u3068\u601d\u3063\u3066\u3044\u305f\u30b5\u30a4\u30ba\u3068\u7570\u306a\u308b\u5f62\u3067\u66f8\u304d\u51fa\u3055\u308c\u3066\u3057\u307e\u3044\u307e\u3059\u306e\u3067\u3001\u5fc5\u305a\u610f\u8b58\u3059\u308b\u3088\u3046\u306b\u3057\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u3088\u304f\u4f7f\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3010\u67a0\u7dda\u7cfb\u3011<\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>CSS\u30d7\u30ed\u30d1\u30c6\u30a3<\/th><th>\u610f\u5473<\/th><\/tr><\/thead><tbody><tr><td>border-width<\/td><td>\u67a0\u7dda\u306e\u592a\u3055\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>border-color<\/td><td>\u67a0\u7dda\u306e\u8272\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>border-style<\/td><td>\u67a0\u7dda\u306e\u30b9\u30bf\u30a4\u30eb\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>border<\/td><td>\u67a0\u7dda\u95a2\u9023\u3092\u4e00\u62ec\u3067\u6307\u5b9a<\/td><\/tr><tr><td>border-radius<\/td><td>\u89d2\u306e\u4e38\u3055\u3092\u8a2d\u5b9a<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cborder-width:\u300d\u67a0\u7dda\u306e\u592a\u3055<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u67a0\u7dda\u306e\u592a\u3055\u3092\u8a2d\u5b9a\u3059\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u304c\u300cborder-width:\u300d\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u8981\u7d20\u306b\u300cborder-width: 1px;\u300d\u3068\u8a2d\u5b9a\u3059\u308c\u3070\u3001\u8981\u7d20\u306e4\u8fba\u306b1px\u5e45\u306e\u67a0\u7dda\u304c\u8868\u793a\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cborder-width-right:\u300d\u306e\u3088\u3046\u306b\u66f8\u3051\u30701\u8fba\u305a\u3064\u5024\u3092\u8a2d\u5b9a\u3059\u308b\u3053\u3068\u3082\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">border-width\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u67a0\u7dda\u306e\u592a\u3055\u30924\u30d4\u30af\u30bb\u30eb\u306b\u8a2d\u5b9a\u3059\u308b *\/\nborder-width: 4px;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cborder-color:\u300d\u67a0\u7dda\u306e\u8272<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u67a0\u7dda\u306e\u8272\u3092\u8a2d\u5b9a\u3059\u308b\u5834\u5408\u306f\u300cborder-color:\u300d\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u8272\u306e\u7a2e\u985e\u306fred\u306a\u3069\u306e\u30ab\u30e9\u30fc\u30cd\u30fc\u30e0\u306e\u4ed6\u3001\u30ab\u30e9\u30fc\u30b3\u30fc\u30c9\u3084RGB\u306a\u3069\u3067\u306e\u6307\u5b9a\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">border-color\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u67a0\u7dda\u306e\u8272\u3092\u9ed2\u306b\u8a2d\u5b9a\uff08\u30ad\u30fc\u30ef\u30fc\u30c9\u6307\u5b9a\uff09 *\/\nborder-color: black;\n\n\/* \u67a0\u7dda\u306e\u8272\u3092\u9ed2\u306b\u8a2d\u5b9a\uff0816\u9032\u6570\u6307\u5b9a\uff09 *\/\nborder-color: #000;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cborder-style:\u300d\u67a0\u7dda\u306e\u30b9\u30bf\u30a4\u30eb<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u67a0\u7dda\u306e\u7a2e\u985e\u3092\u8a2d\u5b9a\u3067\u304d\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u306f\u300cborder-style:\u300d\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u521d\u671f\u5024\u304cnone\uff08\u975e\u8868\u793a\uff09\u306e\u305f\u3081\u3001\u3053\u306eborder-style\u3092\u8a2d\u5b9a\u3057\u306a\u3044\u3068\u67a0\u7dda\u304c\u8868\u793a\u3055\u308c\u306a\u3044\u306e\u3067\u6ce8\u610f\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u6700\u3082\u30b9\u30bf\u30f3\u30c0\u30fc\u30c9\u306a\u76f4\u7dda\u306f\u300cborder-style: solid;\u300d\u3067\u8a2d\u5b9a\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u306e\u4ed6\u3001\u30c9\u30c3\u30c8\u7dda\u3084\u30c0\u30c3\u30b7\u30e5\u7dda\u3001\u4e8c\u91cd\u7dda\u306a\u3069\u306e\u8a2d\u5b9a\u3082\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">border-style\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u7dda\u306a\u3057 *\/\nborder-style: none;\n\n\/* \u76f4\u7dda *\/\nborder-style: solid;\n\n\/* \u30c9\u30c3\u30c8\u7dda *\/\nborder-style: dotted;\n\n\/* \u30c0\u30c3\u30b7\u30e5\u7dda *\/\nborder-style: dashed;\n\n\/* \u4e8c\u91cd\u7dda *\/\nborder-style: double;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cborder:\u300d\u67a0\u7dda\u95a2\u9023\u3092\u4e00\u62ec\u3067\u6307\u5b9a<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u307e\u3067\u306e\u67a0\u7dda\u8a2d\u5b9a\u306f\u300cborder:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u4e00\u62ec\u6307\u5b9a\u3059\u308b\u3053\u3068\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u7279\u306bborder\u30d7\u30ed\u30d1\u30c6\u30a3\u306f\u500b\u5225\u306b\u66f8\u304f\u3088\u308a\u4e00\u62ec\u6307\u5b9a\u306e\u65b9\u304c\u4f7f\u3044\u52dd\u624b\u3082\u3044\u3044\u304b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5f62\u3092\u899a\u3048\u3066\u4f7f\u3044\u3053\u306a\u305b\u308b\u3088\u3046\u306b\u3057\u3066\u304a\u304f\u3068\u3044\u3044\u3067\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">border\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* 1\u30d4\u30af\u30bb\u30eb\u306e\u592a\u3055\u3067\u3001\u5b9f\u7dda\uff08solid\uff09\u3001\u8272\u306f\u9ed2\uff08#000\uff09\u306e\u67a0\u7dda *\/\nborder: 1px solid #000;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cborder-radius:\u300d\u89d2\u306e\u4e38\u3055<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u8981\u7d20\u306e\u89d2\u306e\u4e38\u3055\u3092\u6307\u5b9a\u3057\u305f\u3044\u5834\u5408\u306f\u300cborder-radius:\u300d\u306eCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u7528\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5358\u4f4d\u306f\u300cpx\u300d\u3084\u300c%\u300d\u306a\u3069\u304c\u4f7f\u3048\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u300cborder-radius: 10px 0;\u300d\u306e\u3088\u3046\u306b\u89d2\u3054\u3068\u306b\u8a2d\u5b9a\u3092\u5909\u3048\u308b\u3053\u3068\u3082\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4ed6\u306b\u3082\u300cborder-radius: 50%;\u300d\u3068\u6307\u5b9a\u3059\u308b\u3068\u5186\u3092\u4f5c\u308b\u3053\u3068\u3082\u3067\u304d\u3001\u30c7\u30b6\u30a4\u30f3\u306b\u4fbf\u5229\u306aCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">border-radius\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u5de6\u4e0a5px \u53f3\u4e0a5px \u53f3\u4e0b0px \u5de6\u4e0b0px *\/\nborder-radius: 5px 5px 0 0;\n\n\/* \u5186\u5f62\u3092\u4f5c\u6210 *\/\nborder-radius: 50%;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u3088\u304f\u4f7f\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3010\u80cc\u666f\u7cfb\u3011<\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>CSS\u30d7\u30ed\u30d1\u30c6\u30a3<\/th><th>\u610f\u5473<\/th><\/tr><\/thead><tbody><tr><td>background-color<\/td><td>\u80cc\u666f\u306e\u8272<\/td><\/tr><tr><td>background-image<\/td><td>\u80cc\u666f\u306e\u753b\u50cf<\/td><\/tr><tr><td>background-repeat<\/td><td>\u80cc\u666f\u306e\u7e70\u308a\u8fd4\u3057<\/td><\/tr><tr><td>background-position<\/td><td>\u80cc\u666f\u306e\u4f4d\u7f6e<\/td><\/tr><tr><td>background<\/td><td>\u80cc\u666f\u95a2\u9023\u3092\u4e00\u62ec\u3067\u6307\u5b9a<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cbackground-color:\u300d\u80cc\u666f\u306e\u8272<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cbackground-color:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u306f\u3001\u80cc\u666f\u306e\u8272\u3092\u8a2d\u5b9a\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u3082\u4ed6\u306e\u8272\u6307\u5b9a\u306eCSS\u30b3\u30fc\u30c9\u3068\u540c\u69d8\u306b\u3001\u30ab\u30e9\u30fc\u30cd\u30fc\u30e0\u3084\u30ab\u30e9\u30fc\u30b3\u30fc\u30c9\u3001RGB\u304c\u4f7f\u7528\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001RGBA\u3067\u8a18\u8f09\u3059\u308c\u3070\u8272\u306e\u6570\u5024\u306e\u4ed6\u306b\u4e0d\u900f\u660e\u5ea6\u306e\u8a2d\u5b9a\u3082\u884c\u3048\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">background-color\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u80cc\u666f\u8272\u3092\u9752\u306b\u8a2d\u5b9a *\/\nbackground-color: blue;\n\n\/* \u80cc\u666f\u8272\u3092\u8d64\uff0816\u9032\u6570\u6307\u5b9a\uff09\u306b\u8a2d\u5b9a *\/\nbackground-color: #FF0000;\n\n\/* \u80cc\u666f\u8272\u3092\u4e0d\u900f\u660e\u5ea650%\u306e\u9ec4\u8272\u306b\u8a2d\u5b9a *\/\nbackground-color: rgba(255, 255, 0, 0.5);<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cbackground-image:\u300d\u80cc\u666f\u306e\u753b\u50cf<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cbackground-image:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u306f\u80cc\u666f\u753b\u50cf\u306e\u8a2d\u5b9a\u3092\u884c\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cbackground-image: url(img.jpg);\u300d\u306e\u3088\u3046\u306b\u66f8\u304d\u3001\u30ab\u30c3\u30b3\u5185\u306b\u306f\u80cc\u666f\u306b\u4f7f\u7528\u3057\u305f\u3044\u5199\u771f\u3084\u6a21\u69d8\u306e\u753b\u50cf\u306eURL\u3092\u8a2d\u5b9a\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">background-image\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u80cc\u666f\u753b\u50cf\u3092\u6307\u5b9a\uff08img\u30d5\u30a9\u30eb\u30c0\u5185\u306esample.jpg\uff09 *\/\nbackground-image: url(img\/sample.jpg);<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cbackground-repeat:\u300d\u80cc\u666f\u306e\u7e70\u308a\u8fd4\u3057<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u80cc\u666f\u306e\u7e70\u308a\u8fd4\u3057\u8a2d\u5b9a\u3092\u3059\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u304c\u300cbackground-repeat:\u300d\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u7e70\u308a\u8fd4\u3059\u5834\u5408\u306f\u300cbackground-repeat: repeat;\u300d\u3001\u7e70\u308a\u8fd4\u3055\u306a\u3044\u5834\u5408\u306f\u300cbackground-repeat: no-repeat;\u300d\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001repeat-x\u3092\u4f7f\u7528\u3059\u308c\u3070\u6a2a\u65b9\u5411\u306e\u307f\u3001repeat-y\u3092\u4f7f\u7528\u3059\u308c\u3070\u7e26\u65b9\u5411\u306e\u307f\u306e\u30ea\u30d4\u30fc\u30c8\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u80cc\u666f\u304c\u67c4\u6a21\u69d8\u306e\u5834\u5408\u306frepeat\u8a2d\u5b9a\u306b\u3059\u308b\u3053\u3068\u3067\u3001\u8981\u7d20\u3044\u3063\u3071\u3044\u306b\u6a21\u69d8\u3092\u6577\u304d\u8a70\u3081\u308b\u3053\u3068\u304c\u3067\u304d\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">background-image\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u80cc\u666f\u753b\u50cf\u3092\u6a2a\u30fb\u7e26\u65b9\u5411\u306b\u7e70\u308a\u8fd4\u3059\uff08\u30c7\u30d5\u30a9\u30eb\u30c8\uff09 *\/\nbackground-repeat: repeat;\n\n\/* \u80cc\u666f\u753b\u50cf\u3092\u7e70\u308a\u8fd4\u3055\u306a\u3044 *\/\nbackground-repeat: no-repeat;\n\n\/* \u80cc\u666f\u753b\u50cf\u3092\u7e26\u65b9\u5411\u306e\u307f\u306b\u7e70\u308a\u8fd4\u3059 *\/\nbackground-repeat: repeat-y;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cbackground-position:\u300d\u80cc\u666f\u306e\u4f4d\u7f6e<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u80cc\u666f\u753b\u50cf\u306e\u4f4d\u7f6e\u8a2d\u5b9a\u3092\u884c\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u304c\u300cbackground-position:\u300d\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300ctop\u300d\u300cleft\u300d\u300ccenter\u300d\u306a\u3069\u306e\u30ef\u30fc\u30c9\u8a2d\u5b9a\u306e\u4ed6\u3001\u300cpx\u300d\u300c%\u300d\u3067\u306e\u8a2d\u5b9a\u3082\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u753b\u9762\u3044\u3063\u3071\u3044\u306e\u80cc\u666f\u3067\u306f\u306a\u304f\u30ef\u30f3\u30dd\u30a4\u30f3\u30c8\u753b\u50cf\u3092\u80cc\u666f\u306b\u5165\u308c\u305f\u3044\u5834\u5408\u3001\u3053\u306ebackground-position\u3092\u4f7f\u3046\u3068\u7d30\u304b\u304f\u914d\u7f6e\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">background-position\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u80cc\u666f\u753b\u50cf\u3092\u5de6\u4e0a\uff08top left\uff09\u306b\u914d\u7f6e\u3059\u308b *\/\nbackground-position: top left;\n\n\/* \u80cc\u666f\u753b\u50cf\u3092\u5de6\u304b\u308910px\u3001\u4e0a\u304b\u308950px\u306e\u4f4d\u7f6e\u306b\u914d\u7f6e\u3059\u308b *\/\nbackground-position: 10px 50px;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cbackground:\u300d\u80cc\u666f\u95a2\u9023\u3092\u4e00\u62ec\u3067\u6307\u5b9a<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cbackground:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u3048\u3070\u3001\u80cc\u666f\u95a2\u9023\u306e\u8a2d\u5b9a\u3092\u4e00\u62ec\u3067\u884c\u3046\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4ed6\u306e\u4e00\u62ec\u8a2d\u5b9a\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u306b\u6bd4\u3079\u8a18\u8ff0\u304c\u8907\u96d1\u306a\u306e\u3067\u3059\u304c\u3001CSS\u3092\u3059\u3063\u304d\u308a\u307e\u3068\u3081\u305f\u3044\u5834\u5408\u306b\u306f\u4f7f\u7528\u3057\u3066\u307f\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">background\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u80cc\u666f\u753b\u50cf\u3092\u6307\u5b9a\u3057\u3001\u7e70\u308a\u8fd4\u3055\u305a\u3001\u4e2d\u592e\u306b\u914d\u7f6e\u3057\u3001\u753b\u50cf\u30b5\u30a4\u30ba\u3092\u8981\u7d20\u5185\u306b\u53ce\u307e\u308b\u3088\u3046\u306b\u8abf\u6574 *\/\nbackground: url(img\/bg.jpg) no-repeat center \/ contain;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u3088\u304f\u4f7f\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3010\u8981\u7d20\u7cfb\u3011<\/h2>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"838\" height=\"1024\" src=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/10\/css-property-4-838x1024.webp\" alt=\"\u3088\u304f\u4f7f\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3010\u8981\u7d20\u7cfb\u3011\" class=\"wp-image-6240\" srcset=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/10\/css-property-4-838x1024.webp 838w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/10\/css-property-4-246x300.webp 246w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/10\/css-property-4-768x938.webp 768w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/10\/css-property-4.webp 1200w\" sizes=\"(max-width: 838px) 100vw, 838px\" \/><\/figure>\n<\/div>\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>CSS\u30d7\u30ed\u30d1\u30c6\u30a3<\/th><th>\u610f\u5473<\/th><\/tr><\/thead><tbody><tr><td>display: none;<\/td><td>\u8981\u7d20\u3092\u975e\u8868\u793a\u306b\u8a2d\u5b9a<\/td><\/tr><tr><td>display: inline;<\/td><td>\u30c6\u30ad\u30b9\u30c8\u7b49\u306b\u9069\u3057\u305f\u8981\u7d20<\/td><\/tr><tr><td>display: block;<\/td><td>\u30d6\u30ed\u30c3\u30af\u578b\u8981\u7d20<\/td><\/tr><tr><td>display: inline-block;<\/td><td>\u30a4\u30f3\u30e9\u30a4\u30f3\u3068\u30d6\u30ed\u30c3\u30af\u306e\u4e21\u65b9\u306e\u6027\u8cea\u3092\u6301\u3064\u8981\u7d20<\/td><\/tr><tr><td>display: flex;<\/td><td>\u30ec\u30a4\u30a2\u30a6\u30c8\u306b\u9069\u3057\u305f\u8981\u7d20<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cdisplay: none;\u300d\u8981\u7d20\u3092\u975e\u8868\u793a\u306b<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u8981\u7d20\u3092\u975e\u8868\u793a\u306b\u3067\u304d\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u304c\u300cdisplay: none;\u300d\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5bfe\u8c61\u306e\u8981\u7d20\u306f\u5b58\u5728\u3057\u306a\u3044\u3053\u3068\u306b\u306a\u308b\u305f\u3081\u3001\u6b21\u306e\u8981\u7d20\u304c\u3042\u308c\u3070\u8a70\u3081\u3066\u8868\u793a\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u5bfe\u5fdc\u306e\u6642\u306b\u3088\u304f\u4f7f\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">display: none;\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">\u4e0b\u8a18\u306f\u3001 sample\u3068\u3044\u3046\u8981\u7d20\u3092\u975e\u8868\u793a\u306b\u3059\u308b\u30b3\u30fc\u30c9\u4f8b\u3067\u3059\u3002<\/p>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">.sample {\n  color: white; \/* \u30c6\u30ad\u30b9\u30c8\u306e\u8272\u3092\u767d *\/\n  background: #E26363; \/* \u80cc\u666f\u8272\u3092\u8d64\u7cfb *\/\n  display: none; \/* \u8981\u7d20\u3092\u5b8c\u5168\u306b\u975e\u8868\u793a *\/\n}<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cdisplay: inline;\u300d\u30c6\u30ad\u30b9\u30c8\u7b49\u306b\u9069\u3057\u305f\u8981\u7d20<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">HTML\u306e\u30bf\u30b0\u306b\u6307\u5b9a\u3055\u308c\u3066\u3044\u308b\u8981\u7d20\u3092\u3001\u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\u306b\u5909\u3048\u308b\u3053\u3068\u304c\u3067\u304d\u308b\u306e\u304c\u300cdisplay: inline;\u300d\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\u306f\u3001\u30c6\u30ad\u30b9\u30c8\u306e\u4e00\u90e8\u3068\u3057\u3066\u8868\u793a\u3055\u308c\u308b\u8981\u7d20\u306e\u3053\u3068\u3092\u6307\u3057\u3001\u30d6\u30ed\u30c3\u30af\u8981\u7d20\u306e\u5bfe\u306b\u306a\u308b\u3082\u306e\u3068\u3057\u3066\u6271\u308f\u308c\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4e3b\u306b\u30c6\u30ad\u30b9\u30c8\u5185\u3067\u4f7f\u308f\u308c\u308b\u8981\u7d20\uff08\u30ea\u30f3\u30af\u3092\u8868\u3059<code>&lt;a&gt;<\/code>\u3084\u3001\u7279\u5b9a\u306e\u90e8\u5206\u306b\u30b9\u30bf\u30a4\u30eb\u3092\u9069\u7528\u3055\u305b\u308b<code>&lt;span&gt;<\/code>\u306a\u3069\uff09\u306b\u9069\u7528\u3055\u308c\u3001\u96a3\u63a5\u3059\u308b\u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\u306f\u81ea\u52d5\u7684\u306b\u6a2a\u4e26\u3073\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u306a\u304a\u3001\u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\u306f\u300cwidth\u3084height\u3092\u6307\u5b9a\u3067\u304d\u306a\u3044\u300d\u300c\u4e0a\u4e0b\u306emargin\u3068padding\u304c\u8a2d\u5b9a\u3067\u304d\u306a\u3044\u300d\u306a\u3069\u5236\u9650\u304c\u3042\u308b\u306e\u3067\u6ce8\u610f\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">display: inline;\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">\u672c\u6765\u306f\u30d6\u30ed\u30c3\u30af\u8981\u7d20\u3067\u3042\u308b<code>&lt;p&gt;<\/code>\u3092\u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\u3068\u3057\u3066\u8868\u793a\u3059\u308b\u4f8b\u3092\u7d39\u4ecb\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f8b\uff09sample\u3068\u3044\u3046\u30af\u30e9\u30b9\u540d\u306e\u8981\u7d20\u306b\u300cdisplay: inline;\u3001\u6587\u5b57\u3092\u767d\u3001\u80cc\u666f\u3092#E26363\u300d\u306e\u6307\u793a\u3092\u8a18\u8ff0<\/p>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><span role=\"heading\" class=\"!px-6 !py-3 bg-[#7b8b8d] block !-mt-10 !-ml-8 w-fit rounded-br-sm text-white\">HTML<\/span><div class=\"!mt-4\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">&lt;p class=\"sample\">\u304a\u306f\u3088\u3046\u3054\u3056\u3044\u307e\u3059\u3002&lt;\/p>\n&lt;p class=\"sample\">\u3053\u3093\u306b\u3061\u306f\u3002&lt;\/p><\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><span role=\"heading\" class=\"!px-6 !py-3 bg-[#7b8b8d] block !-mt-10 !-ml-8 w-fit rounded-br-sm text-white\">CSS<\/span><div class=\"!mt-4\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">.sample{\ndisplay: inline; \/* \u8981\u7d20\u3092\u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\u3068\u3057\u3066\u8868\u793a *\/\ncolor: white; \/* \u30c6\u30ad\u30b9\u30c8\u306e\u8272\u3092\u767d *\/\nbackground:#E26363; \/* \u80cc\u666f\u8272\u3092\u8d64\u7cfb *\/\n}<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<p class=\"u-mb-ctrl u-mb-0 wp-block-paragraph\"><strong>\u898b\u3048\u65b9<\/strong><\/p>\n\n\n\n<p class=\"has-border -border01 wp-block-paragraph\" style=\"font-size:14px\"><span class=\"swl-bg-color has-swl-deep-01-background-color\">\u304a\u306f\u3088\u3046\u3054\u3056\u3044\u307e\u3059\u3002<\/span> <span class=\"swl-bg-color has-swl-deep-01-background-color\">\u3053\u3093\u306b\u3061\u306f\u3002<\/span><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><code>&lt;p&gt;<\/code>\u306f\u672c\u6765\u30d6\u30ed\u30c3\u30af\u8981\u7d20\u306a\u306e\u3067\u3001display: inline;\u3092\u6307\u793a\u3057\u306a\u3051\u308c\u3070\u300c\u304a\u306f\u3088\u3046\u3054\u3056\u3044\u307e\u3059\u3002\u300d\u3068\u300c\u3053\u3093\u306b\u3061\u306f\u3002\u300d\u304c\u6539\u884c\u3055\u308c\u3066\u7e26\u306b\u4e26\u3076\u5f62\u3067\u8868\u793a\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3057\u304b\u3057\u3001\u4f8b\u306e\u3088\u3046\u306bdisplay: inline;\u3092\u6307\u793a\u3059\u308b\u3053\u3068\u3067\u3001\u6a2a\u4e26\u3073\u306b\u306a\u308a\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cdisplay: block;\u300d\u30d6\u30ed\u30c3\u30af\u578b\u306e\u8981\u7d20<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u8981\u7d20\u3092\u5f37\u5236\u7684\u306b\u30d6\u30ed\u30c3\u30af\u578b\u306b\u5909\u66f4\u3059\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u304c\u300cdisplay: block;\u300d\u3067\u3001\u5148\u307b\u3069\u7d39\u4ecb\u3057\u305f\u300cdisplay: inline;\u300d\u3068\u5bfe\u306b\u306a\u308b\u3082\u306e\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f8b\u3048\u3070\u3001<code>&lt;span&gt;<\/code>\u3084<code>&lt;a&gt;<\/code>\u3068\u3044\u3063\u305f\u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\uff08\u6a2a\u4e26\u3073\u306b\u306a\u308b\uff09\u3092\u30d6\u30ed\u30c3\u30af\u8981\u7d20\u306b\u3059\u308b\u3053\u3068\u3067\u3001\u6539\u884c\u3055\u305b\u305f\u308a\u5e45\u30fb\u9ad8\u3055\u3092\u6307\u5b9a\u3057\u305f\u308a\u3001\u30dc\u30bf\u30f3\u3068\u3057\u3066\u898b\u305b\u305f\u3044\u6642\u306b\u3088\u304f\u4f7f\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001<span class=\"swl-marker mark_yellow\">width\u3084height\uff08\u5e45\u3068\u9ad8\u3055\uff09\u3001\u4e0a\u4e0b\u5de6\u53f3\u306emargin\u3068padding\uff08\u4f59\u767d\uff09\u306a\u3069\u3082\u8a2d\u5b9a\u53ef\u80fd<\/span>\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">display: block;\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">\u672c\u6765\u306f\u30a4\u30f3\u30e9\u30a4\u30f3\u30dc\u30c3\u30af\u30b9\u3067\u3042\u308b<code>&lt;a&gt;<\/code>\u3092\u30d6\u30ed\u30c3\u30af\u8981\u7d20\u3068\u3057\u3066\u8868\u793a\u3059\u308b\u4f8b\u3092\u7d39\u4ecb\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><span role=\"heading\" class=\"!px-6 !py-3 bg-[#7b8b8d] block !-mt-10 !-ml-8 w-fit rounded-br-sm text-white\">HTML<\/span><div class=\"!mt-4\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">&lt;a href=\"URL\" class=\"sample\">\u30ea\u30f3\u30af\uff21&lt;\/a>\n&lt;a href=\"URL\" class=\"sample\">\u30ea\u30f3\u30af\uff22&lt;\/a>\n&lt;a href=\"URL\" class=\"sample\">\u30ea\u30f3\u30af\uff23&lt;\/a><\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305a\u306f\u3001CSS\u306bdisplay: block;\u3092\u6307\u793a\u3057\u306a\u3044\u307e\u307e\u3060\u3068\u3001\u3069\u3093\u306a\u898b\u305f\u76ee\u306b\u306a\u308b\u306e\u304b\u3092\u78ba\u8a8d\u3057\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<p class=\"u-mb-ctrl u-mb-0 wp-block-paragraph\"><strong>display: block;\u306a\u3057\u306e\u898b\u3048\u65b9<\/strong><\/p>\n\n\n\n<p class=\"has-border -border01 wp-block-paragraph\" style=\"font-size:14px\"><span style=\"color:#0000ee\" class=\"swl-inline-color\"><span style=\"text-decoration: underline;\">\u30ea\u30f3\u30af\uff21<\/span>&nbsp;<span style=\"text-decoration: underline;\">\u30ea\u30f3\u30af\uff22<\/span>&nbsp;<span style=\"text-decoration: underline;\">\u30ea\u30f3\u30af\uff23<\/span><\/span><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><code>&lt;a&gt;<\/code>\u306f\u30a4\u30f3\u30e9\u30a4\u30f3\u30dc\u30c3\u30af\u30b9\u306a\u306e\u3067\u3001\u6a2a\u4e26\u3073\u3067\u8868\u793a\u3055\u308c\u3066\u3044\u307e\u3059\u306d\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3064\u3065\u3044\u3066\u3001CSS\u306bdisplay: block;\u3092\u6307\u793a\u3059\u308b\u3068\u2026<\/p>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><span role=\"heading\" class=\"!px-6 !py-3 bg-[#7b8b8d] block !-mt-10 !-ml-8 w-fit rounded-br-sm text-white\">CSS<\/span><div class=\"!mt-4\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">.sample{\ndisplay:block; \/* \u8981\u7d20\u3092\u30d6\u30ed\u30c3\u30af\u8981\u7d20\u3068\u3057\u3066\u8868\u793a *\/\n}<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<p class=\"u-mb-ctrl u-mb-0 wp-block-paragraph\"><strong>display: block;\u3042\u308a\u306e\u898b\u3048\u65b9<\/strong><\/p>\n\n\n\n<p class=\"has-border -border01 wp-block-paragraph\" style=\"font-size:14px\"><span style=\"color:#0000ee\" class=\"swl-inline-color\"><span style=\"text-decoration: underline;\">\u30ea\u30f3\u30af\uff21<\/span><br><span style=\"text-decoration: underline;\">\u30ea\u30f3\u30af\uff22<\/span><br><span style=\"text-decoration: underline;\">\u30ea\u30f3\u30af\uff23<\/span><\/span><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u6539\u884c\u304c\u5165\u308a\u3001\u7e26\u4e26\u3073\u306b\u306a\u308a\u307e\u3057\u305f\u3002\u3053\u306e\u4ed6\u306b\u3082\u3001\u5e45\u3084\u9ad8\u3055\u3001\u4f59\u767d\u3084\u80cc\u666f\u306a\u3069\u3092\u8a2d\u5b9a\u3059\u308c\u3070\u3001\u3088\u308a\u30dc\u30bf\u30f3\u3089\u3057\u3044\u898b\u305f\u76ee\u306b\u306a\u308b\u3067\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cdisplay: inline-block;\u300d\u30a4\u30f3\u30e9\u30a4\u30f3\u3068\u30d6\u30ed\u30c3\u30af\u306e\u4e21\u65b9\u306e\u6027\u8cea\u3092\u6301\u3064\u8981\u7d20<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u30a4\u30f3\u30e9\u30a4\u30f3\u3068\u30d6\u30ed\u30c3\u30af\u306e\u3044\u3044\u3068\u3053\u308d\u53d6\u308a\u306e\u8981\u7d20\u306b\u8a2d\u5b9a\u3067\u304d\u308b\u306e\u304c\u300cinline-block\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30d6\u30ed\u30c3\u30af\u8981\u7d20\u306e\u3088\u3046\u306b\u300c\u6a2a\u5e45\u3068\u7e26\u5e45\u300d\u300c\u4e0a\u4e0b\u5de6\u53f3\u306e\u4f59\u767d\u300d\u306e\u8a2d\u5b9a\u304c\u3067\u304d\u3064\u3064\u3001\u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\u306e\u3088\u3046\u306b\u300c\u81ea\u52d5\u7684\u306b\u6a2a\u4e26\u3073\u300d\u306b\u306a\u308b\u305f\u3081\u3001Web\u30b5\u30a4\u30c8\u306e\u30e1\u30cb\u30e5\u30fc\u30d0\u30fc\u306a\u3069\u306e\u30dc\u30bf\u30f3\u3092\u6a2a\u4e26\u3073\u306b\u3057\u305f\u3044\u6642\u306b\u3088\u304f\u4f7f\u308f\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">display: inline-block;\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">display: inline-block;\u3092\u4f7f\u3063\u3066\u3001\u4e0b\u8a18\u306e\u3088\u3046\u306a\u6a2a\u4e26\u30733\u3064\u306e\u30dc\u30bf\u30f3\u3092\u4f5c\u6210\u3057\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><span role=\"heading\" class=\"!px-6 !py-3 bg-[#7b8b8d] block !-mt-10 !-ml-8 w-fit rounded-br-sm text-white\">HTML<\/span><div class=\"!mt-4\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">&lt;div class=\"sample\">\n\u3000&lt;div class=\"box\">\u30dc\u30c3\u30af\u30b91&lt;\/div>\n\u3000&lt;div class=\"box\">\u30dc\u30c3\u30af\u30b92&lt;\/div>\n\u3000&lt;div class=\"box\">\u30dc\u30c3\u30af\u30b93&lt;\/div>\n&lt;\/div><\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><span role=\"heading\" class=\"!px-6 !py-3 bg-[#7b8b8d] block !-mt-10 !-ml-8 w-fit rounded-br-sm text-white\">CSS<\/span><div class=\"!mt-4\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* sample\u3068\u3044\u3046\u8981\u7d20\u5185\u3092\u4e2d\u592e\u5bc4\u305b\u306b\u3059\u308b\u305f\u3081\u306e\u30b9\u30bf\u30a4\u30eb *\/\n.sample {\ntext-align: center;\n}\n\n\/* box\u3068\u3044\u3046\u8981\u7d20\u306e\u30b9\u30bf\u30a4\u30eb *\/\n.box {\n  display: inline-block; \/* \u6a2a\u4e26\u3073\u306b\u3059\u308b *\/\n  width: 150px;\n  height: 50px;\n  margin: 5px;\n  background-color: #4CAF50;\n  color: white;\n  text-align: center;\n  line-height: 50px; \/* \u30c6\u30ad\u30b9\u30c8\u3092\u7e26\u4e2d\u592e\u306b\u914d\u7f6e *\/\n  border-radius: 8px;\n}<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<p class=\"u-mb-ctrl u-mb-0 wp-block-paragraph\"><strong>\u898b\u305f\u76ee<\/strong><\/p>\n\n\n<div class=\"wp-block-image is-style-border\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"1066\" height=\"80\" src=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/02\/display-inline-block-1.png\" alt=\"display: inline-block;\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b\uff1a\u5b9f\u969b\u306e\u898b\u305f\u76ee\" class=\"wp-image-539\" srcset=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/02\/display-inline-block-1.png 1066w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/02\/display-inline-block-1-300x23.png 300w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/02\/display-inline-block-1-1024x77.png 1024w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/02\/display-inline-block-1-768x58.png 768w\" sizes=\"(max-width: 1066px) 100vw, 1066px\" \/><\/figure>\n<\/div>\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u3088\u3046\u306b\u3001display: inline-block; \u3092\u4f7f\u3046\u3053\u3068\u3067\u3001\u8981\u7d20\u3092\u6a2a\u4e26\u3073\u306b\u3057\u3064\u3064\u3001\u30d6\u30ed\u30c3\u30af\u30ec\u30d9\u30eb\u8981\u7d20\u306e\u3088\u3046\u306b\u5e45\u3084\u9ad8\u3055\u3092\u8a2d\u5b9a\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cdisplay: flex;\u300d\u30ec\u30a4\u30a2\u30a6\u30c8\u306b\u9069\u3057\u305f\u8981\u7d20<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">display:flex;\u306f\u3001\u6307\u5b9a\u3057\u305f\u8981\u7d20\u3092flexbox\u306b\u3067\u304d\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">flexbox\u3068\u306f\u3001CSS\u3067\u8981\u7d20\u3092\u30ec\u30a4\u30a2\u30a6\u30c8\u3059\u308b\u305f\u3081\u306e\u624b\u6cd5\u3067\u3001\u8981\u7d20\u3092\u7e26\u3084\u6a2a\u306b\u4e26\u3079\u305f\u308a\u3001\u8981\u7d20\u9593\u306e\u5e45\u3084\u9ad8\u3055\u3001\u4f59\u767d\u306a\u3069\u3092\u8abf\u6574\u3057\u305f\u308a\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002\u305d\u306e\u305f\u3081\u3001\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u30c7\u30b6\u30a4\u30f3\u306e\u4f5c\u6210\u306b\u3082\u975e\u5e38\u306b\u9069\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u57fa\u672c\u7684\u306b\u306f\u89aa\u8981\u7d20\u306b\u6307\u5b9a\u3059\u308b\u3082\u306e\u3067\u3042\u308a\u3001\u305d\u306e\u89aa\u8981\u7d20\u306b\u542b\u307e\u308c\u308b\u5b50\u8981\u7d20\u306f\u3059\u3079\u3066\u81ea\u52d5\u7684\u306bflexbox\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001\u3053\u308c\u307e\u3067\u300cdisplay: block;\u300d\u3067\u306f\u8907\u96d1\u306aCSS\u8a18\u8ff0\u304c\u5fc5\u8981\u3060\u3063\u305f\u308a\u5d29\u308c\u3084\u3059\u304b\u3063\u305f\u8a2d\u5b9a\u304c\u3001\u3053\u306eflex\u3092\u4f7f\u3046\u3053\u3068\u3067\u7c21\u5358\u306b\u8a2d\u5b9a\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u72ec\u7279\u306e\u8a18\u8f09\u304c\u591a\u3044flex\u3067\u3059\u304c\u3001\u3053\u308c\u304b\u3089Web\u30c7\u30b6\u30a4\u30f3\u3092\u3059\u308b\u306a\u3089\u5fc5\u305a\u899a\u3048\u3066\u304a\u304d\u305f\u3044CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u306e\u3072\u3068\u3064\u3067\u3057\u3087\u3046\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">display: flex;\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">display: flex;\u3092\u4f7f\u3063\u3066\u3001\u30a2\u30a4\u30c6\u30e01\uff5e3\u3092\u30dc\u30bf\u30f3\u306e\u3088\u3046\u306a\u898b\u305f\u76ee\u306b\u3057\u3001\u4e2d\u592e\u63c3\u3048\u306b\u3057\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><span role=\"heading\" class=\"!px-6 !py-3 bg-[#7b8b8d] block !-mt-10 !-ml-8 w-fit rounded-br-sm text-white\">HTML<\/span><div class=\"!mt-4\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">&lt;div class=\"sample\">\n\u3000&lt;div class=\"item\">\u30a2\u30a4\u30c6\u30e01&lt;\/div>\n\u3000&lt;div class=\"item\">\u30a2\u30a4\u30c6\u30e02&lt;\/div>\n\u3000&lt;div class=\"item\">\u30a2\u30a4\u30c6\u30e03&lt;\/div>\n&lt;\/div><\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><span role=\"heading\" class=\"!px-6 !py-3 bg-[#7b8b8d] block !-mt-10 !-ml-8 w-fit rounded-br-sm text-white\">CSS<\/span><div class=\"!mt-4\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* sample\u3068\u3044\u3046\u8981\u7d20\u306e\u30b9\u30bf\u30a4\u30eb *\/\n .sample {\ndisplay: flex; \/* \u30d5\u30ec\u30c3\u30af\u30b9\u30dc\u30c3\u30af\u30b9\u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u9069\u7528 *\/ \njustify-content: center; \/* \u6c34\u5e73\u65b9\u5411\u306b\u4e2d\u592e\u5bc4\u305b *\/\nalign-items: center; \/* \u5782\u76f4\u65b9\u5411\u306b\u4e2d\u592e\u5bc4\u305b *\/\nheight: 100vh; \/* \u30d3\u30e5\u30fc\u30dd\u30fc\u30c8\u306e\u9ad8\u3055\u5168\u4f53\u3092\u78ba\u4fdd *\/\nbackground-color: #4CAF50; \/* \u80cc\u666f\u8272 *\/\n} <\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<p class=\"u-mb-ctrl u-mb-0 wp-block-paragraph\"><strong>\u898b\u305f\u76ee<\/strong><\/p>\n\n\n<div class=\"wp-block-image is-style-border\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"153\" src=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/02\/display-flex-1024x153.png\" alt=\"display: flex;\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b\uff1a\u5b9f\u969b\u306e\u898b\u305f\u76ee\" class=\"wp-image-543\" srcset=\"https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/02\/display-flex-1024x153.png 1024w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/02\/display-flex-300x45.png 300w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/02\/display-flex-768x115.png 768w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/02\/display-flex-1536x230.png 1536w, https:\/\/iseed.jp\/blog\/wp-content\/uploads\/2025\/02\/display-flex.png 1884w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n<h2 class=\"wp-block-heading\">\u3088\u304f\u4f7f\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3010\u4f4d\u7f6e\u7cfb\u3011<\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>CSS\u30d7\u30ed\u30d1\u30c6\u30a3<\/th><th>\u610f\u5473<\/th><\/tr><\/thead><tbody><tr><td>position<\/td><td>\u8981\u7d20\u306e\u4f4d\u7f6e\u65b9\u6cd5\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>float<\/td><td>\u8981\u7d20\u306e\u6d6e\u52d5\u5316\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>z-index<\/td><td>\u8981\u7d20\u306e\u91cd\u306a\u308a\u9806\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>overflow<\/td><td>\u306f\u307f\u51fa\u305f\u5b50\u8981\u7d20\u306e\u6271\u3044\u3092\u8a2d\u5b9a<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cposition:\u300d\u8981\u7d20\u306e\u4f4d\u7f6e<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u8981\u7d20\u306e\u4f4d\u7f6e\u3092\u8a2d\u5b9a\u3059\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u304c\u300cposition:\u300d\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cposition: relative;\u300d\u3092\u8a2d\u5b9a\u3059\u308b\u3068\u3001\u300ctop:\u300d\u3084\u300cleft:\u300d\u306a\u3069\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u3044\u8981\u7d20\u306e\u4f4d\u7f6e\u3092\u52d5\u304b\u3059\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cposition: absolute;\u300d\u3092\u8a2d\u5b9a\u3059\u308b\u3068\u3001\u305d\u306e\u8981\u7d20\u306f\u4ed6\u306e\u8981\u7d20\u3068\u5e72\u6e09\u305b\u305a\u7d76\u5bfe\u5024\u306e\u8a2d\u5b9a\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u898b\u305f\u76ee\u3068\u3057\u3066\u306f\u72ec\u7acb\u3057\u3066\u6d6e\u3044\u305f\u72b6\u614b\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5468\u308a\u306e\u8981\u7d20\u306e\u4f4d\u7f6e\u3068\u306f\u95a2\u4fc2\u306a\u304f\u8981\u7d20\u3092\u7f6e\u304d\u305f\u3044\u6642\u306b\u3088\u304f\u4f7f\u7528\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001\u300cposition: fixed;\u300d\u3084\u300cposition: sticky;\u300d\u306f\u30b9\u30af\u30ed\u30fc\u30eb\u3057\u3066\u3082\u8981\u7d20\u304c\u753b\u9762\u4e0a\u306b\u56fa\u5b9a\u3055\u308c\u305f\u307e\u307e\u306b\u306a\u308b\u8a2d\u5b9a\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30e1\u30cb\u30e5\u30fc\u30d0\u30fc\u3084\u5e38\u6642\u56fa\u5b9a\u306e\u30a2\u30a4\u30b3\u30f3\u3092\u3064\u3051\u305f\u3044\u6642\u306a\u3069\u306b\u4f7f\u3046\u3068\u4fbf\u5229\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">position\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u76f8\u5bfe\u4f4d\u7f6e\uff1a\u901a\u5e38\u306e\u4f4d\u7f6e\u3092\u57fa\u6e96\u306b\u305a\u3089\u3059 *\/\nposition: relative;\n\n\/* \u7d76\u5bfe\u4f4d\u7f6e\uff1a\u6700\u3082\u8fd1\u3044position\u4ed8\u304d\u89aa\u8981\u7d20\u3092\u57fa\u6e96\u306b\u914d\u7f6e *\/\nposition: absolute;\n\n\/* \u56fa\u5b9a\u4f4d\u7f6e\uff1a\u753b\u9762\uff08\u30d3\u30e5\u30fc\u30dd\u30fc\u30c8\uff09\u306b\u56fa\u5b9a\u8868\u793a *\/\nposition: fixed;\n\n\/* \u30b9\u30c6\u30a3\u30c3\u30ad\u30fc\u4f4d\u7f6e\uff1a\u30b9\u30af\u30ed\u30fc\u30eb\u4f4d\u7f6e\u306b\u5fdc\u3058\u3066\u89aa\u8981\u7d20\u5185\u3067\u56fa\u5b9a *\/\nposition: sticky;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cfloat:\u300d\u8981\u7d20\u306e\u6d6e\u52d5\u5316<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cfloat:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u3046\u3068\u3001\u8981\u7d20\u3092\u6d6e\u52d5\u3055\u305b\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30d6\u30ed\u30c3\u30af\u8981\u7d20\u306f\u57fa\u672c\u7684\u306b\u7e26\u4e26\u3073\u306b\u306a\u308a\u307e\u3059\u304c\u3001\u300cfloat: left;\u300d\u3092\u4f7f\u3046\u3068\u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\u306e\u3088\u3046\u306b\u6a2a\u4e26\u3073\u306b\u3059\u308b\u3053\u3068\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u753b\u50cf\u306e\u6a2a\u306b\u6587\u5b57\u3092\u56de\u308a\u8fbc\u307e\u305b\u308b\u3053\u3068\u3082\u3067\u304d\u308b\u306e\u3067\u3001\u30d7\u30ed\u30d5\u30a3\u30fc\u30eb\u3084\u8a18\u4e8b\u306e\u30b5\u30e0\u30cd\u30a4\u30eb\u306e\u30b3\u30fc\u30c7\u30a3\u30f3\u30b0\u306b\u3082\u6d3b\u8e8d\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">float\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u8981\u7d20\u3092\u5de6\u306b\u5bc4\u305b\u3066\u3001\u6a2a\u4e26\u3073\u306e\u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u4f5c\u308b *\/\nfloat: left;\n\n\/* \u8981\u7d20\u3092\u53f3\u306b\u5bc4\u305b\u3066\u3001\u6a2a\u4e26\u3073\u306e\u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u4f5c\u308b *\/\nfloat: right;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cz-index:\u300d\u8981\u7d20\u306e\u91cd\u306a\u308a\u9806<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cz-index:\u300d\u306f\u8907\u6570\u306e\u8981\u7d20\u306e\u91cd\u306a\u308a\u9806\u3092\u8a2d\u5b9a\u3059\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u6570\u5024\u304c\u5927\u304d\u3044\u307b\u3069\u524d\u3001\u5c0f\u3055\u3044\u307b\u3069\u5f8c\u308d\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f7f\u3044\u3053\u306a\u305b\u308c\u3070\u7e26\u6a2a\u306e\u307f\u3067\u306a\u304f\u3001\u5965\u884c\u306e\u3042\u308b\u30ec\u30a4\u30a2\u30a6\u30c8\u304c\u53ef\u80fd\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">z-index\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* .box1\u306e\u91cd\u306a\u308a\u9806\u30921\u306b\u8a2d\u5b9a\uff08.box2\u3088\u308a\u80cc\u9762\uff09 *\/\n.box1 {\n  z-index: 1;\n}\n\n\/* .box2\u306e\u91cd\u306a\u308a\u9806\u30922\u306b\u8a2d\u5b9a\uff08.box1\u3088\u308a\u524d\u9762\uff09 *\/\n.box2 {\n  z-index: 2;\n}<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u5834\u5408\u3001example2\u304cexample1\u3088\u308a\u524d\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u300coverflow:\u300d\u306f\u307f\u51fa\u305f\u5b50\u8981\u7d20\u306e\u6271\u3044<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300coveflow:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u306f\u3001\u89aa\u8981\u7d20\u3088\u308a\u5927\u304d\u3044\u5b50\u8981\u7d20\u306e\u51e6\u7406\u3092\u6307\u5b9a\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300coverflow: hidden;\u300d\u3068\u8a2d\u5b9a\u3059\u308b\u3068\u3001\u89aa\u8981\u7d20\u304b\u3089\u306f\u307f\u51fa\u308b\u90e8\u5206\u306f\u8868\u793a\u3055\u308c\u306a\u304f\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300coverflow: scroll;\u300d\u306e\u5834\u5408\u306f\u8981\u7d20\u5185\u3067\u30b9\u30af\u30ed\u30fc\u30eb\u3067\u304d\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">overflow\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u306f\u307f\u51fa\u3057\u305f\u90e8\u5206\u3082\u305d\u306e\u307e\u307e\u8868\u793a\u3059\u308b\uff08\u30c7\u30d5\u30a9\u30eb\u30c8\uff09 *\/\noverflow: visible;\n\n\/* \u306f\u307f\u51fa\u3057\u305f\u90e8\u5206\u3092\u96a0\u3057\u3066\u8868\u793a\u3057\u306a\u3044 *\/\noverflow: hidden;\n\n\/* \u306f\u307f\u51fa\u3057\u305f\u90e8\u5206\u3092\u30b9\u30af\u30ed\u30fc\u30eb\u30d0\u30fc\u3067\u8868\u793a\u53ef\u80fd\u306b\u3059\u308b *\/\noverflow: scroll;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u3088\u304f\u4f7f\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3010\u8868\u793a\u7cfb\u3011<\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>CSS\u30d7\u30ed\u30d1\u30c6\u30a3<\/th><th>\u610f\u5473<\/th><\/tr><\/thead><tbody><tr><td>opacity<\/td><td>\u8981\u7d20\u306e\u900f\u660e\u5ea6\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>visibility<\/td><td>\u8981\u7d20\u306e\u8868\u793a\u306e\u6709\u7121\u3092\u8a2d\u5b9a<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u300copacity:\u300d\u8981\u7d20\u306e\u900f\u660e\u5ea6<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300copacity:\u300d\u306f\u8981\u7d20\u306e\u900f\u660e\u5ea6\u3092\u8a2d\u5b9a\u3059\u308b\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300copacity: 0;\u300d\u306f\u900f\u660e\u3067\u3001\u6570\u5024\u3092\u4e0a\u3052\u308b\u3068\u3060\u3093\u3060\u3093\u6fc3\u304f\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u6700\u5927\u5024\u306f\u300copacity: 1;\u300d\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305f\u3068\u3048\u3070hover\u6642\u306e\u8a2d\u5b9a\u3067\u300copacity: 0.7;\u300d\u3068\u8a2d\u5b9a\u3059\u308c\u3070\u3001\u30ab\u30fc\u30bd\u30eb\u3092\u5408\u308f\u305b\u305f\u8981\u7d20\u3092\u3084\u3084\u8584\u304f\u3057\u52d5\u304d\u3092\u3064\u3051\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">opacity\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u8981\u7d20\u3092\u5b8c\u5168\u306b\u900f\u660e\u306b\u3059\u308b\uff08\u898b\u3048\u306a\u304f\u306a\u308b\u304c\u30b9\u30da\u30fc\u30b9\u306f\u6b8b\u308b\uff09 *\/\nopacity: 0;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300cvisibility:\u300d\u8981\u7d20\u306e\u8868\u793a\u306e\u6709\u7121<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cvisibility:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u306f\u8981\u7d20\u306e\u8868\u793a\u306e\u6709\u7121\u3092\u8a2d\u5b9a\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u8981\u7d20\u3092\u8868\u793a\u3057\u305f\u304f\u306a\u3044\u5834\u5408\u306f\u300cvisibility: hidden;\u300d\u3068\u66f8\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300cdisplay: none;\u300d\u306f\u8981\u7d20\u81ea\u4f53\u3092\u6d88\u3057\u307e\u3059\u304c\u3001\u300cvisibility: hidden;\u300d\u306e\u5834\u5408\u306f\u8981\u7d20\u306e\u898b\u305f\u76ee\u3060\u3051\u304c\u900f\u660e\u306b\u306a\u308a\u5f62\u81ea\u4f53\u306f\u6b8b\u3063\u305f\u72b6\u614b\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">visibility\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u8981\u7d20\u3092\u975e\u8868\u793a\u306b\u3059\u308b\u304c\u3001\u30ec\u30a4\u30a2\u30a6\u30c8\u4e0a\u306e\u30b9\u30da\u30fc\u30b9\u306f\u6b8b\u3059 *\/\nvisibility: hidden;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u3088\u304f\u4f7f\u3046CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3010\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u7cfb\u3011<\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>CSS\u30d7\u30ed\u30d1\u30c6\u30a3<\/th><th>\u610f\u5473<\/th><\/tr><\/thead><tbody><tr><td>transition-property<\/td><td>\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u9069\u7528\u5148\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>transition-duration<\/td><td>\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u6642\u9593\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>transition-delay<\/td><td>\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u9045\u5ef6\u6642\u9593\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>transition-timing-function<\/td><td>\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u5909\u5316\u306e\u7a2e\u985e\u3092\u8a2d\u5b9a<\/td><\/tr><tr><td>transition<\/td><td>\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u9023\u3092\u4e00\u62ec\u3067\u6307\u5b9a<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u300ctransition-property:\u300d\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u9069\u7528\u5148<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300ctransition-property:\u300d\u306f\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3092\u9069\u7528\u3057\u305f\u3044\u8981\u7d20\u3092\u6307\u5b9a\u3059\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300ctransition-property: background-color;\u300d\u3068\u8a2d\u5b9a\u3057\u305f\u5834\u5408\u3001\u80cc\u666f\u8272\u306b\u306e\u307f\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u304c\u9069\u7528\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5168\u3066\u306e\u8981\u7d20\u306b\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3092\u9069\u7528\u3057\u305f\u3044\u5834\u5408\u306f\u300ctransition-property: all;\u300d\u3068\u66f8\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">transition-property\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u3059\u3079\u3066\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u306e\u5909\u5316\u3092\u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3\uff08\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\uff09\u3055\u305b\u308b *\/\ntransition-property: all;\n\n\/* \u80cc\u666f\u8272\uff08background-color\uff09\u306e\u5909\u5316\u306e\u307f\u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3\u3055\u305b\u308b *\/\ntransition-property: background-color;\n\n\/* \u6587\u5b57\u8272\uff08color\uff09\u3068\u5e45\uff08width\uff09\u306e\u5909\u5316\u306e\u307f\u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3\u3055\u305b\u308b *\/\ntransition-property: color, width;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300ctransition-duration:\u300d\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u6642\u9593<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3092\u52d5\u304b\u3059\u6642\u9593\u3092\u8a2d\u5b9a\u3059\u308b\u5834\u5408\u306f\u300ctransition-duration:\u300d\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300ctransition-duration: .4s;\u300d\u3060\u30680.4\u79d2\u304b\u3051\u3066\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u304c\u52d5\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">transition-duration\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3\uff08\u5909\u5316\uff09\u306e\u7d99\u7d9a\u6642\u9593\u30920.4\u79d2\u306b\u8a2d\u5b9a *\/\ntransition-duration: 0.4s;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300ctransition-delay:\u300d\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u9045\u5ef6\u6642\u9593<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300ctransition-delay:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u306f\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u9045\u5ef6\u6642\u9593\u3092\u6307\u5b9a\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300ctransition-delay: 1s;\u300d\u306e\u5834\u5408\u306f\u3001\u52d5\u4f5c\u3057\u3066\u304b\u30891\u79d2\u5f8c\u306b\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u304c\u958b\u59cb\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">transition-delay\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3\u306e\u958b\u59cb\u30921\u79d2\u9045\u3089\u305b\u308b *\/\ntransition-delay: 1s;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300ctransition-timing-function:\u300d\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u5909\u5316\u306e\u7a2e\u985e<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300ctransition-timing-function:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u306f\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u5909\u5316\u306e\u7a2e\u985e\u3092\u8a2d\u5b9a\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u304c\u4e00\u76f4\u7dda\u306b\u9032\u3080\u300cliner\u300d\u3001\u958b\u59cb\u3068\u7d42\u4e86\u4ed8\u8fd1\u306e\u52d5\u304d\u304c\u306a\u3081\u3089\u304b\u306b\u306a\u308b\u300cease\u300d<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4ed6\u306b\u3082\u300cease-in\u300d\u3084\u300cease-in-out\u300d\u306a\u3069\u69d8\u3005\u306a\u8a2d\u5b9a\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">transition-timing-function:\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3\u306e\u52d5\u304d\u3092\u76f4\u7dda\u7684\u306b\u3059\u308b *\/\ntransition-timing-function: linear;\n\n\/* \u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3\u306e\u52d5\u304d\u3092\u7de9\u3084\u304b\u306b\u958b\u59cb\u30fb\u7d42\u4e86\u3055\u305b\u308b\uff08\u30c7\u30d5\u30a9\u30eb\u30c8\uff09 *\/\ntransition-timing-function: ease;\n\n\/* \u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3\u3092\u3086\u3063\u304f\u308a\u958b\u59cb\u3057\u3001\u901f\u304f\u7d42\u4e86\u3055\u305b\u308b *\/\ntransition-timing-function: ease-in;\n\n\/* \u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3\u3092\u3086\u3063\u304f\u308a\u958b\u59cb\u3057\u3001\u3086\u3063\u304f\u308a\u7d42\u4e86\u3055\u305b\u308b *\/\ntransition-timing-function: ease-in-out;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u300ctransition:\u300d\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u9023\u3092\u4e00\u62ec\u3067\u6307\u5b9a<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300ctransition:\u300d\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4f7f\u3048\u3070\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u95a2\u9023\u306e\u8a2d\u5b9a\u304c\u4e00\u62ec\u3067\u884c\u3048\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u6642\u9593\u306b\u95a2\u3059\u308b\u6570\u5024\u306f\u5148\u306b\u8a18\u8ff0\u3057\u305f\u65b9\u304ctransition-delay\u3001\u5f8c\u306e\u65b9\u304ctransition-duration\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">transition:\u3092\u4f7f\u3063\u305fCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u80cc\u666f\u8272\u306e\u5909\u5316\u30920.4\u79d2\u304b\u3051\u3066\u3001ease\u306e\u52d5\u304d\u3067\u30010.2\u79d2\u5f8c\u306b\u958b\u59cb\u3059\u308b\u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3 *\/\ntransition: background-color 0.4s ease 0.2s;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u30ab\u30f3\u30de\u3067\u533a\u5207\u3063\u3066\u8a18\u8f09\u3059\u308c\u3070\u8907\u6570\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u306e\u8a2d\u5b9a\u3092\u540c\u6642\u306b\u884c\u3048\u307e\u3059\u3002<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">\u8907\u6570\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4e00\u62ec\u3067\u8a2d\u5b9a\u3059\u308bCSS\u30b3\u30fc\u30c9\u4f8b<\/h4>\n\n\n\n<div class=\"wp-block-custom-code-with-style\"><div class=\"!p-8 !pt-10 rounded-lg bg-[#282c34] relative overflow-hidden\"><div class=\"\"><pre class=\"!m-0 !p-0\"><code class=\"!m-0 !p-0 !overflow-hidden\">\/* \u80cc\u666f\u8272\u3068\u6587\u5b57\u8272\u3092\u305d\u308c\u305e\u308c0.5\u79d2\u304b\u3051\u3066\u5909\u5316\u3055\u305b\u308b\u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3 *\/\ntransition: background-color 0.5s, color 0.5s;<\/code><\/pre><button class=\"absolute top-0 right-0 !p-4 !bg-transparent !border-0\" data-tippy-content=\"\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\"><svg width=\"14px\" height=\"16px\" viewBox=\"0 0 14 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"text-[#98A7AA] hover:text-[#EEF0F0]\"><path d=\"M5.20039 12.8C4.76039 12.8 4.38372 12.6433 4.07039 12.33C3.75706 12.0167 3.60039 11.64 3.60039 11.2V1.6C3.60039 1.16 3.75706 0.783333 4.07039 0.47C4.38372 0.156667 4.76039 0 5.20039 0H12.4004C12.8404 0 13.2171 0.156667 13.5304 0.47C13.8437 0.783333 14.0004 1.16 14.0004 1.6V11.2C14.0004 11.64 13.8437 12.0167 13.5304 12.33C13.2171 12.6433 12.8404 12.8 12.4004 12.8H5.20039ZM2.00039 16C1.56039 16 1.18372 15.8433 0.870391 15.53C0.557057 15.2167 0.400391 14.84 0.400391 14.4V4C0.400391 3.77333 0.477057 3.58333 0.630391 3.43C0.783724 3.27667 0.973724 3.2 1.20039 3.2C1.42706 3.2 1.61706 3.27667 1.77039 3.43C1.92372 3.58333 2.00039 3.77333 2.00039 4V14.4H10.0004C10.2271 14.4 10.4171 14.4767 10.5704 14.63C10.7237 14.7833 10.8004 14.9733 10.8004 15.2C10.8004 15.4267 10.7237 15.6167 10.5704 15.77C10.4171 15.9233 10.2271 16 10.0004 16H2.00039Z\" fill=\"currentColor\"><\/path><\/svg><\/button><\/div><\/div><\/div>\n\n\n\n<div class=\"wp-block-group\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">CSS\u30d7\u30ed\u30d1\u30c6\u30a3\u306e\u304a\u60a9\u307f\u306fI-SEED\u306b\u3054\u76f8\u8ac7\u304f\u3060\u3055\u3044<\/h2>\n\n\n\n<div class=\"wp-block-custom-list-with-style wp-block-list is-style-default\"><ul class=\"wp-block-list is-style-default flex flex-col gap-[0em] !pl-6\"><li class=\"marker:text-[#B8C4C6] \"><span class=\"!text-[16px]\">\u30c7\u30b6\u30a4\u30f3\u306e\u5d29\u308c\u3092\u4fee\u6b63\u3057\u3066\u3082\u3001\u539f\u56e0\u304c\u3069\u3053\u306b\u3042\u308b\u306e\u304b\u5206\u304b\u3089\u306a\u3044<\/span><\/li><li class=\"marker:text-[#B8C4C6] \"><span class=\"!text-[16px]\">\u30d7\u30ed\u30d1\u30c6\u30a3\u306e\u6307\u5b9a\u304c\u91cd\u306a\u308a\u3001\u601d\u3063\u305f\u901a\u308a\u306e\u8868\u793a\u306b\u306a\u3089\u306a\u3044<\/span><\/li><li class=\"marker:text-[#B8C4C6] \"><span class=\"!text-[16px]\">\u30b9\u30de\u30db\u3068PC\u3067\u30ec\u30a4\u30a2\u30a6\u30c8\u304c\u7d71\u4e00\u3067\u304d\u305a\u56f0\u3063\u3066\u3044\u308b<\/span><\/li><\/ul><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u3088\u3046\u306a\u8ab2\u984c\u306f\u3001\u300cCSS\u306e\u57fa\u672c\u69cb\u9020\u304c\u6574\u7406\u3067\u304d\u3066\u3044\u306a\u3044\u300d\u300c\u30b9\u30bf\u30a4\u30eb\u306e\u512a\u5148\u9806\u4f4d\u3084\u7d99\u627f\u306e\u7406\u89e3\u304c\u4e0d\u8db3\u3057\u3066\u3044\u308b\u300d\u5834\u5408\u306b\u8d77\u304d\u3084\u3059\u304f\u3001\u89e3\u6c7a\u306b\u306f\u30b3\u30fc\u30c9\u8a2d\u8a08\u306e\u898b\u76f4\u3057\u3084\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u5bfe\u5fdc\u306e\u6700\u9069\u5316\u3068\u3044\u3063\u305f\u5bfe\u7b56\u304c\u5fc5\u8981\u306b\u306a\u3063\u3066\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">I-SEED\u3067\u306f\u3001\u30b7\u30b9\u30c6\u30e0\u958b\u767a\u3084Web\u30c7\u30b6\u30a4\u30f3\u3001Web\u30de\u30fc\u30b1\u30c6\u30a3\u30f3\u30b0\u305d\u308c\u305e\u308c\u306e\u5206\u91ce\u3067\u5e45\u5e83\u3044\u30b9\u30ad\u30eb\u3068\u7d4c\u9a13\u3092\u6301\u3063\u305f\u30b9\u30bf\u30c3\u30d5\u304c\u3001\u304a\u5ba2\u69d8\u306e\u304a\u60a9\u307f\u3092\u3072\u3068\u3064\u3072\u3068\u3064\u7d30\u304b\u304f\u30d2\u30a2\u30ea\u30f3\u30b0\u3002\u300c\u4f7f\u3044\u3084\u3059\u304f\u3001\u4fdd\u5b88\u3057\u3084\u3059\u3044Web\u30c7\u30b6\u30a4\u30f3\u300d\u3092\u30e2\u30c3\u30c8\u30fc\u306b\u3001\u6700\u9069\u306a\u89e3\u6c7a\u7b56\u3092\u3054\u63d0\u6848\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<div class=\"wp-block-custom-list-with-style wp-block-list is-style-default\"><ul class=\"wp-block-list is-style-default flex flex-col gap-[0em] !pl-6\"><li class=\"marker:text-[#B8C4C6] \"><span class=\"!text-[16px]\"><a href=\"https:\/\/iseed.jp\/system\/\">\u30b7\u30b9\u30c6\u30e0\u958b\u767a<\/a><\/span><\/li><li class=\"marker:text-[#B8C4C6] \"><span class=\"!text-[16px]\"><a href=\"https:\/\/iseed.jp\/service\/design\/\">Web\u5236\u4f5c\u30fb\u30c7\u30b6\u30a4\u30f3<\/a><\/span><\/li><li class=\"marker:text-[#B8C4C6] \"><span class=\"!text-[16px]\"><a href=\"https:\/\/iseed.jp\/service\/marketing\/\">Web\u30de\u30fc\u30b1\u30c6\u30a3\u30f3\u30b0<\/a><\/span><\/li><\/ul><\/div>\n\n\n\n<p class=\"u-mb-ctrl u-mb-30 wp-block-paragraph\">\u30e1\u30fc\u30eb\u30d5\u30a9\u30fc\u30e0\u3067\u306e\u3054\u76f8\u8ac7\u3084Web\u4e0a\u3067\u306e\u304a\u898b\u7a4d\u3082\u308a\uff08\u6599\u91d1\u30b7\u30df\u30e5\u30ec\u30fc\u30b7\u30e7\u30f3\uff09\u3082\u53ef\u80fd\u3067\u3059\u306e\u3067\u3001\u304a\u6c17\u8efd\u306b\u3054\u76f8\u8ac7\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30e1\u30fc\u30eb\u30d5\u30a9\u30fc\u30e0\u3067\u306e\u3054\u76f8\u8ac7\u3082\u53ef\u80fd\u3067\u3059\u306e\u3067\u3001\u304a\u6c17\u8efd\u306b\u3054\u76f8\u8ac7\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<div class=\"wp-block-group is-row is-content-justification-center is-layout-flex wp-container-core-group-is-layout-de391324 wp-block-group-is-layout-flex\">\n<div class=\"wp-block-custom-button-with-style\"><a href=\"https:\/\/iseed.jp\/contact\/\" class=\"c-button c-button--mail\">\u30e1\u30fc\u30eb\u30d5\u30a9\u30fc\u30e0\u3067\u7121\u6599\u76f8\u8ac7\u3059\u308b<\/a><\/div>\n<\/div>\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u3055\u3044\u3054\u306b<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u898b\u6163\u308c\u306a\u3044\u5358\u8a9e\u3082\u591a\u304f\u82e6\u624b\u610f\u8b58\u3092\u6301\u3063\u3066\u3057\u307e\u3044\u304c\u3061\u306aCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u304c\u3001\u5b9f\u969b\u306b\u4f7f\u3046\u6642\u306f\u5927\u4f53\u30b3\u30d4\u30da\u3067OK\uff01<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305a\u306f\u3069\u3093\u306a\u7a2e\u985e\u306eCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u304c\u3042\u308b\u304b\u3092\u77e5\u308a\u3001\u8abf\u3079\u306a\u304c\u3089\u5b9f\u969b\u306b\u4f7f\u3063\u3066\u307f\u308b\u3053\u3068\u304c\u65e9\u671f\u7fd2\u5f97\u3078\u306e\u8fd1\u9053\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30db\u30fc\u30e0\u30da\u30fc\u30b8\u5236\u4f5c\u3084Wordpress\u306e\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3067\u304a\u60a9\u307f\u306e\u5834\u5408\u306f\u3001\u305c\u3072I-SEED\u307e\u3067\u304a\u6c17\u8efd\u306b\u3054\u76f8\u8ac7\u304f\u3060\u3055\u3044\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u300c\u30db\u30fc\u30e0\u30da\u30fc\u30b8\u3092\u4f5c\u308a\u305f\u3044\uff01\u300d \u300cWordpress\u3084\u30d6\u30ed\u30b0\u3092\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3057\u305f\u3044\uff01\u300d \u305d\u3093\u306a\u6642\u306b\u6b20\u304b\u305b\u306a\u3044\u306e\u304c\u6587\u5b57\u3084\u8981\u7d20\u3092\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3059\u308bCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3067\u3059\u3002 \u3057\u304b\u3057\u3001\u3044\u304d\u306a\u308a\u5168\u3066\u306eCSS\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u899a\u3048\u3066\u4f7f\u3044\u3053\u306a\u3059\u306e\u306f [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":6241,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"swell_btn_cv_data":"","footnotes":""},"categories":[3],"tags":[40],"class_list":["post-1017","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-design","tag-html-css"],"_links":{"self":[{"href":"https:\/\/iseed.jp\/blog\/wp-json\/wp\/v2\/posts\/1017","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/iseed.jp\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/iseed.jp\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/iseed.jp\/blog\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/iseed.jp\/blog\/wp-json\/wp\/v2\/comments?post=1017"}],"version-history":[{"count":83,"href":"https:\/\/iseed.jp\/blog\/wp-json\/wp\/v2\/posts\/1017\/revisions"}],"predecessor-version":[{"id":6757,"href":"https:\/\/iseed.jp\/blog\/wp-json\/wp\/v2\/posts\/1017\/revisions\/6757"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/iseed.jp\/blog\/wp-json\/wp\/v2\/media\/6241"}],"wp:attachment":[{"href":"https:\/\/iseed.jp\/blog\/wp-json\/wp\/v2\/media?parent=1017"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/iseed.jp\/blog\/wp-json\/wp\/v2\/categories?post=1017"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/iseed.jp\/blog\/wp-json\/wp\/v2\/tags?post=1017"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}