码迷,mamicode.com
首页 > Web开发 > 详细

DTD文档模型以及meta的使用

时间:2016-06-30 21:34:34      阅读:131      评论:0      收藏:0      [点我收藏+]

标签:

移动端 H5页面

<!DOCTYPE html> 

<html>

<head>

  <title></title>

  <meta charset="UTF-8">  UTF-8是国际通用标准,各国语言都可以正常显示,中国的字符编码集是GB2312

  <meta name="keywords" content="关键字">

  <meta name="description" content="网站描述"> 关键字和网站描述方便SEO

  <meta name="viewport" content="width=device-width,initial-scale=1.0,max-scale=1.0,user-scalable=0;">

</head> 

<body>

</body>

</html>

 

PC端

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<meta http-equiv="Content-Type" content= "text/html" charset="UTF-8">
<meta name = "keywords" content = "关键字">
<meta name="description" content="描述">
<meta name="viewport" content="width=device-width,initial-scale=1.0,max-scale=1.0,user-scalable=0;"/>
</head>
<body> 

  <p>  p标签表示段落
    <a href="http://map.baidu.com/">百度地图</a>  能够点击的文字用a标签
  </p>
  <img src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png" width="270px" height="129px" alt="百度" title="百度">  
  <br/>
  <span>2015baidu</span>  不能点击的文字用span标签

</body>

</html>

 

总结:

DTD文档模型:

  过渡的(Transitional) : 要求非常宽松,继续使用HTML4.01的标识

  严格的(Strict) : 不能使用任何表现层的标识和属性,如<br/>

  框架的(Frameset) : 页面中含有框架,需要使用这种DTD

 

meta

  1.设置文档编码

    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">  PC端

    <meta charset="UTF-8">  移动端

  2.设置关键字和描述方便SEO

    <meta name="keywords" content="关键字">

    <meta name="description" content="描述">

  3.设置移动端开发缩放比例

    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0;">

图片

  苹果设备的图片分辨率是普通的2倍,所以图片一般做成2倍,以防止苹果设备使用时图片被拉伸变模糊.

DTD文档模型以及meta的使用

标签:

原文地址:http://www.cnblogs.com/IceyB/p/5631048.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!