移动端头部meta、link书写比较好的案例

最新推荐文章于 2021-06-16 11:29:13 发布
最新推荐文章于 2021-06-16 11:29:13 发布
阅读量760 收藏
点赞数
分类专栏： HTML5 中的新属性 

<!DOCTYPE html>
  	<!--[if lt IE 7 ]><html class="oldie ie ie6"> <![endif]-->
  	<!--[if IE 7 ]><html class="oldie ie ie7"> <![endif]-->
  	<!--[if IE 8 ]><html class="ie ie8"> <![endif]-->
  	<!--[if (gte IE 9)|!(IE)]><!-->
  	<html>
  	<!--<![endif]-->
  	<head>
  	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  	<title>UI设计_软件界面设计_APP应用开发_交互设计_上海艾艺-3D虚拟展示</title>
  	<meta name="keywords" content="UI设计, 软件界面设计,html5开发,移动端UI设计,IOS开发,Android（安卓）开发,用户体验,交互设计,多媒体互动展示,数据展示,数据监控平台,3D虚拟展示" />
  	<meta name="description" content="上海艾艺（ADinnet）成立于2006年，高端的移动应用和开发公司，专注于UI设计和APP应用与研究，将视觉和功能整合，提供美观、易用、实用的互联网产品。" />
  	<meta name="title" content="上海艾艺信息技术有限公司" />
  	<meta name="author" content="艾艺信息on2014-06" />
  	<meta name="Copyright" content="上海艾艺信息技术有限公司，2014" />
  	<!-- 让IE浏览器用最高级内核渲染页面 还有用 Chrome 框架的页面用webkit 内核
  	================================================== -->
  	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  	<!-- IOS6全屏 Chrome高版本全屏
  	================================================== -->
  	<meta name="apple-mobile-web-app-capable" content="yes">
  	<meta name="mobile-web-app-capable" content="yes">
  	<!-- 让360双核浏览器用webkit内核渲染页面
  	================================================== -->
  	<meta name="renderer" content="webkit">
  	<!-- Mobile Specific Metas
  	================================================== -->
  	<!-- !!!注意 minimal-ui 是IOS7.1的新属性，最小化浏览器UI -->
  	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
  	<meta name="format-detection" content="telephone=no">
  	<!-- CSS
  	================================================== -->
  	<link href="/css/reset.css" rel="stylesheet" type="text/css">
  	<link href="/css/magicwall.css" rel="stylesheet" type="text/css">
  	<link href="/css/jquery.gridster.css" rel="stylesheet" type="text/css">
  	<link href="/css/case.css" rel="stylesheet" type="text/css">
  	<link href="/css/case_1280.css" rel="stylesheet" type="text/css">
  	<link href="/css/case_1024.css" rel="stylesheet" type="text/css">
  	<link href="/css/case_640.css" rel="stylesheet" type="text/css">
  	<link href="/css/case_320.css" rel="stylesheet" type="text/css">
  	<link href="/css/style_retina.css" rel="stylesheet" type="text/css">
  	 
  	<!--[if lt IE 9]>
  	<script src="http://cdn.bootcss.com/html5shiv/r29/html5.js"></script>
  	<![endif]-->
  	 
  	<!-- Favicons
  	================================================== -->
  	<link rel="shortcut icon" href="favicon.ico">
  	<!-- Android 主屏图标
  	================================================== -->
  	<link rel="icon" sizes="196x196" href="/images/apple-touch-icon-152x152.png">
  	<!-- IOS 主屏图标
  	================================================== -->
  	<link rel="apple-touch-icon-precomposed" href="/images/apple-touch-icon-76x76.png">
  	<link rel="apple-touch-icon-precomposed" sizes="76x76" href="/images/apple-touch-icon-76x76.png">
  	<link rel="apple-touch-icon-precomposed" sizes="120x120" href="/images/apple-touch-icon-120x120.png">
  	<link rel="apple-touch-icon-precomposed" sizes="152x152" href="/images/apple-touch-icon-152x152.png">
  	 
  	 
  	<!-- <link rel="apple-touch-startup-image" href="/startup-748x1024.jpg"
  	media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)" >
  	<link rel="apple-touch-startup-image" href="/startup-768x1004.jpg"
  	media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)" > -->


happyhappyjuan
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
web-head
luo4532的博客
05-31 317
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35
移动端meta头
qq_38402659的博客
02-26 154
最大,最小可缩放比例,用户是否允许缩放 &amp;lt;meta name=&quot;viewport&quot; content=&quot;width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no&quot;&amp;gt;
移动端web头标签
02-04 373
&lt;!DOCTYPE html&gt;&lt;!-- 使用 HTML5 doctype，不区分大小写 --&gt; &lt;htmllang="zh-cmn-Hans"&gt;&lt;!-- 更加标准的 lang 属性写法 http://zhi.hu/XyIa --&gt; &lt;head&gt; &lt;!-- 声明文档使用的字符编码 --&gt; &lt;
HTML5 之 Link 标签
热门推荐
无
06-16 1万+
概述   link 元素用于链接外部css样式表等其他相关外部资源。 link   其中link中包括如下属性。 href：指明外部资源文件的路径，即告诉浏览器外部资源的位置 hreflang：说明外部资源使用的语言 media：说明外部资源用于哪种设备 rel：必填，表明当前文档和外部资源的关系 sizes：指定图标的大小，只对属性rel="icon"生效 type：说明外部资源的 MIME 类型，如text/css、image/x-icon rel   rel核心属性的参数值如下，也可参考 MDN.
移动端专用的meta标签设置大全
09-22
不知道有没有人觉得，html的meta标签描述的头部信息特别多，下面这篇文章主要给大家分享介绍了关于移动端专用的meta设置的相关资料，文中通过示例代码介绍的非常详细，需要的朋友可以参考借鉴，下面随着小编来一起...
移动端html5 meta标签的神奇功效
09-28
制作手机版网站的时候，除了页面简洁、操作方便等访问者可以看到的地方以外，就是 Meta 标签的设置，合理设置 Meta 标签 对手机版网站的搜索引擎优化，手机浏览器的渲染展示都有非常大的帮助
HTML5各种头部meta标签的功能(推荐)
09-27
HTML5中的头部`meta`标签是用来提供元信息的，这些信息包括但不限于网页的字符编码、描述、关键词、作者、搜索引擎优化、移动设备适配以及浏览器兼容性等。下面将详细介绍这些`meta`标签的功能。 1. **`<!DOCTYPE ...
移动端html 头部header代码示范
武当山道士的博客
07-22 1万+
"> //清缓存 //电话号码不显示为拨号连接； // 网站开启对web app的支持 //顶部状态条的样式 default 白色 black 黑色 black-translucent:半透明（若值为“black-translucent”将会占据页面px位置，浮在页面上方（会覆盖页面20px高度–iphone4和itouch4的Retina屏幕为40px））
移动端的头部标签和meta，[html5]移动端的头部标签和meta属性详解
故梦-阿梓
04-02 1031
移动前端开发中添加一些webkit专属的HTML5头部标签，帮助浏览器更好解析HTML代码，更好地将移动web前端页面表现出来。本文整理一些常用的meta标签,需要的朋友可以参考前言meta是html语言head区的一个辅助性标签。也许你认为这些代码可有可无。其实如果你能够用好meta标签，会给你带来意想不到的效果，meta标签的作用有：搜索引擎优化（SEO），定义页面使用语言，自动刷新并指向新的...
移动端的头部标签和 meta
巴黎的妖
12-30 7007
使用 HTML5 doctype，不区分大小写 更加标准的 lang 属性写法 html lang="zh-cmn-Hans"> meta 声明文档使用的字符编码 meta charset='utf-8'> 优先使用 IE 最新版本和 Chrome meta http-equiv="X-UA-Compatible" content="IE=edge,
你所不知的meta和link用法
weixin_34375251的博客
04-09 120
字符编码 <meta charset="utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 两种写法等效，推荐写第一种 语言设置 简体中文 <html lang="zh-cmn-Hans"> 繁体中文 &...
html 移动端——meta标签和link标签
wuyou1336的博客
05-09 960
一、meta标签 meta标签主要辅助HTML结构层的。meta标签不管在互联网前端还是在移动端都起了很重要的作用。 这是一个HTML5为语言标准的说明文档。 第一组meta标签，比较常见。它表明的意思是它的内容是html文档，且网页编码采用的是utf-8编码。utf-8编码主要针对是简体中文和英文。正确的编码定义很有必要。否则会导致网页上的文字变成乱码。 第二组
移动前端不得不了解的html5 head 头标签
01-07 341
本文主要内容来自一丝的常用的 HTML 头部标签和百度FEX的HTML head 头标签。 移动端的工作已经越来越成为前端工作的重要内容，除了平常的项目开发，HTML 头部标签功能，特别是meta标签显得非常重要。   DOCTYPE DOCTYPE(Document Type)，该声明位于文档中最前面的位置，处于 html 标签之前，此标签告知浏览器文档使
ArubaInstant-Hercules-8.10.0.12-89862
最新发布
07-10
Aruba 318 Series Hardened Access Points Aruba 370 Series Outdoor Access Points Aruba 387 Series Outdoor Access Points Aruba 320 Series Campus Access Points Aruba 310 Series Campus Access Points
【成都理工大学】工厂电气控制技术2022-2023复习题
07-10
本资源包括【成都理工大学】工厂电气控制技术2022-2023学年的复习题，覆盖了电气控制系统的基本原理、电气元件的选择和应用、电路设计及故障诊断等核心内容，适用于成都理工大学电气工程及其自动化专业的本科生，以及其他学习或研究电气控制技术的学生和专业人士。资源帮助学生系统复习课程内容，巩固知识点和技能，提升考试成绩，并可作为教师的教学辅助手段。复习题形式多样，题目详尽，部分题目附有答案和解析，用户需具备基础电气控制技术知识，方能有效利用进行复习。
基于偏微分方程的一维浅水方程.mph
07-09
comsol基于偏微分方程的一维浅水方程
html移动端meta
06-07
移动端的 meta 标签可以用来控制网页在移动设备上的显示效果，常见的 meta 标签有以下几种： 1. viewport：用来控制页面的视口大小和缩放比例，一般设置为以下内容： ``` <meta name="viewport" content="width=...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值