From dcfb172704f3afb68a30425029ec834be2883274 Mon Sep 17 00:00:00 2001 From: bt Date: Sat, 8 Jun 2024 13:22:19 -0400 Subject: More content porting, on-going markdown changes for lowdown support --- build/css-video-backgrounds/index.html | 28 +++++++++++++++++++--------- 1 file changed, 19 insertions(+), 9 deletions(-) (limited to 'build/css-video-backgrounds') diff --git a/build/css-video-backgrounds/index.html b/build/css-video-backgrounds/index.html index c52a5a6..4282369 100644 --- a/build/css-video-backgrounds/index.html +++ b/build/css-video-backgrounds/index.html @@ -1,31 +1,41 @@ - + CSS Video Backgrounds - - + + +
-

CSS Video Backgrounds

+

CSS Video Backgrounds

+

2018-04-16

+

With the release of Safari 11.1 on macOS and Safari on iOS 11.3, developers now have the ability to support background videos (mp4 support only - at the time of this article) with pure CSS.

+

Example:

+ 
.video-background {
-	background-image: url('path-to-video.mp4);
+    background-image: url('path-to-video.mp4);
 }
-

See it in action

-

Check out the very basic CodePen I created below to see it live (make sure you view it in latest Safari or else you won't see anything :P)

-

CSS Video Background (Safari Only)

+ +

See it in action

+ +

Check out the very basic CodePen I created below to see it live (make sure you view it in latest Safari or else you won’t see anything :P)

+ +

CSS Video Background (Safari Only)

+

You can read up on all the new features implemented in 11.1 Safari here:

+

New WebKit Features in Safari 11.1