dmyz.org
域名年龄: 15年6个月13天HTTP/1.1 200 OK 服务器:nginx/1.4.3 访问时间:2015年05月24日 00:33:04 类型:text/html; charset=UTF-8 Transfer-Encoding: chunked 连接:keep-alive 语言环境:PHP/5.4.32-2+deb.sury.org~precise+1 X-Pingback: http://dmyz.org/xmlrpc.php Content-Encoding: gzip 动作:Accept-Encoding 网站编码:UTF-8
动漫驿站HomeTechFrontProductOther重新学习HTML5的HTMLPosted 2015-05-22 by Perchouli经过媒体的渲染,目前大众认为的HTML5大致等于:酷炫的效果,复杂的技术,手机能正常浏览的网页。于是经常有人问我:某个功能,某个效果,HTML5能实现吗?这种表现层的问题,如果排除平台因素回答就是:以前实现不了的,HTML5还是实现不了;以前能实现的,HTML5通常能实现得更好。比如通知,以前用轮询,现在可以用websocket;比如想直接读取客户Windows目录下的文件(…),现在(正常情况下)还是实现不了…广义的HTML5是一系列技术组合,希望能减少浏览器对插件(Flash/Silverlight/JAVA)的依赖。于是大家关注的重点主要是各种新增的API,HTML作为一种标记语法就没太重视。结果当我用canvas做好表格,用localStorage实现缓存,用video+websocket改进了视频播放后,回头来看我写的HTML代码其实还不够规范。所以这篇文章是关于HTML的,内容顺序按照HTML的顺序:从doctype到metadata,然后是部分常见标签,总之都是非常浅显的内容。嵌入内容的标签(例如img/object/video)不在讨论的范围,跟CSS或JS关联太紧密的标签(例如各种事件绑定和output标签)也不会涉及。全文没有截图,很多HTML代码是直接写在页面上的,Firefox/Chrome测试正常,但我没办法控制您的浏览器以及爬虫,因此如果样式出现误差请更换浏览器或找找原文链接…DOCTYPES通常是在第一行,告诉浏览器基于哪种标准渲染。如果不加或格式错误,默认会采用怪异模式(quirks mode),导致CSS显示错误。常见的写法是:XHTML<!DOCTYPE html>或<!doctype html>123<!DOCTYPE html>或<!doctype html>可以小写,但如果用在XML中必须大写,所以建议采用大写。按照XHTML的写法,空元素(void element)的写法是结尾加/,HTML5不需要。所以br元素的写法是<br>而不是<br/>。html除了doctypes,其他所有元素都在的html元素中,简体中文网页常见的写法是:XHTML<!DOCTYPE html><html>或<html lang="zh-Hans" dir="ltr"></html>123456<!DOCTYPE html><html>或<html lang="zh-Hans" dir="ltr"> </html>lang指定当前文档使用的语言,dir指定文字顺序是从左到右(left to right, dir=”ltr”)还是从右到左(right to left, dir=”rtl”)。lang属性的值遵守BCP 47,不区分大小写。某些网站用的是zh-CN,比如苹果中文,考虑到苹果最近乱七八糟的中文文案就不以他们为标准了…lang对于主流浏览器和常见网页来说,影响不大,相比charset导致的乱码,lang只是偶尔导致字体显示问题。部分搜索引擎、翻译工具和读屏软件会读取lang的值。head文档的metadata元素都在head元素中,metadata元素包括style, script, noscript, command, title, base, link, meta,一个在手机屏幕上自适应且不能缩放的网页常见的写法是:XHTML<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta base="http://dmyz.org/"><title>动漫驿站</title><meta name="viewport" content="width=device-width, user-scalable=no"><link rel="apple-touch-icon" href="apple-touch-icon.png"><link rel="shortcut icon" href="favicon.ico"></head>12345678910<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <meta base="http://dmyz.org/"> <title>动漫驿站</title> <meta name="viewport" content="width=device-width, user-scalable=no"> <link rel="apple-touch-icon" href="apple-touch-icon.png"> <link rel="shortcut icon" href="favicon.ico"></head>其中style/script/noscript用来嵌入CSS/JS,command大多数浏览器都不支持,title是网页标题。base用来处理URL,将相对路径转成绝对路径以及修改target。例如<img src=”1.jpg”>,会去请求 http://dmyz.org/1.jpg。设置http://dmyz.org/和http://dmyz.org效果相同。target的值是_blank, _self, _parent, _top,如果a标签也设置了target以a标签的为准。link的用途很多,设置pingback,目录,archives等等,使用频率最高的是引入CSS文件和设置icon。关于iOS的icon设置可以参考官方的说明。meta的name属性以前主要是SEO使用,例如keyword, description,但现在主流搜索引擎都不会取keywords了。charset是初学HTML和写爬虫时很容易遇到的坑,统一成utf-8可以避免大部分编码问题,最好是放在metadata的第一行。以前的charset(还有之前提到的lang)是由http-equiv指定的,现在简化了写法,http-equiv除了设置refresh和兼容老版本IE浏览器,其他情况已经不常使用了。对于现在的多屏场景,最重要的是viewport(严格来说它属于CSS的内容),即视口。概念上分为初始视口(initial viewport)和实际视口(actual viewport)。初始视口是样式/设定生效前的大小,实际视口则是生效之后
© 2010 - 2020 网站综合信息查询 同IP网站查询 相关类似网站查询 网站备案查询网站地图 最新查询 最近更新 优秀网站 热门网站 全部网站 同IP查询 备案查询
2025-08-06 03:54, Process in 0.0038 second.