‘ web标准 ’ 的存档; 分类
Web 技术突飞猛进，Web 设计与开发者们可以选择的工具越来越多，Web 开发者的技巧不再只限于 HTML 和 服务器端编程，还需要精通各种第三方资源，这些第三方资源有时候比你的项目更复杂，更专业，你无法自己实现一切，借助一些 Web API，你可以很方便地将大量优秀的第三方资源集成到自己的站点。本文全面搜集 Web 开发中可能用到的各种第三方资源。 1. 函数与类库 A. CAPTCHA CAPTCHA 用来防止恶意表单发布，以下 CAPTCHA 系统可以轻松集成到你的程序中： reCAPTCHA 这是目前最流行的 CAPTCHA 机制，该机制同时是一个古籍数字化工程的一部分，用户在验证的同时，也帮助辨认一些不够清晰的估计扫描。reCAPTCHA 还有一个 Perl 模块 实现该功能。 Securimage 这个一个免费的，开源 PHP CAPTCHA 脚本。 freeCap 基于 GPL 协议的 CAPTCHA 脚本 HN CAPTCHA PHP CAPTCHA 脚本，基于 LGPL 协议 B. 日期处理 日期操作并不轻松，尽管 PHP 和 Perl 内置了大量此类函数，但未必满足你的需要，以下是几个很好用的日期函数： PEAR Date 通用 PHP 日期类库 Date Class PHP 类库，计算及其增减与日期差异 Date manipulation in PHP PHPBuilder.com 上的一个教程，讲解如何进行日期处理 Date::Calc Perl Module Perl模块，用于格列高利历法的日期计算 C. 图形处理 图片缩放，添加水印等： Image Manipulation Class 在 PHP 中缩放，反转，旋转图片 PHP Thumbnailer 一个轻量级图片缩略图工具 PHP [ 阅读全文]
Web 技术突飞猛进，Web 设计与开发者们可以选择的工具越来越多，Web 开发者的技巧不再只限于 HTML 和 服务器端编程，还需要精通各种第三方资源，这些第三方资源有时候比你的项目更复杂，更专业，你无法自己实现一切，借助一些 Web API，你可以很方便地将大量优秀的第三方资源集成到自己的站点。本文是第二部分。 3. APIs 以下 API 可以将很多现成的功能集成到你的站点： Alexa Top Sites 这个 API 按 Alexa 排名返回网站列表 bit.ly API bit.ly URL 缩短 API Blinksale API 访问 Blinksale 数据。 FoXRate 货币汇率转换 API eBay API eBay 的 API，可以向 eBay 提交货品。 Twitter API Twitter API，用来访问 Twitter 数据，包括用户状态和信息。 4. IP 定位 用户来自什么地方。 OpenCrypt IP Location API 根据 IP 探测用户来自哪个国家 IP Details 一个 PHP 类库，根据 IP 地址获取用户地理位置 GEO-IP IP 到国家对应数据库 5. 图表 amCharts 基于 Flash，支持 3D 图表 FusionCharts 漂亮的 3D 图表 XML/SWF Charts 可高度定制的 [ 阅读全文]
首先看一段代码 <div id=”parentDiv”> <div id=”subLeft” style=”float:left;width:100px”></div> <div id=”subRight” style=”float:right;width:100px”></div> </div> <div id=”otherDiv”></div> 在这段代码中父容器parentDiv中如果不设定任何高度值，那么otherDiv就不会接着subleft和subRight顺序排下来，因为subLeft和subRight是float对象，不占据任何空间，这样就可能引起一些问题。 对于此，有两种解决办法： 1.给parentDiv设定一个适当的高度值Height 很简单，把height值写在parentDiv的style中。 但是，如果父容器本身是一个class，需要多次应用。那么这个高度就不能确定，不能统一一个数值。 2.overflow:auto;zoom:1 可以让父容器，自适应内部容器的高度。 在父容器的style中加入overflow:auto;zoom:1 则可以让父容器自适应内部容器的高度。 但是overflow:auto;zoom:1并不能通过W3C标准，zoom:1;是为了兼容IE6而使用的CSS HACK，可以用<!–[if IE]>这样的方式来写CSS的这个属性 。 如果父容器只被使用一次，可以设定固定高度。请使用高度值控制，不要使用overflow。因为overflow:auto;zoom:1并不能通过W3C标准zoom:1;是为了兼容IE6而使用的CSS HACK 以下再记录一种具体情况的解决方法 父容器（parentDiv）本身没有背景图，其内部容器（左subLeft和右subRight）都是纯文字或者纯图片内容的浮动对象。parentDiv下面与之同样级别的otherDiv的css有一个背景图 如果subLeft和subRight以及parentDiv不加高度控制的话（这里其实只要parentDiv加高度就可以了，但是此高度一定要高于subLeft和subRight的实际高度），那么下面的otherDiv的背景图将不会从otherDiv的(0,0)坐标开始展开，而是会从上面的parentDiv开始，因为parentDiv没有高度控制，而其内部的仅仅是浮动对象，不占据空间，所以otherDiv实际上就是从靠近parentDiv的(0,0)开始的，所以其背景也是靠近parentDiv的（0,0）开始铺开（这里，如果parentDiv的高度设定了10px,那么otherDiv就从(0,10px）开始铺开，)，但由于浮动对象存在，所以otherDiv内部的文字图片还是会从被浮动对象占据了的空间的下面开始展示。因为不会出现文字重叠。 这种情况，可以 设定parentDiv和subLeft、subRight的高度。 给parentDiv一个overflow:auto;zoom:1的css特性，让其自适应内部浮动容器的高度。 在parentDiv之内 otherDiv之后加<br />的清除浮动，这样，也可以让otherDiv的背景从被浮动容器占据的空间之下开始排列（ 父容器如果本身有背景图，那么类似上面这种情况，其内部又有两个浮动对象的话，在otherDiv后面的加<br />清除浮动就无效了。必须使用parentDiv加高度或者加overflow:auto;zoom:1来解决此问题。） [ 阅读全文]
区别IE6与FF： background:orange;*background:blue; 区别IE6与IE7： background:green !important;background:blue; 区别IE7与FF： background:orange; *background:green; 区别FF，IE7，IE6： background:orange;*background:green !important;*background:blue; 注：IE都能识别*;标准浏览器(如FF)不能识别*； IE6能识别*，但不能识别 !important, IE7能识别*，也能识别!important; FF不能识别*，但能识别!important; IE6 IE7 FF * √ √ × !important × √ √ 另外再补充一个，下划线”_“, IE6支持下划线，IE7和firefox均不支持下划线。 于是大家还可以这样来区分IE6，IE7，firefox : background:orange;*background:green;_background:blue; 注：不管是什么方法，书写的顺序都是firefox的写在前面，IE7的写在中间，IE6的写在最后面。 请注意此处在使用的过程中，先后顺序的问题。 而且：在某种浏览器中失效，是指这种功能失效，而不是加了这种代码标签后的css失效。 譬如在IE中加了 !important 后的css在IE中依然可以使用，但是!important本身失效，也就是说IE并不因为你这条写了!important而让其优先级提高，但在FF里面只要声明了!important，那么就只会用这则css来定义。所以一般使用!important的时候，应该把加油!important的那条css写在没有加!important的前面，让IE把后面的css覆盖掉前面的。 [ 阅读全文]
谈到网络上常用的中文字体，最容易想到的就是12px的宋体，px有点中国专用的意思，按照web标准尽量的使用em为单位才是正确的选择。因为这样可以提高用户的浏览体验，可以根据用户的需要进行字体的大小调整。 扯远了。悟空回来吧。 本博总结了网络上最常见的几种中文字体，这些中文字体的字体文件一般都默认装在XP系统中，所以不要太担心用户浏览的问题。（微软雅黑在后期的Xp的默认字体中变的常见。） 返回首页测试字体样例 – PMingLiu – 12px 返回首页测试字体样例 – PMingLiu – 11px 返回首页测试字体样例 – 宋体 – 12px 返回首页测试字体样例 – 黑体 – 12px 返回首页测试字体样例 – 微软雅黑 [ 阅读全文]