首页 首页 大数据 查看内容

HTML之meta&&响应式布局

木马童年 2019-5-1 02:15 20 0

meta 在head标签中的meta标签,可以为HTML文档提供额外信息 meta属性主要分为两组 1.name属性与content属性 name属性用于描述网页,它是以名称/值形式的名称,name属性的值所描述的内容(值)通过content属性表示,便 ...

meta

在head标签中的meta标签,可以为HTML文档提供额外信息

meta属性主要分为两组

1.name属性与content属性

name属性用于描述网页,它是以名称/值形式的名称,name属性的值所描述的内容(值)通过content属性表示,便于搜索引擎机器人查找,分类.其中最重要的是description,keywords

2.http-equiv属性与content属性

http-equiv属性用于提供HTTP协议的响应头报文(MIME文档头),它是以名称/值形式的名称,http-equiv属性的值所描述的内容(值)通过content属性表示,通常为网页加载前提供给浏览器等设备使用.其中最重要的是content-type charset 提供编码信息,refresh刷新与跳转页面,no-cache 页面缓存,expires网页缓存过期时间.

定义网页关键词

多个关键词应该使用空格分开;

最好保持在10个以下,过多的关键词,搜索引擎将忽略;

定义网页简短描述

应该保持在140-200个字符或者100个左右的汉字;

响应式布局

像素和分辨率

一张图片640*480:长640像素,宽480像素。单位面积上像素点越多(即像素点越小),这图片就越清晰细腻。但是每一个像素多少毫米取决于显示器的分辨率。A显示器640*480,B显示器1200*480,AB显示器长宽相同。那么图片在A显示器上刚好铺满,每个像素点很大,图片很粗糙,在B显示器上不能铺满,每个像素点比较小,图片比较清晰。

viewport

移动设备上的viewport就是浏览器上用来显示网页的那部分区域。

一般来讲,移动设备上的viewport都是要大于浏览器可视区域的,这样那些为桌面设计的网站也能在移动浏览器上正常显示,带来的后果就是浏览器会出现横向滚动条。移动设备默认的viewport是layout viewport。

layout viewport 的宽度是大于浏览器可视区域的宽度的,layout viewport的宽度可以通过 document.documentElement.clientWidth 来获取;(通常是980px)

visual viewport的宽度是浏览器可视区域的大小, visual viewport的宽度可以通过window.innerWidth 来获取;

1

meta标签的作用是让layout viewport的宽度等于设备的宽度也就是visual viewport的宽度,同时不允许用户手动缩放。没有设置meta,css的320px在手机屏幕中大约只有1/3宽。设置了meta,css的320px在手机屏幕中差不多铺满屏幕。

参考资料:http://www.cnblogs.com/2050/p/3877280.html

在不久的将来,多智时代一定会彻底走入我们的生活,有兴趣入行未来前沿产业的朋友,可以收藏多智时代,及时获取人工智能、大数据、云计算和物联网的前沿资讯和基础知识,让我们一起携手,引领人工智能的未来!

搜索引擎 机器人 移动设备
0
为您推荐
大数据技术改变城市的运作方式,智慧城市呼之欲出

大数据技术改变城市的运作方式,智慧城市呼

纽奥良虽像大多数城市一样有火灾侦测器安装计划,但直到最近还是要由市民主动申装。纽…...

大数据分析面临生死边缘,未来之路怎么走?

大数据分析面临生死边缘,未来之路怎么走?

大数据分析开始朝着营销落地,尤其像数果智能这类服务于企业的大数据分析供应商,不仅…...

什么是工业大数据,要通过3B和3C来理解?

什么是工业大数据,要通过3B和3C来理解?

核心提示:工业视角的转变如果说前三次工业革命分别从机械化、规模化、标准化、和自动…...

大数据普及为什么说肥了芯片厂商?

大数据普及为什么说肥了芯片厂商?

科技界默默无闻的存在,芯片行业年规模增长到了3520亿美元。半导体给无人驾驶汽车带来…...

大数据技术有哪些,为什么说云计算能力是大数据的根本!

大数据技术有哪些,为什么说云计算能力是大

历史规律告诉我们,任何一次大型技术革命,早期人们总是高估它的影响,会有一轮一轮的…...

个人征信牌照推迟落地,大数据 重新定义个人信用!!

个人征信牌照推迟落地,大数据 重新定义个

为金融学的基础正日益坚实。通过互联网大数据精准记录海量个人行为,进而形成分析结论…...