Html insertion of a symbol into the code. Tick symbol: where to find and how to put it
Today you will find out how to make a checkbox in HTML and add to him CSS styles for better compatibility with the site design.
Demonstration
Checkbox in HTML
Let's create a block with four checkboxes, the first one will be marked with a tick. Each checkbox will be enclosed in a tag label, inside which there is an input field, text and an element span to be styled.
Tag label serves as a container for each checkbox; for clarity, I temporarily set a red frame to the tag label. When there is little experience, this good way, see the boundaries of any tag so as not to act blindly.
CSS for checkbox
Line tag label, replace it with block (display: block) so that the checkboxes stand one under the other, user-select: none– prevents the user from selecting an element.
Container (
display: block;
user-select: none;
}
This code hides the default browser styles for the checkbox. We make the element completely transparent by opacity, width And height with a zero value and in their place, set custom styles for the checkbox.
Container input (
opacity: 0;
height: 0;
width: 0;
}
We create custom checkboxes. Change the size and color of the background.
Checkmark (
height: 23px;
width: 22px;
background-color: #eec321;
}
When you hover the cursor, make the background color a little darker.
Container:hover input ~ .checkmark (
background-color: #ccc678;
}
For the checked checkbox, set a different color for the background.
Container input:checked ~ .checkmark (
background-color: #2196f3;
}
Hiding the checkbox for unchecked checkboxes using a pseudo-element after.
Checkmark:after (
content: "";
position: absolute;
display: none;
}
We make the checkmark visible only for checked checkboxes.
Container input:checked ~ .checkmark:after (
display: block;
}
Draw and stylize the checkmark. We draw a checkmark on a blank CSS. Let's draw a rectangle with a white frame, the two sides of the rectangle have no frame (zero width), we get a rectangular corner, we rotate it 45 degrees and we get a check mark.
The check mark symbol is not present on the keyboard, but using special combinations you can easily add it to your message, post or text document.
Let's take a closer look at how this can be done.
Types of checkmarks + uses
The check mark (bird, jackdaw) is a special icon that is often used to describe confirmation of something.
Can be found in the design of listings or underlining thoughts. After reading the following instructions, you can find and use the symbol yourself.
The simplest option is to copy the object from this article. There are several types of icon:
If you need a checkmark to use in one sentence or phrase, simply copy the element you like by highlighting it and pressing CTRL and C on your keyboard.
To type a bird on the keyboard yourself, you must use Unicode. Type the letter U and +. Then you need to dial the badge code.
Digital symbols for different types The checkmarks are as follows: 2713 (regular sign), 2714 (bold), 2705 (highlighted checkmark in a square), 2611 (regular checkmark in a square).
If the combination U+2713 or another does not automatically turn into a check mark, most likely the document is not configured to automatically recognize Unicode characters or you are entering the code incorrectly.
The text will immediately be transformed into the desired symbol, so you can safely type it in messages and various posts.
Icon in MS Word
Anyone who has ever used it knows that setting special characters helps structure the document and make it easy to read.
You may need the check mark in the process of creating a task list or enumeration.
Inexperienced users create a sign by adding an image with the desired element to the document. This approach is incorrect, because it increases the final file size.
Everything can be done much easier. To check the box in Word, follow the next few steps.
- Open the document in any version of the program. Depending on the year the software was released, the location of the required tabs may differ;
- Click on the “Insert” section;
- On the right side of the toolbar, find the “Symbol” item and click on it;
- In the Drop-down window, click on "Other symbols".
- In the pop-up window, you can find a checkmark using one of two methods. Select the “Dingbats” set and click on the desired element in the proposed list or enter the element code in Unicode (hexadecimal) at the bottom of the window. For example, 2714. Word will automatically find the object you need. Click on it and confirm the action by clicking “OK”.
Fig. 3 - special characters in Word
After adding a checkmark to the body of the document, you can apply any formatting to it: change the color, font, heading type and other options.
Special characters are technical characters that are not represented on the keyboard and are encoded using UNICODE or another metalanguage. Special characters are divided into groups: mathematical, Greek alphabet, ISO 8859-1 and others. Why they are needed and how to use them, read further in the article.
Using special characters when writing documents
Use is for the following purposes:
- Giving the article completeness and aesthetics. Special signs help you quickly understand dimensional values or read a historical name in Latin or Greek.
- Some elements ensure the correct layout of the document. For example, “” and “” are different, the first ones are transmitted standard means, others through special characters.
- Layout of mathematical documents cannot do without knowledge of the main groups of elements.
Basic signs
The material will allow you to find special characters in the appropriate encoding for quick insertion into text.
Appearance | Designation | HTML code | CSS code |
☃ | Snowman | ☃ | \2603 |
☦ | Orthodox cross | ☦ | \2626 |
⚓ | Anchor | ⚓ | \2693 |
✆ | Phone sign | ✆ | \2706 |
☎ | Telephone | ☎ | \260E |
☕ | Hot drinks | ☕ | \2615 |
✎ | Pencil pointing downwards | ✎ | \270E |
✏ | Pencil | ✏ | \270F |
✐ | Pencil pointing upwards to the right | ✐ | \2710 |
✑ | Blank nib | ✑ | \2711 |
✒ | Filled pen nib | ✒ | \2712 |
⚜ | fleur-de-lis | ⚜ | \269C |
⛑ | Helmet with white cross | ⛑ | \26D1 |
⚝ | Drawn white star | ⚝ | \269D |
❄ | Snowflake | ❄ | \2744 |
❤ | Shaded bold heart | ❤ | \2764 |
❅ | Snowflake sandwiched by shamrocks | ❅ | \2745 |
❆ | Fat sharp-angled snowflake | ❆ | \2746 |
★ | Shaded star | ★ | \2605 |
☆ | Blank star | ☆ | \2606 |
✪ | Unfilled star in a filled circle | ✪ | \272A |
✫ | Filled star with an open circle inside | ✫ | \272B |
✯ | Rotating star | ✯ | \272F |
❉ | Star with spherical ends | ❉ | \2749 |
❋ | Bold eight-pointed drop-shaped star-propeller | ❋ | \274B |
✲ | Star with blank center | ✲ | \2732 |
☀ | Painted sun with rays | ☀ | \2600 |
☁ | Clouds | ☁ | \2601 |
☂ | Umbrella | ☂ | \2602 |
☑ | Checkmark in a square | ☑ | \2611 |
☒ | Cross in a square | ☒ | \2612 |
☹ | Frowning emoticon | ☹ | \2639 |
☺ | Smiling emoticon | ☺ | \263A |
☻ | Shaded smiling emoticon | ☻ | \263B |
☭ | Hammer and sickle | ☭ | \262D |
⚑ | Filled flag | ⚑ | \2691 |
⚐ | Blank flag | ⚐ | \2690 |
☰ | Trigram | ☰ | \2630 |
✿ | Painted flower | ✿ | \273f |
❀ | Blank flower | ❀ | \2740 |
✾ | Flower with six petals | ✾ | \273E |
❁ | Colored outlined flower | ❁ | \2741 |
❂ | Flower made of dots | ❂ | \2742 |
✉ | Envelope | ✉ | \2709 |
❦ | Heart in the form of a flower | ❦ | \2766 |
❶ | Number 1 | ❶ | \2776 |
❷ | Number 2 | ❷ | \2777 |
❸ | Number 3 | ❸ | \2778 |
❹ | Number 4 | ❹ | \2779 |
❺ | Number 5 | ❺ | \277A |
❻ | Number 6 | ❻ | \277B |
❼ | Number 7 | ❼ | \277C |
❽ | Number 8 | ❽ | \277D |
➒ | Number 9 | ➒ | \2792 |
➓ | Number 10 | ➓ | \2793 |
✖ | Bold multiplication sign | ✖ | \2716 |
✘ | Bold cross | ✘ | \2718 |
✔ | Bold check mark | ✔ | \2714 |
✚ | Fat cross | ✚ | \271A |
⚛ | Atom symbol | ⚛ | \269B |
♺ | Recycling symbol | ♺ | \267A |
❑ | Unfilled square with lower right shadow | ❑ | \2751 |
❒ | Unfilled square with top right shadow | ❒ | \2752 |
◈ | Diamond in a frame | ◈ | \25C8 |
◐ | Circle with left half filled in | ◐ | \25D0 |
◑ | Circle with the right half filled in | ◑ | \25D1 |
⁂ | Three stars | ⁂ | \2042 |
Punctuation marks
Appearance | Designation | HTML code | CSS code |
< | Less than sign (beginning of tag) | < | \003C |
> | Greater than sign (end of tag) | > | \003E |
« | Left double angle bracket | « | \00AB |
» | Right double angle bracket | » | \00BB |
‹ | Left corner single quote | ‹ | \2039 |
› | Right corner single quote | › | \203A |
« | Double quote | " | \0022 |
′ | Single stroke | ′ | \2032 |
″ | Double stroke | ″ | \2033 |
‘ | Left single quote | ‘ | \2018 |
’ | Right single quote | ’ | \2019 |
‚ | Bottom single quote | ‚ | \201A |
“ | Left double quote | “ | \201C |
” | Right double quote | ” | \201D |
„ | Bottom double quote | „ | \201E |
❜ | Bold single leading comma | ❜ | \275C |
❛ | Bold single rotated top comma | ❛ | \275B |
& | Ampersand | & | \0026 |
‘ | Apostrophe (single quote) | " | \0027 |
§ | Paragraph | § | \00A7 |
© | Copyright sign | \00A9 | |
¬ | Negation sign | ¬ | \00AC |
® | Registered trademark mark | ® | \00AE |
¯ | Macron | ¯ | \00AF |
° | Degree | ° | \00B0 |
± | Plus or minus | ± | \00B1 |
¹ | Superscript "1" | ¹ | \00B9 |
² | Superscript "2" | ² | \00B2 |
³ | Superscript "3" | ³ | \00B3 |
¼ | One quarter | ¼ | \00BC |
½ | One second | ½ | \00BD |
¾ | Three quarters | ¾ | \00BE |
´ | Accent mark | ´ | \00B4 |
µ | Micro | µ | \00B5 |
¶ | Paragraph mark | ¶ | \00B6 |
· | Multiplication sign | · | \00B7 |
¿ | Inverted question mark | ¿ | \00BF |
ƒ | Florin sign | ƒ | \0192 |
™ | Trademark sign | ™ | \2122 |
List marker | . | \2022 | |
… | Ellipsis | … | \2026 |
‾ | Overlining | ‾ | \203E |
– | Em dash | - | \2013 |
- | Em dash | — | \2014 |
‰ | ppm | ‰ | \2030 |
} | Right curly brace | } | \007D |
{ | Left curly brace | { | \007B |
= | Equal sign | = | \003D |
≠ | Inequality sign | ≠ | \2260 |
≅ | Congruence (geometric equality) | ≅ | \2245 |
≈ | Almost equal | ≈ | \2248 |
≤ | Less than or equal | ≤ | \2264 |
≥ | Greater than or equal | ≥ | \2265 |
∠ | Corner | ∠ | \2220 |
⊥ | Perpendicular (up button) | ⊥ | \22A5 |
√ | Square root | √ | \221A |
∑ | N-ary summation | ∑ | \2211 |
∫ | Integral | ∫ | \222B |
※ | Footnote sign | ※ | \203B |
÷ | Division sign | ÷ | \00F7 |
∞ | Infinity sign | ∞ | \221E |
@ | Dog symbol | @ | \0040 |
[ | Left square bracket | [ | \005B |
] | Right square bracket | ] | \005D |
Arrows
Appearance | Designation | HTML code | CSS code |
← | Left arrow | ← | \2190 |
Up arrow | \2191 | ||
→ | Right arrow | → | \2192 |
↓ | Down arrow | ↓ | \2193 |
↔ | Left-right arrow | ↔ | \2194 |
↵ | Down and left arrow – carriage return sign | ↵ | \21B5 |
⇐ | Double left arrow | ⇐ | \21D0 |
⇑ | Double up arrow | ⇑ | \21D1 |
⇒ | Double arrow to the right | ⇒ | \21D2 |
⇓ | Double down arrow | ⇓ | \21D3 |
⇔ | Double left-right arrow | ⇔ | \21D4 |
➠ | Flying arrow | ➠ | \27A0 |
➤ | Arrowhead | ➤ | \27A4 |
➥ | Curved arrow pointing down and to the right | ➥ | \27A5 |
➦ | Curved arrow pointing up and to the right | ➦ | \27A6 |
➳ | Arrow to the right | ➳ | \27B3 |
↺ | ↺ | \21BA | |
↻ | Round arrow with counterclockwise tip | ↻ | \21BB |
⇧ | Thick hollow up arrow | ⇧ | \21E7 |
↩ | Left arrow with hook | ↩ | \21A9 |
➫ | Downward sloping arrow | ➫ | \27AB |
⬇ | Filled down arrow | ⬇ | \2B07 |
⬆ | Filled up arrow | ⬆ | \2B06 |
Card suits, zodiac signs and currency icons
Appearance | Designation | HTML code | CSS code |
♠ | "Spades" | ♠ | \2660 |
♣ | "Clubs" | ♣ | \2663 |
"Hearts" | \2665 | ||
♦ | "Diamonds" | ♦ | \2666 |
♡ | Contour "Hearts" | ♡ | \2661 |
♢ | Contour "Tambourines" | ♢ | \2662 |
♤ | Peaks Contour | ♤ | \2664 |
♧ | Outline "Clubs" | ♧ | \2667 |
¢ | Cent | ¢ | \FFE0 |
£ | Pound sterling | £ | \FFE1 |
₽ | Russian ruble | ₽ | \20BD |
¥ | Yen or Yuan | ¥ | \00A5 |
€ | Euro | € | \20AC |
$ | Dollar | $ | \0024 |
₴ | Hryvnia sign | ₴ | \20B4 |
₹ | Indian Rupee | ₹ | \20B9 |
圓 | CNY | 圓 | \5713 |
₸ | Kazakhstani tenge | ₸ | \20B8 |
♈ | Aries | ♈ | \2648 |
♉ | Taurus | ♉ | \2649 |
♊ | Twins | ♊ | \264A |
♋ | Cancer | ♋ | \264B |
♌ | Lion | ♌ | \264C |
♍ | Virgo | ♍ | \264D |
♎ | Scales | ♎ | \264E |
♏ | Scorpion | ♏ | \264F |
♐ | Sagittarius | ♐ | \2650 |
♑ | Capricorn | ♑ | \2651 |
♒ | Aquarius | ♒ | \2652 |
♓ | Fish | ♓ | \2653 |
Greek alphabet
Letter | lowercase | capitals | ||
symbol | html code | symbol | html code | |
α | Α | |||
β | Β | |||
γ | Γ | |||
δ | Δ | |||
ε | Ε | |||
ζ | Ζ | |||
η | Η | |||
θ | Θ | |||
ι | Ι | |||
κ | Κ | |||
λ | Λ | |||
μ | Μ | |||
ν | Ν | |||
ξ | Ξ | |||
ο | Ο | |||
π | Π | |||
ρ | Ρ | |||
σ | Σ | |||
ς | ||||
τ | Τ | |||
υ | Υ | |||
φ | Φ | |||
χ | Χ | |||
ψ | Ψ | |||
ω | Ω |
How to use it in practice
Regardless of the CMS, adding an article is done using visual editor and HTML versions. All special characters in the encoding can only be inserted in the second case. To use the tools correctly, it is recommended to take note of the tables that show the code and external representation.
Please note that if you insert a sign in the visual representation of an article, the element will be converted into the corresponding code in HTML. When manually entering information, consider the case, which affects the final result.
Typewritten text consists of printed characters - graphic symbols.
Graphic symbols are symbols that have a visible display in the text.
All graphic symbols are collected in a set of a single universal Unicode system.
Insert graphic symbol Unicode to html document
- the main and only purpose for this table.
You can insert a symbol into an HTML document in one of the following ways:
- copy the symbol image from the browser window to the window of your visual html editor
- copy the html code of the symbol directly into the code of the html document
- insert visual into visual
- insert code into code.
The font for a symbol, its size and color in HTML can be set with code like:
CHARACTER_CODE
Where,
Arial - font,
10px - font size in pixels,
#ff0000 - font color code (red)
For example:
☎ - character font size 30px,
☎ - symbol font size 30px, color - red
☎ - character font size 20px,
☎ - symbol font size 10px.
Note Recommended fonts for inserting special characters are Arial, Verdana and Tahoma. These fonts display Unicode characters correctly and are themselves, in turn, correctly supported by web applications.
- "Symbol"
(visible symbol display)
From this column you can copy the symbol image and paste it into the window html text editor. The symbol will be copied with a font size of 20px. After copying is complete, it may be necessary to individually adjust the font size directly to the copied character. - "Name"
(only for important or unclear characters)
Explanation of the purpose of the symbol, its scope, examples... - "Mnemonics"
A mnemonics is an alphabetic construction of the form ", denoting the alphabetic code of a character in HTML. It is inserted directly into the html code of an html document. Mnemonics are very popular among professional layout designers. They are perfectly memorized by humans and are supported by all html applications. Each mnemonics contains an alphabetic name (designation ) of its symbol and a service sign (&), which serves as a signal for the browser to read the code and is not displayed on the monitor screen. The name of each mnemonic is unique and easy to read, because it is derived from the English word that characterizes the symbol.Mnemonics (Greek) - the art of remembering something. Mnemonics are used to facilitate the perception of difficult-to-memorize information when the object of memorization is brought into an associative state with something.
- "Code"
Code - the numeric decimal code of a character in HTML, like &. Inserted directly into the html code of an html document. The numeric decimal code consists of a number indicating serial number character in the Unicode system and several service characters (& and #), which serve as a signal for the browser to read the code and are not displayed on the monitor screen. The decimal code is widely used and used due to its versatility and ease of perception.
Control characters in HTML (XHTML)
Control characters in HTML (XHTML) are service characters of the HTML language that are used in the HTML layout of a web page. Any browser must support these characters, since without them it is impossible correct display HTML text. Control characters are not displayed in the text and, when entered directly from the keyboard, are interpreted by the browser as punctuation marks calling for some action to be performed when the page is drawn on the screen.
It is allowed to use control characters in ordinary texts, where they symbolize universal concepts and are interpreted by the browser as ordinary typographical characters. When using service symbols in HTML texts in this way, it is not the value of the symbol itself that needs to be entered, but its HTML code. Because, I repeat, otherwise the browser will perceive the service symbol as a call to action and will not correctly display the HTML text on the monitor screen.
Control characters and their HTML code are known and understood by all browsers without exception, which cannot be said, alas, about other characters that may be displayed incorrectly in different browsers or, even worse, not be displayed at all.
Syntax and punctuation
space of length N (regular space) | |||||
space of length M (longspace) | |||||
- | soft hyphen (unprintable character) | - | | ||
‑ | hyphen | ‑ |
|||
---|---|---|---|---|---|
- | dash of length N (regular dash) | - | – | ||
— | dash of length M (em dash) | — | — | ||
. | dot | . | |||
, | comma | , | |||
… | ellipses | … |
… |
||
: | colon | : | |||
; | semicolon | ; | |||
! | exclamation mark | ! ǃ |
|||
? | question mark | ? | |||
@ | "dog" | @ | |||
* | "star" | * | |||
# | "lattice" | # | |||
‘ | single upper left quote | ‘ | ‘ |
||
’ | single upper right quote | ’ | ’ |
||
‚ | single lower right quote | ‚ | ‚ |
||
“ | double top left quote | “ | “ |
||
” | double upper right quote | ” | ” |
||
„ | double lower right quote | &bdquo | „ |
||
« | double left corner quotation mark (Rus) | « | « | ||
» | double right corner quotation mark (Rus) | » | » | ||
́ | accent mark, example: Vasya | ́ | |||
" | apostrophe, example: You"I | " | |||
´ | acute, example: Vasya | ´ | ´ | ||
¶ | paragraph (unprintable character) | ¶ | ¶ | ||
§ | paragraph | § | § | ||
ˆ | accent (inverted bird) | ˆ | ˆ |
||
˜ | small tilde | ˜ | ˜ |
||
¦ | vertical dotted line | ¦ | ¦ | ||
( | left parenthesis | ( | |||
) | right parenthesis | ) | |||
〈 | left angle bracket | 〈 | 〈 | ||
〉 | right angle bracket | 〉 | 〉 | ||
‹ | left angle bracket, option | ‹ | ‹ | ||
› | right angle bracket, option | › | › | ||
[ | square bracket left | [ | |||
] | square bracket right | ] | |||
/ | slash - slash character | / | |||
\ | backslash | \ | |||
⁄ | slash (division sign) | ⁄ | ⁄ | ||
ǀ | vertical bar | ǀ | |||
ǁ | double vertical bar | ǁ | |||
‾ | overlining, example: Vasya‾vasya | ‾ | ‾ | ||
¯ | macron, example: Vasya¯vasya | ¯ | ¯ |
Trademarks and currency
+ | plus | + | + | ||
---|---|---|---|---|---|
− | minus | − | - − |
||
= | equals | = | |||
± | plus or minus | ± | ± | ||
× | multiplication sign | × | × | ||
÷ | division sign | ÷ | ÷ | ||
⋅ | dot operator (middle of line) | ⋅ | · ⋅ |
||
∗ | asterisk operator (middle of line) | ∗ | ∗ | ||
∼ | tilde operator | ∼ | ∼ | ||
. | list marker (middle of line) | . | |
||
¹ | superscript "1" | ¹ | ¹ | ||
² | superscript "2" | ² | ² | ||
³ | superscript "3" | ³ | ³ | ||
Superscript and subscript in HTML (XHTML) can be inserted using tags And , respectively: NUMBER Superscript→ NUMBER Superscript NUMBER Subscript→ NUMBER Subscript |
|||||
½ | fraction "one half" | ½ | ½ | ||
⅓ | fraction "one third" | ⅓ | |||
¼ | fraction "one-fourth" | ¼ | ¼ | ||
¾ | fraction "three quarters" | ¾ | ¾ | ||
№ | number sign | № | |||
% | percent | % | |||
‰ | ppm | ‰ | ‰ |
||
° | degrees | ° | ° | ||
′ | prime (minutes, feet) | ′ | ′ | ||
″ | double prime (seconds, inches) Example 1: 30° 25′ 12″ Example 2: 25′ 12 ″ |
″ | ″ | ||
µ | micro | µ | µ | ||
π | Pi | π | π | ||
ƒ | function sign (not to be confused with "integral") |
ƒ | ƒ |
||
∫ | integral | ∫ | ∫ | ||
∅ | crossed zero, empty set (not to be confused with "diameter") |
∅ | ∅ | ||
⌀ | diameter (not to be confused with the crossed out Latin “o”) | ⌀ | |||
ø | Latin "o" diagonally crossed out | ø | ø | ||
Ø | Latin capital "O" diagonally crossed out | Ø | Ø | ||
∏ | work mark | ∏ | ∏ | ||
∑ | summation sign | ∑ | ∑ | ||
√ | radical (square root or x root) |
√ | √ | ||
∝ | proportionally | ∝ | ∝ | ||
∞ | infinity | ∞ | ∞ | ||
∠ | corner | ∠ | ∠ | ||
⊥ | orthogonal (perpendicular) | ⊥ | ⊥ | ||
∴ | sign "therefore" | ∴ | ∴ | ||
≅ | approximately equal | ≅ | ≅ | ||
≈ | almost equal | ≈ | ≈ | ||
≠ | not equal | ≠ | ≠ | ||
≡ | identically | ≡ | ≡ | ||
≤ | less than or equal to | ≤ | ≤ | ||
≥ | greater than or equal to | ≥ | ≥ | ||
∧ | logical AND | ∧ | ∧ | ||
∨ | logical OR | ∨ | ∨ | ||
⊕ | plus sign in a circle (direct amount) |
⊕ | ⊕ | ||
⊗ | multiplication sign in a circle (cross product, arrow from observer) |
⊗ | ⊗ | ||
ʘ | dot in a circle (arrow to observer) |
ʘ |
✵ ✵ |
|||||
HTML special characters are special language constructs that refer to characters from the character set used in text files. The table shows a list of reserved and special characters that cannot be added to the source code of an HTML document using the keyboard:
- characters that cannot be entered using the keyboard (for example, a copyright symbol)
- characters intended for marking (for example, a greater than or less than sign)
Such characters are added using a numeric code or name.
Symbol | Numeric code | Symbol name | Description |
---|---|---|---|
" | " | " | quotation mark |
" | " | " | apostrophe |
& | & | & | ampersand |
< | < | less than sign | |
> | > | > | more sign |
non-breaking space (A non-breaking space is a space that appears inside a line as a regular space, but does not allow display and printing programs to break the line at that point.) | |||
¡ | ¡ | ¡ | inverted exclamation mark |
¢ | ¢ | ¢ | cent |
£ | £ | £ | lb. |
¤ | ¤ | ¤ | currencies |
¥ | ¥ | ¥ | yen |
¦ | ¦ | ¦ | broken vertical bar |
§ | § | § | section |
¨ | ¨ | ¨ | interval (Cyrillic) |
© | copyright sign | ||
ª | ª | ª | female ordinal exponent |
« | « | « | French quotes (herringbone) - left |
¬ | ¬ | ¬ | negation-expressions |
® | ® | ® | registered trademark |
¯ | ¯ | ¯ | macron interval |
° | ° | ° | degree |
± | ± | ± | plus or minus |
² | ² | ² | superscript 2 |
³ | ³ | ³ | superscript 3 |
´ | ´ | ´ | acute interval |
µ | µ | µ | micro |
¶ | ¶ | ¶ | paragraph |
· | · | · | midpoint |
¸ | ¸ | ¸ | cedilla interval |
¹ | ¹ | ¹ | superscript 1 |
º | º | º | male ordinal exponent |
» | » | » | French quotes (herringbone) - right |
¼ | ¼ | ¼ | 1/4 part |
½ | ½ | ½ | 1/2 part |
¾ | ¾ | ¾ | 3/4 parts |
¿ | ¿ | ¿ | inverted question mark |
× | × | × | multiplication |
÷ | ÷ | ÷ | division |
́ | ́ | emphasis | |
Œ | Œ | Œ | capital ligature OE |
œ | œ | œ | lowercase ligature oe |
Š | Š | Š | S with crown |
š | š | š | lowercase S with crown |
Ÿ | Ÿ | Ÿ | capital Y with tiara |
ƒ | ƒ | ƒ | f with hook |
ˆ | ˆ | ˆ | dicriatic accent |
˜ | ˜ | ˜ | small tilde |
– | – | - | dash |
— | — | — | em dash |
‘ | ‘ | ‘ | left single quote |
’ | ’ | ’ | right single quote |
‚ | ‚ | ‚ | bottom single quote |
“ | “ | “ | left double quotes |
” | ” | ” | right double quotes |
„ | „ | „ | lower double quotes |
† | † | † | dagger |
‡ | ‡ | ‡ | double dagger |
. | bullet | ||
… | … | … | horizontal ellipsis |
‰ | ‰ | ‰ | ppm (thousandths) |
′ | ′ | ′ | minutes |
″ | ″ | ″ | seconds |
‹ | ‹ | ‹ | single left corner quote |
› | › | › | single right corner quote |
‾ | ‾ | ‾ | overlining |
€ | € | € | Euro |
™ | ™ or | ™ | trademark |
← | ← | ← | left arrow |
up arrow | |||
→ | → | → | right arrow |
↓ | ↓ | ↓ | down arrow |
↔ | ↔ | ↔ | double arrow |
↵ | ↵ | ↵ | carriage return arrow |
⌈ | ⌈ | ⌈ | upper left corner |
⌉ | ⌉ | ⌉ | upper right corner |
⌊ | ⌊ | ⌊ | lower left corner |
⌋ | ⌋ | ⌋ | lower right corner |
◊ | ◊ | ◊ | rhombus |
♠ | ♠ | ♠ | peaks |
♣ | ♣ | ♣ | cross |
worms | |||
♦ | ♦ | ♦ | diamonds |
Mathematical symbols supported in HTML
Symbol | Numeric code | Symbol name | Description |
---|---|---|---|
∀ | ∀ | ∀ | for anyone, for everyone |
∂ | ∂ | ∂ | Part |
∃ | ∃ | ∃ | exists |
∅ | ∅ | ∅ | empty set |
∇ | ∇ | ∇ | Hamilton operator (nabla) |
∈ | ∈ | ∈ | belongs to the set |
∉ | ∉ | ∉ | does not belong to the set |
∋ | ∋ | ∋ | or |
∏ | ∏ | ∏ | work |
∑ | ∑ | ∑ | sum |
− | − | − | minus |
∗ | ∗ | ∗ | multiplication or operator conjugate to |
× | × | × | multiplication sign |
√ | √ | √ | square root |
∝ | ∝ | ∝ | proportionality |
∞ | ∞ | ∞ | infinity |
⋮ | ⋮ | multiplicity | |
∠ | ∠ | ∠ | corner |
∧ | ∧ | ∧ | And |
∨ | ∨ | ∨ | or |
∩ | ∩ | ∩ | intersection |
∪ | ∪ | ∪ | association |
∫ | ∫ | ∫ | integral |
∴ | ∴ | ∴ | That's why |
∼ | ∼ | ∼ | like |
≅ | ≅ | ≅ | comparable |
≈ | ≈ | ≈ | approximately equal |
≠ | ≠ | ≠ | not equal |
≡ | ≡ | ≡ | identically |
≤ | ≤ | ≤ | less than or equal to |
⩽ | ⩽ ⩽ |
⩽ ⩽ |
less than or equal to |
≥ | ≥ | ≥ | greater than or equal to |
⩾ | ⩾ ⩾ |
⩾ ⩾ |
greater than or equal to |
⊂ | ⊂ | ⊂ | subset |
⊃ | ⊃ | ⊃ | supersets |
⊄ | ⊄ | ⊄ | not a subset |
⊆ | ⊆ | ⊆ | subset |
⊇ | ⊇ | ⊇ | superset |
⊕ | ⊕ | ⊕ | direct amount |
⊗ | ⊗ | ⊗ | tenser product |
⊥ | ⊥ | ⊥ | perpendicular |
⋅ | ⋅ | ⋅ | dot operator |
Greek and Coptic alphabets
Symbol | Numeric code | Hex code | Symbol name |
---|---|---|---|
Ͱ | Ͱ | Ͱ | |
ͱ | ͱ | ͱ | |
Ͳ | Ͳ | Ͳ | |
ͳ | ͳ | ͳ | |
ʹ | ʹ | ʹ | |
͵ | ͵ | ͵ | |
Ͷ | Ͷ | Ͷ | |
ͷ | ͷ | ͷ | |
ͺ | ͺ | ͺ | |
ͻ | ͻ | ͻ | |
ͼ | ͼ | ͼ | |
ͽ | ͽ | ͽ | |
; | ; | ; | |
΄ | ΄ | ΄ | |
΅ | ΅ | ΅ | |
Ά | Ά | Ά | |
· | · | · | |
Έ | Έ | Έ | |
Ή | Ή | Ή | |
Ί | Ί | Ί | |
Ό | Ό | Ό | |
Ύ | Ύ | Ύ | |
Ώ | Ώ | Ώ | |
ΐ | ΐ | ΐ | |
Α | Α | Α | Α |
Β | Β | Β | Β |
Γ | Γ | Γ | Γ |
Δ | Δ | Δ | Δ |
Ε | Ε | Ε | Ε |
Ζ | Ζ | Ζ | Ζ |
Η | Η | Η | Η |
Θ | Θ | Θ | Θ |
Ι | Ι | Ι | Ι |
Κ | Κ | Κ | Κ |
Λ | Λ | Λ | Λ |
Μ | Μ | Μ | Μ |
Ν | Ν | Ν | Ν |
Ξ | Ξ | Ξ | Ξ |
Ο | Ο | Ο | Ο |
Π | Π | Π | Π |
Ρ | Ρ | Ρ | Ρ |
Σ | Σ | Σ | Σ |
Τ | Τ | Τ | Τ |
Υ | Υ | Υ | Υ |
Φ | Φ | Φ | Φ |
Χ | Χ | Χ | Χ |
Ψ | Ψ | Ψ | Ψ |
Ω | Ω | Ω | Ω |
Ϊ | Ϊ | Ϊ | |
Ϋ | Ϋ | Ϋ | |
ά | ά | ά | |
έ | έ | έ | |
ή | ή | ή | |
ί | ί | ί | |
ΰ | ΰ | ΰ | |
α | α | α | α |
β | β | β | β |
γ | γ | γ | γ |
δ | δ | δ | δ |
ε | ε | ε | ε |
ζ | ζ | ζ | ζ |
η | η | η | η |
θ | θ | θ | θ |
ι | ι | ι | ι |
κ | κ | κ | κ |
λ | λ | λ | λ |
μ | μ | μ | μ |
ν | ν | ν | ν |
ξ | ξ | ξ | ξ |
ο | ο | ο | ο |
π | π | π | π |
ρ | ρ | ρ | ρ |
ς | ς | ς | ς |
σ | σ | σ | σ |
τ | τ | τ | τ |
υ | υ | υ | υ |
φ | φ | φ | φ |
χ | χ | χ | χ |
ψ | ψ | ψ | ψ |
ω | ω | ω | ω |
ϊ | ϊ | ϊ | |
ϋ | ϋ | ϋ | |
ό | ό | ό | |
ύ | ύ | ύ | |
ώ | ώ | ώ | |
Ϗ | Ϗ | Ϗ | |
ϐ | ϐ | ϐ | |
ϑ | ϑ | ϑ | ϑ |
ϒ | ϒ | ϒ | ϒ |
ϓ | ϓ | ϓ | |
ϔ | ϔ | ϔ | |
ϕ | ϕ | ϕ | ϕ |
ϖ | ϖ | ϖ | ϖ |
ϗ | ϗ | ϗ | |
Ϙ | Ϙ | Ϙ | |
ϙ | ϙ | ϙ | |
Ϛ | Ϛ | Ϛ | |
ϛ | ϛ | ϛ | |
Ϝ | Ϝ | Ϝ | Ϝ |
ϝ | ϝ | ϝ | ϝ |
Ϟ | Ϟ | Ϟ | |
ϟ | ϟ | ϟ | |
Ϡ | Ϡ | Ϡ | |
ϡ | ϡ | ϡ | |
Ϣ | Ϣ | Ϣ | |
ϣ | ϣ | ϣ | |
Ϥ | Ϥ | Ϥ | |
ϥ | ϥ | ϥ | |
Ϧ | Ϧ | Ϧ | |
ϧ | ϧ | ϧ | |
Ϩ | Ϩ | Ϩ | |
ϩ | ϩ | ϩ | |
Ϫ | Ϫ | Ϫ | |
ϫ | ϫ | ϫ | |
Ϭ | Ϭ | Ϭ | |
ϭ | ϭ | ϭ | |
Ϯ | Ϯ | Ϯ | |
ϯ | ϯ | ϯ | |
ϰ | ϰ | ϰ | ϰ |
ϱ | ϱ | ϱ | ϱ |
ϲ | ϲ | ϲ | |
ϳ | ϳ | ϳ | |
ϴ | ϴ | ϴ | |
ϵ | ϵ | ϵ | ϵ |
϶ | ϶ | ϶ | ϶ |
Ϸ | Ϸ | Ϸ | |
ϸ | ϸ | ϸ | |
Ϲ | Ϲ | Ϲ | |
Ϻ | Ϻ | Ϻ | |
ϻ | ϻ | ϻ | |
ϼ | ϼ | ϼ | |
Ͻ | Ͻ | Ͻ | |
Ͼ | Ͼ | Ͼ | |
Ͽ | Ͽ | Ͽ |
Why are special characters needed and how to use them
Let's say you decide to describe some tag on your page, but since the browser uses characters< и >like the start and end of a tag, applying them inside the content of your html code can lead to problems. But HTML gives you an easy way to define these and other special characters using simple abbreviations called references to symbols.
Let's look at how this works. For each character that is considered special or that you want to use on your web page but that cannot be printed in your editor (such as the copyright symbol), you find the abbreviation and print it in the html code instead of the desired character. For example, for the symbol ">" the abbreviation is > , and for the symbol "<" - < .
Let's say you wanted to print "Element very important" on his page. Instead, you will have to use references to the symbols you need to display the entry correctly, and in the end your entry in the code should look like this:
Element very important
Try »Another special character you need to know about is the & (ampersand) symbol. If you want it to appear on your HTML page, use the & link instead of the & character.