当前位置: 首页 > news >正文

HTML和CSS网页标准指南

文档类型声明
在你每一个页面的顶端,你需要文档声明。是的,必须。
如果不指定文档类型,你的HTMLHTML不是合法的HTML,并且大部分浏览器会用“怪癖模式(quirks mode)”来处理页面,这意味着浏览器认为你自己也不知道究竟做什么,并且按浏览器自己的方式来处理你的代码。你可以是一个HTML大师,在地球上打遍天下无敌手,或者你的HTML可以无瑕疵,CSS可以很完美,但如果没有文档声明,或者错误的文档声明,你的网页与一个短视的,独眼的长臂猿婴儿十分艰难地堆砌起来的没两样。
XHTML 1.0 Strict(严格)的文档声明是这样的:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
下面的是XHTML 1.1的文档声明,作为XHTML的最新版本,看起来更完美,但还是有一些问题,随后我们会稍微讲解……
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" " http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
如果你不愿放弃HTML 4或者你还有Netscape 4死忠用户,你可以使用XHTML 1.0 Transitional(过渡型):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
你使用这的唯一理由是你还要兼容老版本的,少用的浏览器。过渡型XHTML 1.0允许HTML 4的表现元素,其也可能在如Netscape 4的浏览器中表现更好。但使用这些元素将对你网页的效率和可用性有害。
最后,如果你是使用框架的怪人之一,可以使用像下面一样的XHTML 1.0 Frameset(框架)文档类型声明:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
注意DOCTYPE标签必须大写和前置一个英文半角感叹号!。它是唯一一个打破规则的标签,它不需要关闭。
语言声明
即使HTTPHTTP头或者在html起始标签内设置了xml:lang属性,你也必须为文档指定一个主要语言。尽管处理一个合法的XHTML文档这不是必须的,但也是一个易用性的考虑。值是缩写的,比如en(English,英语),fr(French,法语),de(German,德语)或者mg(Malagasy,这是什么语?译者也不知道,呵呵。——译者注)。
声明一个主要用英语内容的文档,例子是这样的:
<html xmlns=" http://www.w3.org/1999/xhtml" xml:lang="en">
在声明主要语言之后,假如还需要使用其他语言,你还可以在内联中使用xml:lang属性(比如<span xml:lang="de">HTML Hund</span>)。
内容类型
HTML文档的媒体类型和字体集也许要指定,可以使用HTTP头来完成,比如:
Content-Type: text/html; charset=UTF-8
HTTP头部的第一部分(如text/html)是文件MIME类型,让浏览器知道文件的媒体类型因此可以知道怎么处理。所有的文件都有MIME类型。JPEG图像是image/jpeg,CSS文件是text/csss和HTML一般使用text/html。
HTTP头部的第二部分(如UTF-8部分)是字符集。
也许设置HTTP头的最简易方法是在HTML中使用“HTTP同义(HTTP-equivalent)”的头标签,像这样:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
些微复杂当更好的方法是使用服务器端脚本语言来发送头。用PHPPHP的话,你可以这样做:
<? header("Content-Type: text/html; charset= UTF-8"); ?>
如果你不愿意(或不能)使用服务器端脚本语言,你也许可以直接给服务器设置一个“.htaccess”文件。大部分服务器(Apache兼容)可以在根目录使用一个“.htaccess”的小文本文件,写入下面的内容,你就可以把所有的“html”后缀文件都与MIME类型和字符集关联:
AddType text/html;charset=UTF-8 html
字符集包括大部分西方基于拉丁文语言的“ISO-8859-1”,日语的“SHIFT_JIS”,中文的“GB18030”和UTF-8,一个 Unicode Transformation Format版本,提供大范围的多种语言的单个字符。基本上,你应该使用一个你知道的,能为你用户清楚认知的字符集。除非你使用基于拉丁语的语言(包括英语)(ISO-8859-1被普遍接受的),你应该使用UTF-8因为它可以显示大多数语言的大多数字符,使用它也是安全的,因为它可以在大部的计算机上使用。
关于更多你可以阅读elsewhere on the web。
注意
XHTML应该当作application/xhtml+xml的MIME类型来使用,再清楚不过,这是XMLXML程序。不幸的是,大部分浏览器没有对这没有第一线索。所以,一般认为使用text/html的MIME类型是不错的。根据W3CW3C的建议和网页标准工程的未来亮点,调味的XHTML 1.0也许可以作text/html使用,但XHTML 1.1不应该,这就是这个网站以XHTML 1.0 Strict(严格)作为例子,假定text/html的MIME类型。但是你仍然可以(或许不应该)为它们设置正确的MIME类型给浏览器,轻微的调用一下服务器端即可。
这个网站使用PHP为XHTML 1.1设置application/xhtml+xml的MIME类型给那些能够理解和处理这个类型的浏览器(如Mozilla),为XHTML 1.0 Strict设置text/html给其他浏览器(如IE)。为每一个页面的顶部加入如下代码:
<? if(stristr($_SERVER["HTTP_ACCEPT"],"application/xhtml+xml")){ header("Content-Type: application/xhtml+xml; charset=UTF-8"); echo('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" " http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">'); } else { header("Content-Type: text/html; charset=UTF-8"); echo ('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">'); } ?>
这些检查核实浏览器是否接受application/xhtml+xml的MIME类型,如果接受,就发送这个MIME类型并把XHTML 1.1文类类型写到HTML中。如果这个MIME类型不被接受,就发送text/html的MIME类型并把XHTML 1.0 Strict(严格)的文档类型写入HTML。
除了你知道你正在做着正确的事情和为自己准备将来的路的平和想法外,最直接的益处就是,使用这个方法,Mozilla浏览器把你的文件当作XML程序对待并且如果你的XHTML还没有抓痒,就是说不合式的,Mozilla就不会工作。然后你就可以排错了,而不需要用校验器来运行你的文档了。
还有一篇更具体的 使用正确的MIME类型伺服XHTML 供你参考。

相关文章:

  • 使用OpenCV-Python外接摄像头打不开问题
  • 访问站点提示:Service Unavailable,应用程序池的状况提示为:未指定错误
  • Python-OpenCV调用摄像头并保存视频
  • 通过Robots.txt禁止搜索引擎收录的方法
  • Python-OpenCV棋盘检测
  • 表格处理:换行还是不换行?
  • Ubuntu20.04安装指南及初步环境配置(超级详细)包含[ROS Noetic、Terminator、Pycahrm等常用工具安装]
  • 升级了
  • 《动手学深度学习》(PyTorch版) - 专栏说明
  • 流程分析师——不错的选择
  • 《动手学深度学习》(PyTorch版)避坑总结 - 1【d2lzh_pytorch模块导入方法详解及提示错误的解决方法】
  • 《动手学深度学习》(PyTorch版)避坑总结 - 2 【3.2.1代码未能画出散点图,并且也未报错】
  • Netbeans一个巨奇怪的问题
  • 《动手学深度学习》(PyTorch版)避坑总结 - 3 【运行3.5.1节代码后不显示图像】
  • Windows Live Search For Mobile vs. Google Maps Mobile
  • extract-text-webpack-plugin用法
  • IndexedDB
  • iOS仿今日头条、壁纸应用、筛选分类、三方微博、颜色填充等源码
  • Java 9 被无情抛弃,Java 8 直接升级到 Java 10!!
  • JavaScript服务器推送技术之 WebSocket
  • Java多线程(4):使用线程池执行定时任务
  • JAVA多线程机制解析-volatilesynchronized
  • k个最大的数及变种小结
  • nginx 配置多 域名 + 多 https
  • Redis字符串类型内部编码剖析
  • unity如何实现一个固定宽度的orthagraphic相机
  • vue+element后台管理系统,从后端获取路由表,并正常渲染
  • 爱情 北京女病人
  • 初识 beanstalkd
  • 飞驰在Mesos的涡轮引擎上
  • 前端面试之CSS3新特性
  • 软件开发学习的5大技巧,你知道吗?
  • 少走弯路,给Java 1~5 年程序员的建议
  • 新手搭建网站的主要流程
  • 一个项目push到多个远程Git仓库
  • 用简单代码看卷积组块发展
  • 京东物流联手山西图灵打造智能供应链,让阅读更有趣 ...
  • ​软考-高级-系统架构设计师教程(清华第2版)【第20章 系统架构设计师论文写作要点(P717~728)-思维导图】​
  • $ git push -u origin master 推送到远程库出错
  • $分析了六十多年间100万字的政府工作报告,我看到了这样的变迁
  • (12)Hive调优——count distinct去重优化
  • (4)事件处理——(6)给.ready()回调函数传递一个参数(Passing an argument to the .ready() callback)...
  • (ctrl.obj) : error LNK2038: 检测到“RuntimeLibrary”的不匹配项: 值“MDd_DynamicDebug”不匹配值“
  • (k8s中)docker netty OOM问题记录
  • (Note)C++中的继承方式
  • (附源码)springboot车辆管理系统 毕业设计 031034
  • (附源码)流浪动物保护平台的设计与实现 毕业设计 161154
  • (转)linux 命令大全
  • .NET CORE 3.1 集成JWT鉴权和授权2
  • .net mvc部分视图
  • .NET Remoting Basic(10)-创建不同宿主的客户端与服务器端
  • .Net转Java自学之路—基础巩固篇十三(集合)
  • [51nod1610]路径计数
  • [AMQP Connection 127.0.0.1:5672] An unexpected connection driver error occured
  • [BUG]Datax写入数据到psql报不能序列化特殊字符