{"id":1350,"date":"2019-08-25T14:57:38","date_gmt":"2019-08-25T05:57:38","guid":{"rendered":"https:\/\/dennie.tokyo\/it\/?p=1350"},"modified":"2026-01-05T20:53:39","modified_gmt":"2026-01-05T11:53:39","slug":"css-%e7%94%bb%e9%9d%a2%e3%81%84%e3%81%a3%e3%81%b1%e3%81%84%e8%a1%a8%e7%a4%ba%e3%81%99%e3%82%8b","status":"publish","type":"post","link":"https:\/\/dennie.tokyo\/it\/?p=1350","title":{"rendered":"CSS \u80cc\u666f\u753b\u50cf\u3092\u753b\u9762\u3044\u3063\u3071\u3044\u8868\u793a\u3059\u308b"},"content":{"rendered":"\n

\u3088\u304f\u3042\u308b\u3001\u80cc\u666f\u753b\u50cf\u3092\u753b\u9762\u3044\u3063\u3071\u3044\u306b\u8868\u793a\u3059\u308b\u65b9\u6cd5\u3092\u8aac\u660e\u3057\u307e\u3059\u3002<\/p>\n\n\n\n\n\n\n\n

\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u611f\u3058\u3067\u3059\u3002<\/p>\n\n\n\n

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

\u5168\u753b\u9762\u8868\u793a<\/h1>\n\n\n\n

\u307e\u305a\u306f\u3001\u80cc\u666f\u753b\u50cf\u3092\u4f7f\u308f\u305a\u3001\u8272\u306e\u3064\u3044\u305f\u80cc\u666f\u3092\u753b\u9762\u3044\u3063\u3071\u3044\u306b\u8868\u793a\u3055\u305b\u3066\u307f\u307e\u3057\u3087\u3046\u3002
\u3053\u3093\u306a\u611f\u3058\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n

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

HTML<\/h2>\n\n\n\n

\u4ee5\u4e0b\u306f\u3001\u8272\u306e\u3064\u3044\u305f\u80cc\u666f\u3092\u753b\u9762\u3044\u3063\u3071\u3044\u306b\u8868\u793a\u3059\u308bHTML\u306e\u4f8b\u3067\u3059\u3002
css\u30d5\u30a1\u30a4\u30eb\u306f\u540c\u3058\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u3042\u308b\u3082\u306e\u3068\u3057\u307e\u3059\u3002
out\u30af\u30e9\u30b9<\/strong> \u304c\u8272\u306e\u3064\u3044\u305f\u80cc\u666f\u3092\u753b\u9762\u3044\u3063\u3071\u3044\u306b\u8868\u793a\u3059\u308b\u30af\u30e9\u30b9\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n

<!DOCTYPE html>\n<html lang="ja">\n    <head>\n        <meta charset="utf-8">\n        <meta http-equiv="X-UA-Compatible" content="IE=edge">\n        <meta name="viewport" content="width=device-width, initial-scale=1">\n        <title>test<\/title>\n        <link href="test.css" rel="stylesheet" type="text\/css">\n    <\/head>\n\n    <body>\n      <div class='out'>\n      <\/div>\n    <\/body>\n\n<\/html><\/code><\/pre><\/div>\n\n\n\n
CSS<\/h2>\n\n\n\n
\u753b\u9762\u3044\u3063\u3071\u3044\u306b\u8868\u793a\u3059\u308b\u70ba\u306ecss\u306e\u8a18\u8ff0\u306f\u4ee5\u4e0b\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n
body {\n  margin: 0;\n}\n\n.out {\n  width: 100vw;\n  height: 100vh;\n  background-color: #99cc00;\n}<\/code><\/pre><\/div>\n\n\n\n
body\u30bf\u30b0\u306b\u306f\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u30de\u30fc\u30b8\u30f3\u304c\u3042\u308b\u306e\u3067\u3001body\u30bf\u30b0\u306b margin: 0;<\/strong> \u3092\u6307\u5b9a\u3057\u306a\u3044\u3068\u3001\u9699\u9593\u304c\u3067\u304d\u3066\u3057\u307e\u3046\u306e\u6ce8\u610f\u3057\u3066\u4e0b\u3055\u3044\u3002<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\u30d6\u30e9\u30a6\u30b6\u306e\u4f59\u767d\u306b\u3064\u3044\u3066\u306f\u4ee5\u4e0b\u3082\u53c2\u8003\u306b\u3057\u3066\u4e0b\u3055\u3044\u3002<\/p>\n\n\n\n
\u53c2\u8003<\/span>\n
\u30d6\u30e9\u30a6\u30b6\u306e\u4f59\u767d<\/a><\/p>\n<\/div>\n\n\n\n
\u80cc\u666f\u753b\u50cf\u5168\u753b\u9762\u8868\u793a<\/h1>\n\n\n\n
\u4eca\u5ea6\u306f\u80cc\u666f\u306b\u753b\u50cf\u3092\u5168\u753b\u9762\u306b\u8868\u793a\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n
\u80cc\u666f\u753b\u50cf<\/h2>\n\n\n\n
css\u30d5\u30a1\u30a4\u30eb\u3068\u540c\u3058\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u80cc\u666f\u753b\u50cf\u3092\u4fdd\u5b58\u3057\u3066\u304a\u3044\u3066\u4e0b\u3055\u3044\u3002
\u4eca\u56de\u306f\u753b\u50cf\u306e\u30b5\u30a4\u30ba\u3092 1920 \u00d7 1080(\u30d4\u30af\u30bb\u30eb)\u306b\u3057\u3001\u30d5\u30a1\u30a4\u30eb\u540d\u3092 “1920_1080.png” \u3068\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n
HTML<\/h2>\n\n\n\n
\u5148\u307b\u3069\u306e\u4f8b\u3092\u4f7f\u7528\u3057\u307e\u3059\u3002\u65b0\u3057\u3044\u30af\u30e9\u30b9 out_img\u30af\u30e9\u30b9<\/strong> \u304c\u80cc\u666f\u753b\u50cf\u3092\u8868\u793a\u3059\u308b\u30af\u30e9\u30b9\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n
<!DOCTYPE html>\n<html lang="ja">\n    <head>\n        <meta charset="utf-8">\n        <meta http-equiv="X-UA-Compatible" content="IE=edge">\n        <meta name="viewport" content="width=device-width, initial-scale=1">\n        <title>test<\/title>\n        <link href="test.css" rel="stylesheet" type="text\/css">\n    <\/head>\n\n    <body>\n      <div class='out out_img'>\n      <\/div>\n    <\/body>\n\n<\/html><\/code><\/pre><\/div>\n\n\n\n
CSS<\/h2>\n\n\n\n
\u80cc\u666f\u753b\u50cf\u3092\u8868\u793a\u3059\u308b\u30af\u30e9\u30b9 out_img\u30af\u30e9\u30b9<\/strong> \u3092\u8ffd\u8a18\u3057\u307e\u3057\u305f\u3002<\/p>\n\n\n\n
body {\n  margin: 0;\n}\n\n.out {\n  width: 100vw;\n  height: 100vh;\n}\n\n.out_img {\n  background-image: url('1920_1080.png');\n  background-position: center center;\n  background-repeat: no-repeat;\n  background-size: cover;\n}<\/code><\/pre><\/div>\n\n\n\n
\u6700\u5f8c\u306b<\/h1>\n\n\n\n
\u6b21\u56de\u306f\u3001\u80cc\u666f\u753b\u50cf\u306e\u771f\u3093\u4e2d\u306b\u6587\u5b57\u3092\u8868\u793a\u3055\u305b\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n
\u6b21\u56de<\/span>\n
\u6587\u5b57\u3092\u753b\u9762\u4e2d\u592e\u3078\u8868\u793a\u3059\u308b<\/a><\/p>\n<\/div>\n","protected":false},"excerpt":{"rendered":"
\u3088\u304f\u3042\u308b\u3001\u80cc\u666f\u753b\u50cf\u3092\u753b\u9762\u3044\u3063\u3071\u3044\u306b\u8868\u793a\u3059\u308b\u65b9\u6cd5\u3092\u8aac\u660e\u3057\u307e\u3059\u3002<\/p>\n","protected":false},"author":1,"featured_media":4723,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9],"tags":[],"class_list":["post-1350","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-css"],"_links":{"self":[{"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/posts\/1350","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1350"}],"version-history":[{"count":24,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/posts\/1350\/revisions"}],"predecessor-version":[{"id":4737,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/posts\/1350\/revisions\/4737"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/media\/4723"}],"wp:attachment":[{"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1350"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1350"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1350"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}