{"id":4067,"date":"2025-07-26T14:10:41","date_gmt":"2025-07-26T05:10:41","guid":{"rendered":"http:\/\/wwweb.jp\/?p=4067"},"modified":"2025-09-15T16:14:07","modified_gmt":"2025-09-15T07:14:07","slug":"%e6%97%a5%e6%9c%ac%e3%81%ae%e5%a4%8f%e3%81%ae%e3%83%8f%e3%83%bc%e3%82%b2%e3%83%b3%e3%83%80%e3%83%83%e3%83%84","status":"publish","type":"post","link":"https:\/\/wwweb.jp\/?p=4067","title":{"rendered":"\u65e5\u672c\u306e\u590f\u306e\u30cf\u30fc\u30b2\u30f3\u30c0\u30c3\u30c4"},"content":{"rendered":"\n

\u30e1\u30a4\u30f3\u30a4\u30e1\u30fc\u30b8\u306e\u5468\u56f2\u3092\u3001\u30ab\u30c3\u30d7\u30a2\u30a4\u30b9\u304c\u4e26\u3093\u3067\u3044\u304f\u3002
\u3010\u30b5\u30f3\u30d7\u30eb\u3011https:\/\/wwweb.jp\/sample\/002\/<\/a><\/p>\n\n\n

\n
\"\"<\/figure><\/div>\n\n\n

HTML\u3068CSS\u3092\u7528\u610f\u3057CSS\u3092\u30ea\u30f3\u30af\u3059\u308b\u3002<\/p>\n\n\n\n

<!DOCTYPE html>\n<html lang="ja">\n<head>\n<meta charset="UTF-8">\n<link rel="stylesheet" href="style.css">\n<title>\u30bf\u30a4\u30c8\u30eb\u3092\u5165\u529b<\/title>\n<\/head>\n<body>\n\n<\/body>\n<\/html><\/code><\/pre><\/div>\n\n\n\n
HTML\u30b3\u30fc\u30c9<\/strong><\/p>\n\n\n\n
<h1>\u30bf\u30a4\u30c8\u30eb<\/h1>\n<div class="slide">\n<div class="slide-wrap top">\n<ul>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<\/ul>\n\n<ul>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<\/ul>\n<\/div>\n\n<p><img src="banner.jpg"><\/p>\n<div class="slide-wrap bottom">\n<ul>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<\/ul>\n\n<ul>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<li>\u753b\u50cf<\/li>\n<\/ul>\n<\/div>\n<\/div><\/code><\/pre><\/div>\n\n\n\n
CSS\u30b3\u30fc\u30c9<\/strong><\/p>\n\n\n\n
body{\ntext-align:center;\n}\n* {\n  margin: 0;\n  padding: 0;\n}\n\nul,\nli {\n  list-style: none;\n}\n\nimg{width:50%;}\n\nli>img{\nwidth:300px;}\n\n\n.slide {\n  margin-top: 3px;\n}\n.slide-wrap {\n  display: flex;\n}\n.slide-wrap.bottom {\n  margin-top: 3px;\n  justify-content: flex-end;\n}\n.slide-wrap ul {\n  display: flex;\n}\n.slide-wrap.top ul:first-child {\n  animation: slideTop 50s -25s linear infinite;\n}\n.slide-wrap.top ul:last-child {\n  animation: slideTop2 50s linear infinite;\n}\n.slide-wrap.bottom ul:first-child {\n  animation: slideBottom 50s linear infinite;\n}\n.slide-wrap.bottom ul:last-child {\n  animation: slideBottom2 50s -25s linear infinite;\n}\n.slide-wrap li {\n  \/*width: 19.7436vw;*\/\n}\n\n.slide-wrap.top li {\n  margin-right: 4px;\n}\n\n.slide-wrap.bottom li {\n  margin-left: 4px;\n}\n\n@keyframes slideTop {\n  0% {\n    transform: translateX(100%);\n  }\n  to {\n    transform: translateX(-100%);\n  }\n}\n\n@keyframes slideTop2 {\n  0% {\n    transform: translateX(0%);\n  }\n  to {\n    transform: translateX(-200%);\n  }\n}\n\n@keyframes slideBottom {\n  0% {\n    transform: translateX(0%);\n  }\n  to {\n    transform: translateX(200%);\n  }\n}\n\n@keyframes slideBottom2 {\n  0% {\n    transform: translateX(-100%);\n  }\n  to {\n    transform: translateX(100%);\n  }\n}\n<\/style><\/code><\/pre><\/div>\n","protected":false},"excerpt":{"rendered":"\u30e1\u30a4\u30f3\u30a4\u30e1\u30fc\u30b8\u306e\u5468\u56f2\u3092\u3001\u30ab\u30c3\u30d7\u30a2\u30a4\u30b9\u304c\u4e26\u3093\u3067\u3044\u304f\u3002\u3010\u30b5\u30f3\u30d7\u30eb\u3011https:\/\/wwweb.jp\/sample\/002\/ HTML\u3068CSS\u3092\u7528\u610f\u3057CSS\u3092\u30ea\u30f3\u30af\u3059\u308b\u3002 HTML\u30b3\u30fc\u30c9 CSS\u30b3\u30fc\u30c9","protected":false},"author":1,"featured_media":4072,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[226],"tags":[213,245,246,247,248,249],"class_list":["post-4067","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-intermediate","tag-213","tag-245","tag-246","tag-css","tag-248","tag-249"],"jetpack_featured_media_url":"https:\/\/wwweb.jp\/wp\/wp-content\/uploads\/2025\/07\/banner.jpg","_links":{"self":[{"href":"https:\/\/wwweb.jp\/index.php?rest_route=\/wp\/v2\/posts\/4067","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wwweb.jp\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wwweb.jp\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wwweb.jp\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wwweb.jp\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=4067"}],"version-history":[{"count":12,"href":"https:\/\/wwweb.jp\/index.php?rest_route=\/wp\/v2\/posts\/4067\/revisions"}],"predecessor-version":[{"id":4342,"href":"https:\/\/wwweb.jp\/index.php?rest_route=\/wp\/v2\/posts\/4067\/revisions\/4342"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wwweb.jp\/index.php?rest_route=\/wp\/v2\/media\/4072"}],"wp:attachment":[{"href":"https:\/\/wwweb.jp\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=4067"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wwweb.jp\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=4067"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wwweb.jp\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=4067"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}