Home Web Front-end H5 Tutorial Summary of mobile meta lines

Summary of mobile meta lines

Jun 27, 2017 am 10:04 AM
meta Encyclopedia move

<span class="xml"><span class="hljs-tag"><span style="font-size: 16px"><</span><span class="hljs-name"><span style="font-size: 16px">meta </span><span class="hljs-attr"><span style="font-size: 16px">name=</span><span class="hljs-string"><span style="font-size: 16px">"viewport" <br/></span><span class="hljs-attr"><span style="font-size: 16px">content=</span><span class="hljs-string"><span style="font-size: 16px">"width=device-width, initial-scale=1, user-scalable=no, minimal-ui" /></span> </span></span></span></span></span></span></span>
Copy after login

 
width: width of the viewport (range from 200 to 10,000, default is 980 pixels)

height: height of the viewport (range from 223 to 10,000)

initial-scale: initial scaling (range from >0 to 10)

minimum-scale: The minimum scale the user is allowed to zoom to

maximum-scale: The maximum scale the user is allowed to zoom to

user-scalable: Whether the user can manually zoom

<meta name="apple-mobile-web-app-capable" content="yes" />

<meta name="renderer" content="webkit">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="HandheldFriendly" content="true">

<meta name="Mo bileOptimized" content="320">

<meta name="screen-orientation" content=" portrait">

-- QQ forces vertical screen -->

<meta name="x5- orientation" content="portrait">

<meta name="full-screen" content="yes">

<meta name="x5-fullscreen" content="true">

<meta name="browsermode " content="application">

<meta name="x5-page-mode" content="app">

<meta name="msapplication-tap-highlight" content="no">

1. apple-touch-icon
< link rel= "apple-touch-icon" sizes= "76x76" href= "touch-icon-ipad.png">
如果 apple-mobile-web-app-capable 设置为 yes 了,

那么在苹果机的safari上可以通过添加到主屏按钮将网站添加到主屏幕上。

而设置相应 apple-touch-icon 标签,则添加到主屏上的图标就会使用我们指定的图片。

2. apple-touch-startup-image
< link rel= "apple-touch-startup-image" href= "/startup.png">
基于 apple-mobile-web-app-capable 设置为 yes ,

可以为WebApp设置一个类似NativeApp的启动画面。

和 apple-touch-icon 不同,

apple-mobile-web-app-capable 不支持sizes属性,

要使用media来加载不同的启动画面。

// iPhone
<link href="apple-touch-startup-image-320x460.png" media="(device-width: 320px)" rel="apple-touch-startup-image" />
Copy after login

<span class="hljs-comment">// iPhone Retina
<link href=<span class="hljs-string">"apple-touch-startup-image-640x920.png" media=<span class="hljs-string">"(device-width: 320px) and (-webkit-device-pixel-ratio: 2)"<br/> rel=<span class="hljs-string">"apple-touch-startup-image" /></span></span></span></span>
Copy after login

 

The above is the detailed content of Summary of mobile meta lines. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Can the appdata folder be moved to the D drive? Can the appdata folder be moved to the D drive? Feb 18, 2024 pm 01:20 PM

Can the appdata folder be moved to the D drive? With the increasing popularity of computer use, more and more users' personal data and applications are stored on the computer. In Windows operating system, there is a specific folder called appdata folder, which is used to store user's application data. Many users wonder whether this folder can be moved to the D drive or other disks for data management and security considerations. In this article, we will discuss this problem and provide some solutions. First, let me

6000 mAh silicon negative battery! Xiaomi 15Pro upgrade leaked again 6000 mAh silicon negative battery! Xiaomi 15Pro upgrade leaked again Jul 24, 2024 pm 12:45 PM

According to news on July 23, blogger Digital Chat Station broke the news that the battery capacity of Xiaomi 15 Pro has been increased to 6000mAh and supports 90W wired flash charging. This will be the Pro model with the largest battery in Xiaomi’s digital series. Digital Chat Station previously revealed that the battery of Xiaomi 15Pro has ultra-high energy density and the silicon content is much higher than that of competing products. After silicon-based batteries are tested on a large scale in 2023, second-generation silicon anode batteries have been identified as the future development direction of the industry. This year will usher in the peak of direct competition. 1. The theoretical gram capacity of silicon can reach 4200mAh/g, which is more than 10 times the gram capacity of graphite (the theoretical gram capacity of graphite is 372mAh/g). For the negative electrode, the capacity when the lithium ion insertion amount reaches the maximum is the theoretical gram capacity, which means that under the same weight

Stop or allow this PC to access your mobile device on Windows 11 Stop or allow this PC to access your mobile device on Windows 11 Feb 19, 2024 am 11:45 AM

Microsoft changed the name of PhoneLink to MobileDevice in the latest Windows 11 version. This change allows users to control computer access to mobile devices through prompts. This article explains how to manage settings on your computer that allow or deny access from mobile devices. This feature allows you to configure your mobile device and connect it to your computer to send and receive text messages, control mobile applications, view contacts, make phone calls, view galleries, and more. Is it a good idea to connect your phone to your PC? Connecting your phone to your Windows PC is a convenient option, making it easy to transfer functions and media. This is useful for those who need to use their computer when their mobile device is unavailable

New affordable Meta Quest 3S VR headset appears on FCC, suggesting imminent launch New affordable Meta Quest 3S VR headset appears on FCC, suggesting imminent launch Sep 04, 2024 am 06:51 AM

The Meta Connect 2024event is set for September 25 to 26, and in this event, the company is expected to unveil a new affordable virtual reality headset. Rumored to be the Meta Quest 3S, the VR headset has seemingly appeared on FCC listing. This sugge

The first open source model to surpass GPT4o level! Llama 3.1 leaked: 405 billion parameters, download links and model cards are available The first open source model to surpass GPT4o level! Llama 3.1 leaked: 405 billion parameters, download links and model cards are available Jul 23, 2024 pm 08:51 PM

Get your GPU ready! Llama3.1 finally appeared, but the source is not Meta official. Today, the leaked news of the new Llama large model went viral on Reddit. In addition to the basic model, it also includes benchmark results of 8B, 70B and the maximum parameter of 405B. The figure below shows the comparison results of each version of Llama3.1 with OpenAIGPT-4o and Llama38B/70B. It can be seen that even the 70B version exceeds GPT-4o on multiple benchmarks. Image source: https://x.com/mattshumer_/status/1815444612414087294 Obviously, version 3.1 of 8B and 70

Six quick ways to experience the newly released Llama 3! Six quick ways to experience the newly released Llama 3! Apr 19, 2024 pm 12:16 PM

Last night Meta released the Llama38B and 70B models. The Llama3 instruction-tuned model is fine-tuned and optimized for dialogue/chat use cases and outperforms many existing open source chat models in common benchmarks. For example, Gemma7B and Mistral7B. The Llama+3 model improves data and scale and reaches new heights. It was trained on more than 15T tokens of data on two custom 24K GPU clusters recently released by Meta. This training dataset is 7 times larger than Llama2 and contains 4 times more code. This brings the capability of the Llama model to the current highest level, which supports text lengths of more than 8K, twice that of Llama2. under

The strongest model Llama 3.1 405B is officially released, Zuckerberg: Open source leads a new era The strongest model Llama 3.1 405B is officially released, Zuckerberg: Open source leads a new era Jul 24, 2024 pm 08:23 PM

Just now, the long-awaited Llama 3.1 has been officially released! Meta officially issued a voice that "open source leads a new era." In the official blog, Meta said: "Until today, open source large language models have mostly lagged behind closed models in terms of functionality and performance. Now, we are ushering in a new era led by open source. We publicly released MetaLlama3.1405B, which we believe It is the largest and most powerful open source basic model in the world. To date, the total downloads of all Llama versions have exceeded 300 million times, and we have just begun.” Meta founder and CEO Zuckerberg also wrote an article. Long article "OpenSourceAIIsthePathForward",

Llama3 comes suddenly! The open source community is boiling again: the era of free access to GPT4-level models has arrived Llama3 comes suddenly! The open source community is boiling again: the era of free access to GPT4-level models has arrived Apr 19, 2024 pm 12:43 PM

Llama3 is here! Just now, Meta’s official website was updated and the official announced Llama 38 billion and 70 billion parameter versions. And it is an open source SOTA after its launch: Meta official data shows that the Llama38B and 70B versions surpass all opponents in their respective parameter scales. The 8B model outperforms Gemma7B and Mistral7BInstruct on many benchmarks such as MMLU, GPQA, and HumanEval. The 70B model has surpassed the popular closed-source fried chicken Claude3Sonnet, and has gone back and forth with Google's GeminiPro1.5. As soon as the Huggingface link came out, the open source community became excited again. The sharp-eyed blind students also discovered immediately

See all articles