00:06This video demonstrates a web development exercise, in which the following will be presented:
00:10A playlist, in a carousel-like format, is a window that appears across several videos.
00:15In a specific order or sequence, these videos will be taken from YouTube.
00:21For this, we created a folder on the desktop called Test 2, already in the Visual environment.
00:26Studio, we create a new file called video.html, we write HTML again, by default
00:34It shows us the different programming options; we choose HTML5, we go to Bootstrap, it's a framework
00:46open-source user interface design developed by X, its purpose
00:51It's to facilitate web development; here we need to link the following links for Javascript.
00:57CSS, to make Bootstrap a dissipative page.
01:21We linked the links, using Bootstrap.
01:42In the title tag we changed the names to Daniel Travesblog, this allows us to name the browser tabs.
02:01We create a DICT tag of type ClassContainer; this tag will contain all the content within the Body, and it serves our purpose.
02:08CSS programming.
02:12Now with Center we center the title Daniel Travesblog, for the page title we type H1.
02:22Now let's go to Bootstrap, here we look for the programming code for the Carousel-type video presentation.
02:39We observe that Bootstrap gives us a series of examples of what we are looking for.
02:50When we select the first code, which contains image-type presentations, we will change it to video links.
03:00To get YouTube video links, on YouTube we select a video, click share and then embed
03:07We have the video link to embed it,
03:09On a website, we copy, we do the same for a certain number of videos, and we change the link instead of the link.
03:15We insert the video link into the image.
03:21We insert the Bootstrap programming and the links of each selected video into the HTML programming.
03:30Now, if we want to add more text, we do this with the OP paragraph tag, and center it with the
03:36Playlist message: Support the channel, for example.
03:44We are going to create a CSS file, with link rel equal to style 7, named Playlist CSS.
04:21In CSS, we write the multiplication sign, open curly braces, and inside the braces we write: margin, 0, padding 0, box sizing
04:290, here sets margins, padding and steel box template for all elements, ensuring a more consistent format.
04:43Here's the important part: we write `.container`, open curly braces, and everything inside `container` will be modified by CSS.
04:51case a square.
04:56We switch to preview by right-clicking on Show Preview.
05:07In container, we type, widths box width of 600 pixels, box or box height of 500 pixels, border of
05:17line or bordery solid or solid, one pixel, black color.
05:38Padding of 20 pixels is the separation between text and content.
05:54In color, background, color asterisk to E of 6 F1.
06:09Typeface, font family, roboto type.
06:28And finally we get the presentation of the videos, with the page title and text.
06:44You have everything you need. If you found the video helpful, don't forget to subscribe.
Comentarios