HTML5 Articles - Page 39 of 11

Create a media resources for media elements, defined inside video or audio elements in HTML5

Sindhura Repala
Updated on 10-Feb-2025 11:35:49

702 Views

HTML5 supports five media elements, that are useful for creating media resources. The different media tags are , , , and . These tags are used to change the development, let us discuss each element in detail with an example − The tag To play videos on your web page, you can use the HTML element. This element provides a standard way to embed videos in a webpage. The simple code to embed a video is as follows − Your browser does not support the ... Read More

How to include the result of a calculation in HTML5?

Bhanu Priya
Updated on 10-Oct-2023 14:41:01

854 Views

To define or include a result of calculation in HTML, we use tag. The output tag helps in providing the result of calculation, which is performed by the JavaScript (Client side scripting language). Syntax Following is the usage of tag − --- Attributes The attributes used in output tag is shown below − Attribute Description for List of IDs of other elements, i.e. it indicates the elements who have contributed input value to the calculation. form Enables to place output elements anywhere within a ... Read More

Section that contains only navigation links in HTML5

Bhanu Priya
Updated on 10-Oct-2023 14:27:49

377 Views

Navigational links can be provided by using tag in the document. The links of nav element navigates to other webpages or points to different section of same webpage. Examples of nav element are contents, tables, menus and indexes. Syntax Following is the usage of tag in HTML − Links…… Example Following example where we are trying to create a section that contains only navigation links − TutorialsPoint ... Read More

How do we display the main content in the document in HTML5?

Bhanu Priya
Updated on 10-Oct-2023 13:06:01

337 Views

To display the main content in the document, we use tag. The tag consists of open and closing tags, the content present in between element is unique to the document, it does not contain any content which is repeated across documents like navigation links, site logos, sidebars and search forms. In a document there should be only one element. The main is not a descendent of , , , or element. The tag supports almost all browsers and it also supports global and event attributes. Syntax Following is the usage of tag in ... Read More

Create self-contained content in HTML5

Bhanu Priya
Updated on 06-Oct-2023 16:03:48

846 Views

The element in HTML5 is used to display self-contained content (images, videos, etc). This can be attached to the main program, and can be used at any place within the document without impacting the flow of document. Additionally, if we remove the tag, it won’t affect the structure of the document. Syntax The usage of tag in HTML is shown below − Image content... The parameters used in the caption are img, src and figcaption. The tag is used to specify the image source URL when we are including an ... Read More

How to add a container for an external (non-HTML) application in HTML5

Bhanu Priya
Updated on 06-Oct-2023 14:46:07

413 Views

To add a container for an external application in HTML5 we use tag. It defines or embed a container for an external resource like, web pages, media player, pictures or a plug-in application. Following is the usage of embed tag in HTML − It doesn’t have closing tag. The browsers that support embed tag are google chrome, Internet explorer, Firefox, Apple Safari, Opera. It supports, global and event attributes in HTML. Most of the browsers display the element with default CSS settings like embed:focus { outline: none; } Attributes Now, ... Read More

How to use drag and drop in HTML5?

Yaswanth Varma
Updated on 12-Oct-2022 14:45:37

805 Views

Grabbing an object and moving it to a different position is made simpler with the drag and drop idea, which is very dynamic and user-friendly. This enables the user to click and drag an element to another position before letting go of the mouse button to drop it there. Drag and drop events Drag and Drop event consists of various types of events, some of them are listed below. ondrag − is a term used in HTML to describe when an element or text selection is being moved around. ondragstart − is a function that is called when a ... Read More

How to draw a text with strokeText() in HTML5?

Yaswanth Varma
Updated on 12-Oct-2022 13:44:07

534 Views

The stroketext() method renders the provided text using the current font, linewidth, and strokestyle properties at the specified place. The path won't be affected by any subsequent fill() or stroke() calls because this method draws directly to the canvas without changing the original route. Syntax Following is the syntax for stroke text in HTML ctx.strokeText(text, x, y, maxWidth); Where, X − The point on the x-axis where the text should start to be drawn, in pixels. Y − The baseline's y-axis coordinate, in pixels, at which to start rendering the text. text − A string containing the text ... Read More

How to draw an Image with drawImage() in HTML5?

Yaswanth Varma
Updated on 04-Apr-2023 12:11:45

710 Views

The "canvas" element merely serves as a container for visuals; drawing the graphics requires the use of a scripting language. It is a procedural, low-level model without an internal scene that updates a bitmap. The drawImage() function is what we employ to draw an image onto a canvas. This feature transfers a video, canvas, or picture to the canvas. Syntax context.drawImage(img, x, y, swidth, sheight, sx, sy, width, height); Where, Img − Determines whether to utilise a video, canvas, or image. Sx − The starting x coordinate for clipping. Sy − The y point at which clipping should ... Read More

Advertisements