所谓元信息标签,就是用来描述自身信息的一类标签,通常出现在head标签中,一般不会显示在页面上。它们多是为浏览器和搜索引擎服务的,用于提升性能或者检索信息。
head 标签本身并不携带任何信息,它主要是作为盛放各种元信息标签、语义类标签的容器使用。规定head标签是html标签的第一个元素,并且 head 里面必须包含一个 title 。
从字面上讲, title 表示标题,但是 title 标签的含义却与此有点出入,它表示一个页面的精确概要信息,会作为页面标题显示在浏览器窗口上。另外,合理的 title 标签对SEO也有好处。
例如得到Web版:
从 meta 的含义就知道,它表示元信息。 meta 标签是一组键值对,一般用 name 和 content 分别表示键和值,在 head 中可以出现多个 meta 标签。基本用法是这样的:
上面的标签表示页面所在的Web应用名为StackOverflow。
从HTML5开始,为了简化写法, meta 标签新增了 charset 属性。添加了 charset 属性的 meta 标签无需再有 name 和 content 。
为了数据格式保持正确,建议将 charset 作为 head 的第一个标签。
从字面上看, http-equiv 即 http equivalent ,表示执行一条和HTTP头相关的指令,自然就不再需要 name 属性了。例如:
viewport 元信息标签虽然不是HTML标准定义的内容,但是却成为移动端Web开发的事实标准。它主要表示视口的属性,比如大小、缩放范围等。
所有属性包括:
元信息类标签,是用于描述文档自身信息的标签,必须放在 head 标签中,而 head 标签又是 html 标签中的第一个标签。元信息类标签主要由 title 和 meta 标签构成。 meta 标签由 name 作为key, content 作为value的键值对组成,主要包含:
所谓 元信息 ,是指描述自身的信息。 元信息类标签 ,就是 HTML 用于描述文档自身的一类标签。通常出现在 head 标签中,一般来说都不会被页面显示出来。(与此相对应的是,其他的标签,比如语义类标签,描述的是业务)。
元信息多数情况下是给浏览器、搜索引擎来阅读的,而不是给我们人类阅读的(大多数时候)。有时候这些信息会在页面之外显示,有时候不会。
对于已经做好了移动端适配的网页,应该把用户缩放功能禁止掉,宽度设为设备宽度,一个标准的 meta 如下:
application-name:如果页面是 Web application,用这个标签表示应用名称。
1、块状元素:
块级元素是指本身属性为display:block的元素。因为它自身的特点,我们通常使用块级元素来进行大布局(大结构)的搭建。
布局上:独占一行,可以容纳内联元素和其他块元素
样式上:设置width、height有效,可以设置盒子模型的相关css属性,
在不设置宽度的情况下,块级元素的宽度是它父级元素内容的宽度
在不设置高度的情况下,块级元素的高度是它本身内容的高度
2、 行内元素:
内联元素是指本身属性为display:inline的元素。因为它自身的特点,我们通常使用块级元素来进行文字、小图标(小结构)的应用。
布局上:和其他元素从左到右在一行排列,只能容纳文本或者其他内联元素(不要在内联元素中嵌套块级元素)
样式上:不能直接控制width、height,只能使用盒模型部分属性,如padding、line_height、margin-left、margin-right。
内联元素的宽高是由本身内容的大小决定(文字、图标等)
3、 行内块状元素:尽可能少的占用横向空间,和其他元素都在一行上;可以设置width、height、margin、padding等盒模型相关属性。
*常用:img、input、td。
display:block;(将元素变为块级元素)
display:inline; (将元素变为行级元素)
display:inline-block;(将元素变为行级块元素)
a. 块元素特立独行;内联元素随波逐流。
b.块元素通常用作网页的主要构建模块,而内联元素常用来标记小段内容(修饰文本)
c.设计一个页面时,一般从较大的块开始 ,然后完善页面的时候再加入内联元素。
d. 对标签能够清晰的分类,掌握标签的特性,在选择标签时避免犹豫不决,提高布局效率。
HTML5新结构标签
HTML5-新的属性语法
HTML5图形
HTML5音视频标签
对本地离线存储的更好的支持
新的表单控件,比如 calendar、date、time、email、url、search
移除的元素:
纯表现的元素:basefont,big,center,font, s,strike,tt,u
对可用性产生负面影响的元素:frame,frameset,noframes;
支持HTML5新标签 : IE8/IE7/IE6支持通过document.createElement方法产生的标签,可以利用这一特性让这些浏览器支持HTML5新标签,浏览器支持新标签后,还需要添加标签默认的样式。当然也可以直接使用成熟的框架、比如html5shim
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)