HTML meta使用

HTML meta使用

meta標簽是什么?

meta標簽是HTML語言head區的一個輔助性標簽。

meta標簽是干什么用的?

meta標簽用來描述一個HTML網頁文檔的屬性,例如作者日期和時間網頁描述關鍵詞頁面刷新等。它提供的信息雖然用戶不可見,但卻是文檔的最基本的 元數據

常用應用

1.標注作者

<meta name="author"content="網站域名"/>

meta標簽在head標簽內。

2.在瀏覽器中頁面將以原始大小顯示,并不允許縮放

在使用手機瀏覽網頁的時候,我們可以發現,瀏覽器會自動將頁面等比例縮小的屏幕適配的頁面,同時我們可以通過手指來縮放頁面。但當我們制作移動端頁面時,這個功能很顯然已經失去意義。所以使用這個標簽可以禁止縮放。

<meta name="viewport"content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
  • width:viewport的寬度(范圍從200到10,000,默認為980像素)
  • height:viewport的高度(范圍從223到10,000)
  • initial-scale:初始的縮放比例(范圍從>0到10)
  • minimum-scale:允許用戶縮放到的最小比例
  • maximum-scale:允許用戶縮放到的最大比例
  • user-scalable:用戶是否可以手動縮放

此作用針對手機端。

3.在瀏覽器中頁面中出現的手機號碼將不以撥號的超鏈接的形式出現

當你寫了一串數字怎么就變成超鏈接了,點擊還能撥打電話呢。因為iPhone會自動把你這個文字加鏈接樣式,通過使用這個標簽可以取消這一功能。默認是開啟狀態。

<meta name="format-detection"content="telephone=no"/>

4.不識別頁面中出現的郵箱

遇上一條同理,告訴設備不識別郵箱,點擊之后不自動發送。

<meta name="format-detection" content="email=no"/>

可以聯合使用:

<meta name="format-detection"content="telephone=no, email=no" />

5.是否啟用 WebApp 全屏模式,刪除蘋果默認的工具欄和菜單欄

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

6.設置蘋果工具欄顏色

apple-mobile-web-app-status-bar-stylecontent默認值為default(白色),可以定為black(黑色)和black-translucent(灰色半透明)。

<meta name="apple-mobile-web-app-status-bar-style" content="black" />

注意:若值為“black-translucent”將會占據頁面px位置,浮在頁面上方(會覆蓋頁面20px高度–iphone4和itouch4的Retina屏幕為40px)

7.如果把一個web app添加到了主屏幕中,那么從主屏幕中打開這個web app則全屏顯示

<meta name="apple-touch-fullscreen" content="yes" />

8.可隱藏地址欄,僅針對IOS的Safari

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

注:IOS7.0版本以后,safari上已看不到效果

9.啟用360瀏覽器的極速模式(webkit)

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

10.UC強制全屏

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

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/536059.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/536059.shtml
英文地址,請注明出處:http://en.pswp.cn/news/536059.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

共享圖片方案

共享圖片方案 安裝chrome插件 極簡圖床安裝&#xff0c;鏈接地址 插件使用 使用阿里云 OSS 存儲圖片 阿里云 OSS 提供了安全、低成本、高可靠的云存儲服務&#xff0c;極簡圖床針對阿里云 OSS 做了整合&#xff0c;通過簡單的設置&#xff0c;即可方便地將圖片上傳到阿里…

javascript復制到黏貼板之完美兼容

javascript復制到黏貼板之完美兼容 很多時候我們需要給用戶方便,提供一鍵復制的功能,但是在實現的過程中遇到各式各樣的坑。 原生解決方案 document.execCommand()方法 MDN上的定義&#xff1a; which allows one to run commands to manipulate the contents of the edita…

制作windows啟動盤-大于4GB鏡像

制作windows啟動盤-大于4GB鏡像 制作一個 Windows 安裝 U 盤是很容易的&#xff0c;使用 UltraISO 這樣的刻錄工具量產一個 iso 鏡像文件到 U 盤即可。然而隨著 Windows 10 版本號的提升&#xff0c;鏡像變得越來越大&#xff0c;終于 FAT32 文件系統不再能夠容納得下安裝鏡像…

DIY 主機 所有AMD IntelCPU及主板

DIY 主機 所有AMD IntelCPU及主板 查看intel的cpu及amd的cpu或者對應的主板可以查看這個項目。diy-pc

PC介紹之電腦組成

電腦組成 CPU cpu就是中央處理器&#xff0c;英文為central processing unit。 CPU一般我們需要知道以下幾點即可&#xff1a; 主頻 CPU的主頻&#xff0c;即CPU內核工作的時鐘頻率&#xff08;CPU Clock Speed&#xff09;&#xff0c;通常所說的某某CPU是多少兆赫的&#xff…

PC介紹之PCIE、總線、內存、電源

PC介紹之PCIE、總線、內存、電源 PCIE降速 PCI-E的總線性能 目前我們所使用的顯卡是x16 走 PCIE 3.0,有些顯卡雖然插在x16的插槽上&#xff0c;但是速度只有x8的速度&#xff0c;總的來說好的顯卡目前都是x16。 主板一般會提供一條x16&#xff0c;x8, x1三個插槽&#xff0c…

PC介紹之顯卡

PC介紹之顯卡 一、什么是顯卡&#xff1f; 顯示接口卡&#xff08;Video card&#xff0c;Graphics card&#xff09;、顯示器配置卡簡稱為顯卡&#xff0c;是個人電腦基本組成部分之一。 用途是將計算機系統所需要的顯示信息進行轉換驅動&#xff0c;并向顯示器提供信號&…

Sublime Text 3 無法輸入中文解決方案

Sublime Text 3 安裝及無法輸入中文解決方案 安裝sublime-text 3 如果是ubuntu系統終端輸入&#xff1a; wget -qO - https://download.sublimetext.com/sublimehq-pub.gpg | sudo apt-key add - sudo apt-get install apt-transport-https echo "deb https://download.…

Linux Server 安裝 raid 1

Linux Server 安裝 raid 1 兩組以上的N個磁盤相互作鏡像&#xff0c;在一些多線程操作系統中能有很好的讀取速度&#xff0c;理論上讀取速度等于硬盤數量的倍數&#xff0c;與RAID 0相同。另外寫入速度有微小的降低。只要一個磁盤正常即可維持運作&#xff0c;可靠性最高。其原…

0-安裝Vagrant和使用

0-安裝Vagrant和使用 Vagrant 是一款軟件&#xff0c;可以自動化虛擬機的安裝和配置流程。用來管理虛擬機&#xff0c;如 VirtualBox、VMware、AWS等&#xff0c;主要好處是可以提供一個可配置、可移植和復用的軟件環境&#xff0c;可以使用shell、chef、puppet等工具部署。所以…

安裝 Docker Machine

安裝 Docker Machine Docker Machine 支持 Windows ,OS X ,和 Linux&#xff0c;并且被安裝為一個獨立的二進制文件。用于各平臺架構的二進制文件鏈接如下&#xff1a; Windows - 32bitWindows - 64bitOSX - x86_64OSX - (老款 macs)Linux - x86_64Linux - i386 github地址 O…

什么是分布式系統的CAP理論?

什么是分布式系統的CAP理論&#xff1f; 2000年7月&#xff0c;加州大學伯克利分校的Eric Brewer教授在ACM PODC會議上提出CAP猜想。2年后&#xff0c;麻省理工學院的Seth Gilbert和Nancy Lynch從理論上證明了CAP。之后&#xff0c;CAP理論正式成為分布式計算領域的公認定理。 …

什么是分布式系統的BASE理論?

什么是分布式系統的BASE理論&#xff1f; BASE理論 eBay的架構師Dan Pritchett源于對大規模分布式系統的實踐總結&#xff0c;在ACM上發表文章提出BASE理論&#xff0c;BASE理論是對CAP理論的延伸&#xff0c;核心思想是即使無法做到強一致性&#xff08;Strong Consistency&a…

Docker教程介紹

Docker教程介紹 教程環境準備 linux 系統virtualbox 軟件安裝 教程介紹 0-安裝Vagrant&#xff0c;安裝 centos 系統。1-docker 介紹2-docker 安裝3-docker 架構和底層技術簡介4-什么是Image和container5-Dockerfile文件6-搭建一個私有registry7-深入練習Dockerfile8-容器操…

1-docker 介紹

1-docker 介紹 由PaaS到Container 2013年2月&#xff0c;前Gluster的CEO Ben Golub 和 dotCloud 的 CEO Solomon Hykes 坐在一起聊天時&#xff0c;Solomon談到想把 dotCloud 內部使用的Container容器技術單獨拿出來開源&#xff0c;然后圍繞這個技術開一家新公司提供技術支持…

3-docker 架構和底層技術簡介

3-docker 架構和底層技術簡介 Docker Platform Docker 是一個平臺。 提供了一個開發、打包、運行app的平臺把app和底層 infrastructure 隔離開來 根據上圖我們可以看出 Docker Engine 把上層的 app 應用程序和底層的物理設備或虛擬設備進行了隔離&#xff0c;然后我們在 doc…

4-什么是Image和container

4-什么是Image和container 什么是Image? 先練習一個例子: docker pull ubuntu:16.04 docker image ls # 查看鏡像鏡像類似于一個系統安裝光盤&#xff0c;你可以使用一個安裝光盤為多臺電腦安裝操作系統&#xff0c;同樣&#xff0c;你也可以用同一個鏡像構建多個運行的…

5-Dockerfile文件

5-Dockerfile文件 先練習一個例子: 創建 Dockerfile 文件 FROM ubuntu:14.04 LABEL maintainer"vincent <jeffmanwordgmail.com>" RUN apt-get update && apt-get install -y redis-server EXPOSE 6397 ENTRYPOINT [ "/usr/bin/redis-server&quo…

6-搭建一個私有registry

6-搭建一個私有registry docker hub 查找 registry docker hub registry 可以看到部署很簡單&#xff0c;只有一條命令。 docker run -d -p 5000:5000 --restart always --name registry registry:2部署私有registry 找一臺linux的服務器并安裝好docker 在此服務器上部署re…

7-深入練習Dockerfile

7-深入練習Dockerfile 創建一個json-server 鏡像 首先創建一個 json-server 文件夾 mkdir json-server在json-server文件夾下創建Dockerfile FROM node:10.15.0 RUN npm install -g json-server構建鏡像 docker build -t json-server .創建一個api服務的鏡像 首先創建一個 …