[关闭]
@Dale-Lin 2017-03-23T00:12:21.000000Z 字数 1719 阅读 861

HTML 如何开始

HTML


doctype

doctype (Document type) 声明位于文档中单位最前面,处于html标签前。
HTML5 推出的最新书写方法是:

  1. <!doctype html>

html

lang
该属性声明了所用的语言,例如:

  1. <html lang="zh-cmn-Hans">
  2. <!-- 简体中文 -->
  1. <html lang="zh-cmn-Hant">
  2. <!-- 繁体中文 -->
  1. <html lang="en">
  2. <!-- 英文 -->

head 开始

link 标签用于引入CSS样式(应包含rel、href、type):

  1. <link rel="stylesheet" href=" " type="text/css">
  2. <!--
  3. rel的值表示引入文件与文档的关系,当引入CSS文件时, rel的值应该是stylesheet
  4. href对应样式表的相对或绝对位置;
  5. type声明文档类型
  6. -->

title

title 标签位于 head 标签内,用于设置出现在页面窗口上的页面名称:

  1. <title>网页名称</title>

meta

meta 元素位于 head 元素中并包含了页面的一些信息。
该元素是空元素,没有闭合标签。其常用的特性是 name/http-equiv 和 content 。
name 特性的值是你将要设置的属性,而 content 的值是对应的属性,常见的设置有如下几个:

Content-type
首先声明文件的 MIME 类型及字符编码,在 HTML5 中,书写方式如下:

  1. <meta http-equiv="Content-type" content="text/html; charset=utf-8">

name + content 型

description
此属性用来包含一段有关页面的描述信息,这些信息通常用于被搜索引擎了解页面内容,且最多只能容纳155 个字符。有时它也会出现在搜索引擎的检索结果中:

  1. <meta name="description" content=" ">
  2. <!-- content 后包含的是描述页面信息的字符串 -->

keywords
用于包含一组以逗号隔开的关键词列表,用户可以通过搜索这些关键词来找到这个页面,但 Google 搜索引擎已经不支持关键词搜索了:

  1. <meta name="keywords" content=" ">
  2. <!-- content 后是关键词组 -->

robots
用于指定搜索引擎是否将该页面或其链接的其它页面加入到搜索结果中——noindex=不被检索到,nofollow=能被检索到,但不收录其链接的其它页面:

  1. <meta name="robots" content="noindex">
  2. <!-- 使用 noindex会使页面不能被搜索 -->
  3. <meta name="robots" content="nofollow">
  4. <!-- 使用 nofollow会使页面上的其他链接页不被搜索引擎收录 -->

renderer
360 浏览器使用 Google Chrome Frame:

  1. <meta name="renderer" content="webkit">
  2. <!-- 360浏览器在读到这个标签以后就会切换到对应的极速核。 -->

http-equiv + content 型

X-UA-Compatible
优先使用IE的最新版本和Chrome打开:

  1. <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">

Cache-Control
通过百度手机打开网页时,百度可能对你的网页进行转码,脱下你的衣服并贴上狗皮膏药式的广告,为此,添加禁止百度转码的代码:

  1. <meta http-equiv="Cache-Control" content="no-siteapp">

pragma
防止浏览器缓存页面:

  1. <meta http-equiv="pragma" content="no-cache">

expires
设置页面及其缓存的过期时间:

  1. <meta http-equiv="expires" content="Fri, 04 Apr 2014 23:59:59 GMT">
  2. <!-- 必须按照该格式设置日期 -->

author
设置网页的设计者:

  1. <meta http-equiv="author" content=" ">
添加新批注
在作者公开此批注前,只有你和作者可见。
回复批注