<lite-youtube videoid="LN1TQm942_U" style="background-image: url('https://i.ytimg.com/vi/LN1TQm942_U/hqdefault.jpg');">
<a href="https://youtube.com/watch?v=LN1TQm942_U" class="lty-playbtn" title="Play Video">
<span class="lyt-visually-hidden">Play Video: Riven Trailer</span>
</a>
</lite-youtube>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/lite-youtube-embed/0.3.2/lite-yt-embed.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lite-youtube-embed/0.3.2/lite-yt-embed.css" integrity="sha512-utq8YFW0J2abvPCECXM0zfICnIVpbEpW4lI5gl01cdJu+Ct3W6GQMszVITXMtBLJunnaTp6bbzk5pheKX2XuXQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />/* lite-youtube {
display: block;
place-items: center;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
inline-size: 100%;
block-size: auto;
aspect-ratio: 16 / 9;
position: relative;
a {
font: 600 100% system-ui;
text-shadow: 0 0 5px black;
color: white;
}
}
*/
External CSS
This Pen doesn't use any external CSS resources.