Abbreviations and acronyms in HTML. Lesser Known Semantic Elements Typical Use Cases

Some programming languages ​​have names that are not easy to represent in classes, such as C # (C-sharp). The right way the record in this case will be "class =" language-c \ # "", which can create difficulties and lead to typos. I would recommend using a class with only letters and hyphens and writing it down in its entirety. Therefore, in this case, use "class =" language-csharp "" better.

Conclusion of interaction with the computer

Two elements samp and kbd can be used to input and output interactions with a computer program. For example:

One common method of determining if a computer is connected to the internet is to use the computer program ping to see if a computer likely to be running is reachable.

kittaghy% ping -o google.com
 PING google.com (64.233.187.99): 56 data bytes 64 bytes from 64.233.187.99: icmp_seq = 0 ttl = 242 time = 108.995 ms --- google.com ping statistics --- 1 packets transmitted, 1 packets received, 0  % packet loss round-trip min / avg / max / stddev = 108.995 / 108.995 / 108.995 / 0.000 ms

Element samp indicates a sample of the output from computer program... As shown in this example, Various types output can be specified using the class attribute. However, there is no widely accepted agreement on what kinds of classes to use.

The kbd element specifies the input for user-computer interaction. While this is traditionally keyboard input (hence the abbreviation "kbd"), it should also be used to indicate other types of input, such as voice input.

Variables

The var element is used to specify variables in text content. It can include algebraic mathematical expressions or it can be found in program code. For example:

The value of x in 3 x+ 2 = 14 is 4.

my $ welcome= "Hello world!";

Citation

The cite element is used to indicate where the adjacent content comes from - when citing a person, book, or other publication, or usually when referring people to another source, that source should be placed in the cite element. For example:

The saying Everything should be made as simple as possible, but not simpler is often attributed to Albert einstein, but it actually a paraphrasing of a quote which is much less easy to understand.

Element HTML abbreviations () is an abbreviation or abbreviation; the optional title attribute can provide an extension or description for the abbreviation. If present, title must contain this Full description and nothing else.

Article How to mark abbreviations and make them understandable- this is a tutorial on how to use and related items.

Attributes

This element only supports global attributes. The title attribute has a specific meaning when used with an element. ; he should contain a complete human-readable description or an extension of the abbreviation. This text is often displayed by browsers as a tooltip when the mouse hovers over an element.

Each element you use is independent of everyone else; providing a title for one does not automatically attach the same extension text to others with the same content text.

Usage Notes

Typical use cases

Of course, it is not required that all abbreviations be marked with ... However, there are a few cases where this is useful:

Grammatical considerations

In languages ​​with a grammatical number (that is, languages ​​where the number of elements affects the grammar of the sentence), use the same grammatical number in the title attribute as inside your element ... This is especially important in languages ​​with more than two numbers, such as Arabic, but also relevant in English.

Default style

The purpose of this element is purely for the convenience of the author, and all browsers render it inline (display: inline) by default, although its default style varies from one browser to the next:

• Some browsers, such as Internet Explorer, do not build it differently than an element .
• Opera, Firefox and a few others add a dashed line to the content of an element.
• Several browsers not only add dotted underline, but also put it in small caps; to avoid this styling, adding something like font-variant: none in the CSS won't take care of this case.

Examples of

Marking an abbreviation semantically

To tag an abbreviation without providing an extension or description, simply use without any attributes as shown in this example.

Html

Using Html is fun and easy!

result

Conventional abbreviations

You can use CSS to set a custom style to be used for shortcuts, as seen in this simple example.

Html

Using CSS, you can style your abbreviations!

CSS

result

Enabling expansion

Adding the title attribute allows you to specify an extension or definition of an abbreviation or abbreviation.

Html

Ashok "s joke made me Lol big time.

result

Definition of an abbreviation

you can use in tandem with for a more formal definition of the abbreviation as shown here.

Html

Html is a markup language used to create the semantics and structure of a web page.

A Specification (spec) is a document that outlines in detail how a technology or API is intended to fun ction and how it is accessed.

result

Availability

Describing an abbreviation or abbreviation in full the first time it is used on a page helps people understand it, especially if the content is technical or industry jargon.

example

JavaScript Object Notation ( Json) is a lightweight data-interchange format.

This is especially useful for people who are not familiar with the terminology or concepts discussed in the content, people who are new to the language, and people with cognitive problems.

Specifications

Browser Compatibility

1. Prior to Firefox 4, this element implemented the HTMLSpanElement interface instead of the standard HTMLElement interface.