What is SVG?
SVG stands for Scalable Vector Graphics
SVG is used to define graphics for the Web
SVG is a W3C recommendation
The HTML svg Element
The HTML svg element is a container for SVG graphics.
SVG has several methods for drawing paths, boxes, circles, text, and graphic images.
Responsive Web Design
What is The Viewport?
The viewport is the user visible area of a web page.
The viewport varies with the device, and will be smaller on a mobile phone than on a computer screen.
Before tablets and mobile phones, web pages were designed only for computer screens, and it was common for web pages to have a static design and a fixed size.
Then, when we started surfing the internet using tablets and mobile phones, fixed size web pages were too large to fit the viewport.
To fix this, browsers on those devices scaled down the entire web page to fit the screen. This was not perfect!! But a quick fix.
Indicate the current page’s location within a navigational hierarchy that automatically adds separators via CSS.
Toggle floats on any element, across any breakpoint, using our responsive float utilities.
YouTube Videos The easiest way to play videos in HTML, is to use YouTube.
Struggling with Video Formats?
Earlier in this tutorial, you have seen that you might have to convert your videos to different formats to make them play in all browsers.
Converting videos to different formats can be difficult and time-consuming.
An easier solution is to let YouTube play the videos in your web page.
YouTube Video Id
YouTube will display an id (like tgbN6m87vqY), when you save (or play) a video.
You can use this id, and refer to your video in the HTML code.
Playing a YouTube Video in HTML
To play your video on a web page, do the following:
Upload the video to YouTube
Take a note of the video id
Define an iframe element in your web page
Let the src attribute point to the video URL
Use the width and height attributes to specify the dimension of the player
Pagination Documentation and examples for showing pagination to indicate a series of related content exists across multiple pages.
Spacing Bootstrap includes a wide range of shorthand responsive margin and padding utility classes to modify an element’s appearance.