The
element provides meta-information about the page, such as description and keywords for search engines and update frequency. This article mainly introduces to you the detailed explanation of meta tags and usage in HTML. Friends who are interested should take a look at it. I hope it can help you.
meta tag in Html
1. Meaning of meta tag
The element can provide meta-information about the page, such as for search engines and Description and keywords for update frequency.
The tag is located at the head of the document and does not contain any content.
The attribute of the tag defines the name/value pairs associated with the document.
2. Commonly used attributes in meta
1. charset (character set)
Description: Specifies the character encoding of HTML documents.
Usage:
2. viewport
Description: It is the visible area of the user's web page. As we all know, mobile device screens are generally much smaller than PCs. WebKit browsers will map a larger "virtual" window to the mobile device screen. The default virtual window is 980 pixels wide (the current standard for most websites). width) and then scale according to a certain ratio (3:1 or 2:1).
That is to say, when we load an ordinary web page, webkit will first load the web page with the browser standard of 980 pixels, and then reduce it to a width of 490 pixels. Note that this reduction is a global reduction, that is, all elements on the page will be reduced.
Usage:
<meta id="viewport" name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1; user-scalable=no;">
(1) width
width controls the size of the viewport, generally set to device-width
for adaptive purposes (2) initial -scale
Initial-scale: The initial scaling ratio, that is, the scaling ratio when the page is loaded for the first time.
(3) maximum-scale
Maximum-scale Maximum zoom. That is, the maximum zoom allowed. This is also a floating point value indicating the maximum multiplier of the page size compared to the screen size.
(4) minimum-scale
minimum-scale: The minimum ratio to which the user is allowed to zoom. Similar to maximum-scale usage.
(5) user-scalable
user-scalable User-adjustable scaling. That is, whether the user can change the zoom level of the page. If set to yes, the user is allowed to change it, otherwise it is no.
3. keywords (keywords)
Description: A list of keywords provided for search engines. Separate each keyword with an English comma ",". Specify keywords that search engines use to improve search quality.
Usage:
4. description ( Description, introduction)
Description: Description is used to tell search engines the main content of your website.
Usage:
5. format-detection (format detection)
Explanation: format-detection is used to detect some formats in html.
Usage: The format-detection attribute of meta mainly has the following settings:
meta name="format-detection" content="telephone=no" meta name="format-detection" content="email=no" meta name="format-detection" content="adress=no"
It can also be written consecutively: meta name="format-detection" content="telephone= no,email=no,adress=no"
Telephone=yes turns on the conversion of numbers into dial-up links. To turn on the conversion function, there is no need to write this meta. It is turned on by default!
#
## 2) Email Tell the device not to recognize the email address, and not automatically send it after clicking it
Email=no is prohibited as an email address!
adress=no prohibits jumping to the map!
Description: The function is to delete the default Apple toolbar and menu bar. content has two values "yes" and "no". When we need to display the toolbar and menu bar, there is no need to add this line of meta. The default is to display it.
Usage:
8. App-Config
Description ：Retain history records and animation effects
Usage:
9 . msapplication-tap-highlight
Description: Click without highlight (highlight)
Usage:
Related recommendations:
How to implement the viewport in the meta tag to control the css attributes of the device screen
Introduction to common uses of HTML meta tags
The above is the detailed content of Detailed explanation of meta tags and usage in html. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
