{"id":4686,"date":"2019-02-26T23:26:02","date_gmt":"2019-02-26T14:26:02","guid":{"rendered":"http:\/\/takuyakobayashi.jp\/?p=4686"},"modified":"2019-02-26T23:26:02","modified_gmt":"2019-02-26T14:26:02","slug":"video%e3%82%92background-sizecover%e3%81%ae%e3%82%88%e3%81%86%e3%81%ab%e8%a1%a8%e7%a4%ba%e3%81%99%e3%82%8b","status":"publish","type":"post","link":"https:\/\/takuyakobayashi.jp\/blog\/2019\/02\/26\/4686","title":{"rendered":"video\u3092background-size:cover\u306e\u3088\u3046\u306b\u8868\u793a\u3059\u308b"},"content":{"rendered":"

16:9\u306evideo\u8981\u7d20\u3092background-position:center 0;background-size:cover;\u306e\u3088\u3046\u306b\u8868\u793a\u3059\u308b\u65b9\u6cd5\u3002<\/p>\n

\u5e38\u6642\u306f\u6a2a\u5e45100%\u3067\u9ad8\u3055\u306f\u6210\u308a\u884c\u304d\u8868\u793a\u306b\u3057\u3066\u304a\u3044\u3066\u3001\u30e1\u30c7\u30a3\u30a2\u30af\u30a8\u30ea\u306emax-aspect-ratio\u306716:9\u672a\u6e80\u306b\u306a\u3063\u305f\u5834\u5408\u306b\u3001\u5929\u5730100%\u306e\u6a2a\u5e45\u6210\u308a\u884c\u304d\u306b\u3059\u308b\u3002<\/p>\n

\u305d\u306e\u6642\u306b\u3001left:50%; transform:translateX(-50%);\u3067\u30bb\u30f3\u30bf\u30ea\u30f3\u30b0\u3092\u3059\u308b\u306e\u304c\u30df\u30bd\u3002<\/p>\n

video {
\n position: fixed;
\n width: 100%;
\n height: auto;
\n z-index: 0;
\n}
\n@media (max-aspect-ratio: 16\/9) {
\n video {
\n width: auto;
\n height: 100%;
\n left: 50%;
\n transform: translateX(-50%);
\n }
\n}<\/code><\/p>\n","protected":false},"excerpt":{"rendered":"

16:9\u306evideo\u8981\u7d20\u3092background-position:center 0;background-size:cover;\u306e\u3088\u3046\u306b\u8868\u793a\u3059\u308b\u65b9\u6cd5\u3002 \u5e38\u6642\u306f\u6a2a\u5e45100%\u3067\u9ad8\u3055\u306f\u6210\u308a\u884c\u304d\u8868\u793a\u306b\u3057\u3066\u304a\u3044\u3066\u3001\u30e1\u30c7\u30a3\u30a2\u30af\u30a8\u30ea\u306e … \u7d9a\u304d\u3092\u8aad\u3080 video\u3092background-size:cover\u306e\u3088\u3046\u306b\u8868\u793a\u3059\u308b<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":4692,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[],"class_list":["post-4686","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tips"],"_links":{"self":[{"href":"https:\/\/takuyakobayashi.jp\/blog\/wp-json\/wp\/v2\/posts\/4686","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/takuyakobayashi.jp\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/takuyakobayashi.jp\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/takuyakobayashi.jp\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/takuyakobayashi.jp\/blog\/wp-json\/wp\/v2\/comments?post=4686"}],"version-history":[{"count":0,"href":"https:\/\/takuyakobayashi.jp\/blog\/wp-json\/wp\/v2\/posts\/4686\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/takuyakobayashi.jp\/blog\/wp-json\/wp\/v2\/media\/4692"}],"wp:attachment":[{"href":"https:\/\/takuyakobayashi.jp\/blog\/wp-json\/wp\/v2\/media?parent=4686"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/takuyakobayashi.jp\/blog\/wp-json\/wp\/v2\/categories?post=4686"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/takuyakobayashi.jp\/blog\/wp-json\/wp\/v2\/tags?post=4686"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}