Yummysheep Tutorial

Back to the catalog

Last Update : 2023/5/6

Chatper 4 - Images & Videos

1. Insert Images into your website

The img is used to insert images in the html5 documents. Example:

icon <img src="URL" alt="ALT">

Each image must have at least two attributes: src & alt attribute. The src make the direction to find the image. Its value is the URL of the image file image.jpg / /image.jpg https://image.jpg However, if the browse can't find the images, the alt attribute will be displayed instead of the image.



icon



2. Set the Width and Height of your images

The width and height attributes are used for setting the width and height of an image.

<img src="URL" alt="ALT" width="200" height="200"> icon



3. Insert Videos into your website

By using <video>, you can embe video in your webpage. However, <video> only supports local files, it doesn't support external link such as Youtube. But don't worry, you can use <iframe> to show a youtube video. We will explain <iframe> below.

<video> controls="controls" src="URL"></video>



you can also use <iframe> to embe any website and Youtube video.

<iframe> width="560" height="315" src="https://www.youtube.com/embed/DTm6YK7IDWw" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>