Html elements with no closing tags

HTML Void Elements

The article explains the concept of void elements in HTML and how they differ from self-closing tags in XML, XHTML, and SVG, highlighting the syntax and parsing differences between them.

HTML, XML, XHTML, and SVG are markup languages used to structure web documents. They define a set of rules for creating elements [1] that describe the content of the document. In this context, elements are entities that can have attributes and may contain other elements or text. Some elements can be either void or non-void, and this distinction is essential for understanding how these languages work.

Void Elements in HTML

A void element [3] is an element in HTML that doesn’t have a closing tag. It is marked up by a start tag only. Void elements are used to represent elements that have no content (a void elements content model [2] never allows it to have contents under any circumstances), and they cannot have any child elements. Void elements can have attributes. They are self-contained, and they don’t require any additional information to be rendered correctly.

List of (non-deprecated) void elements in HTML


Self-Closing Tags in XML, XHTML, and SVG

In XML, XHTML, and SVG, self-closing tags are used to represent empty elements. Unlike void elements in HTML, self-closing tags have both a start tag and an end tag, but the end tag is written with a slash before the closing angle bracket. For example, is a self-closing tag that represents an empty element in XML, XHTML, and SVG.

Difference between Void Elements and Self-Closing Tags:

The main difference between void elements in HTML and self-closing tags in XML, XHTML, and SVG is that void elements are defined as a separate category of elements, while self-closing tags are used to represent empty elements. Void elements in HTML cannot have any child elements, whereas self-closing tags can represent both empty elements and elements with content. For example,

represents an empty paragraph in XML, XHTML, and SVG, while

Some text

represents a paragraph with content.

Another difference between void elements and self-closing tags is how they are parsed by the browser. In HTML, void elements are parsed as standalone elements, and their closing tags are not required. In contrast, self-closing tags in XML, XHTML, and SVG are parsed as regular elements, and their closing tags are required. This means that omitting the closing tag in a self-closing tag in XML, XHTML, or SVG is considered a syntax error.

Conclusion

In conclusion, void elements in HTML are a special category of elements that are defined as having no content and no closing tag. They are used to represent elements that are self-contained and require no additional information to be rendered correctly. In contrast, self-closing tags in XML, XHTML, and SVG are used to represent both empty elements and elements with content. They have both a start tag and an end tag, but the end tag is written with a slash before the closing angle bracket. Understanding the differences between void elements and self-closing tags is essential for writing valid and well-formed markup in HTML, XML, XHTML, and SVG.

Self-closing tags ( ) do not exist in HTML! [4]

References

Источник

What are Self Closing Tags in HTML?

Javascript Course - Mastering the Fundamentals

example

  • A traditional HTML tag such as

    , , , etc., had an opening tag and a closing tag. However, due to their fundamental structure, void components in HTML, such as images and links, do not technically require closing tags. Images and links cannot have content — they are pointers to an element installed on the website.

  • Instead of including independent opening and closing tags in more modern HTML variants such as XHTML, developers employ a self-closing tag that includes a «/» within the carets (\<>) . For example –

Output_selfclosingtags

Output

  • A self-closing tag in HTML is a kind of HTML tag that does not need to be closed manually by its closing tag, which means it does not have a separate closing tag as . Some few self-closing tags are ,

    ,
    , , etc.

  • Self-closing tags in HTML are sometimes also known as empty tags, void tags, singletons tags, etc. This means that these tags have no content and cannot have any children.

Complete List of Self-Closing Tags for HTML5

Tag Description
The HTML tag specifies an area within an image map with predetermined clickable zones based on coordinates, which subsequently accepts a URL and behaves as a hyperlink. This element can only be used inside an element.
The HTML tag specifies a base URI, often known as a base URL, for relative links in a document. A document can only include one element. For example, you can specify the base URL once in the header area of your page, and all subsequent relative links will utilize that URL as a starting point.
The HTML
tag is used to create a line break in the text. It is typically employed in poems or addresses where line division is required. It is an empty tag, which means it contains no content and is referred to as a void element. Including the
tag in the HTML code functions similarly to pressing the enter key in a word processor.
The HTML tag specifies the attributes for columns contained within the tag. This allows you to format or add a class to a column or group of columns rather than each individual cell. It is most commonly found within an element. This element specifies the style property for each column.
The HTML tag is used to embed external applications, which are typically multimedia elements such as audio or video, at the specified place in an HTML document. It serves as a container for plug-ins such as flash animations. This is a new tag in HTML 5, and it just requires the beginning tag.
The HTML


tag is used to insert a horizontal rule or a paragraph-level thematic break in a Html document to split or separate document sections. It is used when the topic of your HTML content abruptly changes. It divides them by drawing a horizontal line. The


tag is an empty tag that does not require a closing tag. For example, a change of scene in a story or a switch of the topic within a segment.

The HTML tag is used to display or embed an image on the web page. The HTML image element is an inline and empty element that only includes attributes; closing tags are not used in the image element.
The HTML tag is used to create interactive controls for web-based forms to accept data from the user; depending on the device and user agent, a wide variety of input data and control widgets are accessible. The element is among the most powerful and complex in all HTML tags due to the vast amount of input types and attribute combinations. It is used inside the element to declare input controls that allow users to enter data. can be used to define labels for the input element.
The HTML tag is used to establish a connection between a current document and an external resource. The link tag is mainly used to connect to external sheets and establish site icons (both «favicon» style icons and icons for the home screen and apps on mobile devices), among other things. This element can appear more than once, but it only appears in the head section. The link element’s values indicate how the item is linked to and is related to the containing page.
The HTML tag allows you to add metadata — extra essential information about a document in a number of ways. The elements can be used to incorporate name/value pairs specifying HTML document features such as expiry date, author, a list of keywords, document author, etc. You can include more than one meta tag in your document depending on the information you wish to maintain. Still, in general, meta tags do not affect the physical appearance of the document. Thus it makes no difference whether you include them or not.
The HTML tag is used to pass a parameter to the object associated with the element for plug-ins. We can use several tags within an element in any order, but each tag must have a name and value attribute and should be inserted at the beginning of the content. The parameter tag governs the behavior of the element by specifying a distinct pair of name and value attributes, such as autoplay, controller, etc.
The HTML tag is used as a child element to define multiple media resources for the , , and elements. It is widely used to provide the same media material in several file formats, such as mp3, mp4, and so on, in order to enable compatibility with a wide range of browsers due to their varying support for image and media file formats. Basically, it is used to attach multimedia assets such as audio, video, and images.
The HTML tag is used as a child element of and elements in order to define time-based text tracks for a media file. It is used to include a subtitle, caption, or any other type of text that will be rendered when a media file gets displayed. For example, it allows you to set timed text tracks (or time-based data) to handle subtitles automatically. WebVTT (Web Video Text Tracks) format (.vtt files) is used for the tracks.
The HTML tag stands for word break opportunity. This tag denotes a spot within the text where the browser may optionally break a line, even though its line-breaking rules would not otherwise cause a break at that location. It is typically used when the employed term is too long, and there is a risk that the browser would break lines at the incorrect location in order to fit the content.

Examples

Example 1: Using
tag.

Using br tag

Example 2: Using


tag.

Using hr tag

Example 3: Using tag.

Источник

HTML Singleton Tags With No Closing Tag

HTML code

Jennifer Kyrnin is a professional web developer who assists others in learning web design, HTML, CSS, and XML.

For most HTML elements, you begin with an opening tag and end with a closing tag. Between those two tags, the content of the element appears. For example:

The simple paragraph element shows how an opening and a closing tag is used. Most HTML elements follow this same pattern, but several HTML tags do not include both an opening and a closing tag.

What Is a Void Element?

The void elements or singleton tags in HTML don’t require a closing tag to be valid. These elements are usually ones that either stand alone on the page ​or where the end of their contents is obvious from the context of the page itself.

The List of HTML Void Elements

Several HTML 5 tags are void elements. When you write valid HTML, you should leave off the trailing slash for these tags as shown below. The trailing slash is required, however, for valid XHTML.

  • : Used for the area inside of an image map.
  • : The base URL for all relative URLs in a document. There can be no more than one of these per document and it must be in the head of the page.
  • : A line break, often used in text content to create a single line break instead of a paragraph. It should not be used to create visual separation on a page by stacking up many
    tags, because that function is a visual need and therefore the domain of CSS instead of HTML.
  • : Specifies column properties for each column within a element.
  • : Specifies a command that a visitor can invoke.
  • : Used with external applications and interactive content for integration.
  • : A horizontal rule, which is a straight line on a page. In many cases, CSS borders create separator lines instead of this HTML element.
  • : One of the workhorse elements of HTML, this is the image tag. It is used to add graphic images to a webpage.
  • : A form element that is used to capture information from visitors. There are a number of valid input types, from the common «text» input that has been used in forms for years, to some new input types that are part of HTML5.
  • : This tag creates a key-pair generator field that is used for forms.
  • : Not to be confused with the «hyperlink» or anchor () tag, this link is to set linkage between a document and an external resource. Use it to link to an external CSS file, for example.
  • : Meta tags are «information about content.» They are found in the head of a document and used to convey page information to the browser. There are many different meta tags that you can use on a webpage.
  • : Used to define parameters for plugins.
  • : This tag allows you to specify alternative file paths for media on your page, including videos or images or audio files.
  • : This tag sets a track to be used with a media file, a video, or audio, which are often added with the or tags.
  • : This stands for Word Break Opportunity. It specifies where in a block of text it would be acceptable to add a line break.

Источник

Читайте также:  Try python что делает
Оцените статью