Archive for 五月, 2009
Posted in DIV+CSS Design @ 2009.05.31 (周日) 2:03 下午 by 一兮
常规在许多的页面中少不了图片的装饰，最常见的比如是内容容器的标题部分：
simple
如上面页面的公告部分，在上面的小表格中平铺了一层背景，当我们需要在页面中呈现不同颜色的标题栏的时候，我们只需再建一个不同颜色的图片文件，比如Image1，image2，image3，image4···
是不是嫌图片多了管理起来麻烦呢？其实这个时候我们可以很好的利用CSS 中的background操作图片的属性。
我们来先看一张图片：
bordercolored
上面的图片中包含了7种颜色的标题背景，我们可以根据自己的需要取出自己需要的部分即可，这个该怎么实现呢？
这个时候我们可以通过CSS中的background属性来实现，我们假设每个标题颜色的高度为 20px，那么我要取第5条红色的标题栏可以这样实现：
.style{height:20px;background:url(table.gif) no-repeat 0px -80px;}
其中在url图片后面的参数 0px -80px的意思便是从横坐标0px处，纵坐标80px处开始取我们规定的高度20px的图片，同理，我们只需要修改后面的两个像素参数便可以取出我们想要的部分了。
利用这个属性，我们不光可以实现图片的统一化管理，还有更好的用处。比如下面的那样的标题栏
simple2
留意其中我圈出的部分，那个是圆滑过渡的标题栏部分，要实现这样的效果可以做一个和表格同宽度的图片后作为表格的背景便可以，但如果增宽宽度的话，那么我就需要做一个新的图片对应新宽度，以实现两边圆滑的效果：
长标题栏
遇到这样的标题栏的时候，我们就需要重新做一个适应这个宽度的图片。
其实就像最上面讲的那样，我们当然可以将不同宽度的图片做到一张图片里面，像这样：
不同宽度图片
不同宽度图片利用最上面讲的原理进行不同部分图片的取舍，其实仔细会发现，我们在最上面的部分只是定义了纵坐标的位置取定，利用同样的方法，为什么我不可以再横坐标上取我们想要的部分呢？
像那不同的标题宽度的图片，我们可以做成一张整体的长图，像这样：
- 长
假设我们这张为chang.gif的图片的宽度为300px，而需要我们去适应的标题栏的宽度分别为100px和200px。
按照原理，在适应100px宽度的标题栏时我们可以先取出宽为80px 然后再取出整体chang.gif的最右20px作为拼接。
同理，200px的标题栏，我们可以先取出180px宽度，然后再用最右的20px进行拼接。
整体代码可以如此实现：
首先是CSS样式文件：
.style1 h1{width:80px;background:url(chang.gif) no-repeat 0px 0px;}
.style1 span{width:20px;background:url(chang.gif) no-repeat -280px 0px;}
.style2 h1{width:180px;backgound:url(chang.gif) no-repeat 0px 0px;}
.style2 span{width:20px;background:url(chang.gif) no-repeat -280px 0px;}
在调用时，我们这样调用:
<div class="style1">
<h1>这是100px宽度的标题栏<h1><span></span>
</div>
<div class="style2">
<h1>这是200px宽度的标题栏</h1><span></span>
</div>
是不是感到很方便的就实现了不同宽度的标题栏调用一个文件实现了呢？
CSS可以说是网页设计中的魔术棒，利用好了这魔术棒，将会为你的网页添置不一样的色彩。
Tags:CSS 10 views With
Posted in 工作记录 @ 2009.05.30 (周六) 8:54 下午 by 一兮
今天下午和美工一起把网店平台做了一定的图片美化，因为前期是在内网挂出，所以大可以不必考虑图片质量对网站浏览速度的影响，在美化网站的过程中，有个问题不能克服，因为内容太少，确实不知道该从哪里下手去着手美化，为了达到一个很好的页面效果，为此我专门查看了很多的网店的布局模式。
到最后的结果倒是得出来了一个结论，单从模板上来说，我们的模板应该比网上已经在运营的网店的模板好的多，在图片等方面处理的都比大部分的好，但是整体效果却和别人的效果有很大的一个差别，我初步找出来的原因是因为内容不够多，内容密度不够大，网上很多的网站的页面其实都是极其简单。
- 淘宝首页
就比如说当前的淘宝的页面吧，如果抛开里面的内容光看静态页面模板的话，那就是一个很简单的页面，很普遍的导航条，内容的样式框大概有3种的样子，模板很简单，但就左边的图来看，整体页面的效果是很不错，因为由内容来充实模板，单说那网站的分类就占了页面的大半部分。
而我们的网店平台，因为现在很多的内容还未添加上，所以无论怎么去考虑美化，总觉得是差强人意，刚才开会，可能会因为内容的原因而延迟平台的推出时间，毕竟这类靠消费者来生存的网站，第一印象尤其的重要，当我们将内容添加完成后，然后再做最后的模板调整，尽量的多内容，增大密度，减小空隙，毕竟这是一个要将我们信息扩散出去的一个平台。但如何在包含更多的信息中，却又不影响网站整体的美观以及浏览，这是个很难定夺的事情。
以图片来填充，这是个很好的办法。
平台押后推出，虽然会没有模式试运行的时间，但对我来说，我将会有更多的精力去做网站的页面优化，在没有内容的充实下，我也无法确知怎样书写CSS样式才是最佳的选择。
后面还有很多需要学习的地方，比如网站订单的实时短信提醒实现，前端时间在WordPress中看到一款短信通知评论的插件，大概的原理好像是利用的移动飞信的API接口，后面的时候将会去了解下飞信的API接口，以实现我们所需要的功能的开发。
我属于网络上所谓的草根站长，所有的草根站长的共有特点吧，一个人要充当网站技术，美工，维护等等的所有事情，也发现这个挺有意思的，至少，一个人做的话，遇到的问题会很多，搜寻到答案，学到的东西也更多。
12 views With
Posted in DIV+CSS Design @ 2009.05.30 (周六) 12:17 上午 by 一兮
关于网站的布局问题，其实这是做网站的一个根本，不管后台是用ASP还是PHP或者是ASP.NET的语言进行网站的数据处理，但这都不是一个浏览者所看到的内容，浏览者浏览网页最终看到是你呈现在他面前的页面，关于页面的布局，也有那么一定的讲究。
好，废话不多说，直接进入主题。
任何一个网站所呈现在用户面前的页面并不是将页面所要呈现的元素依次的输出，而都有一定的严格的显示方式，比如，最上面是一个LOGO然后是一个导航条，最下面是网站的版权之类的信息，而你发现，无论打开网站的哪个页面，最上面的导航部分和最下面的脚部部分都是没有变化的，甚至有许多的网站中间部分还有个边栏也是不会变化的。
实现这个很简单，因为此类的网站公分为三个部分，各部分都是单独的一个网页文件，整体的网站框架如图：
网页框架1
其中，假设content为index.htm模板文件，那么这个模板文件首先会用include函数包含头部的header.htm文件，然后再包含sidebar.htm边栏模板文件，然后开始定义index.htm模板文件的内容,最后在包含脚部foot.htm模板文件。在以后用户能够浏览到的任何的网页文件，在模板中也按照这样的顺序将头部，边栏部分，脚部部分模板include一次，那么就可以实现任何页面都不会变化的效果
这样的布局也不困难，可以采用绝对定位的方式，可以通过控制好层的宽度后，（当然也可以用表格实现，表格和层的方式相似，只是我觉得层用起来更加的方便一些）用left 和right属性进行层的定位，这种定位虽然很简单，但是在这样的定位下，中间部分的层是无法居中的，因为一旦将浏览器的的分辨率改变，头部和脚步还可以居中，但是中间部分就会发生错位。
解决这个问题很简单，我们只需要在所有的布局外面加上一个更大的容器：
框架2
先将父容器father居中固定，然后再在里面将我们的网页框架进行布局，这样里面的的容器的计算方式将会根据父容器Father的位置进行计算，所以我们将father的布局进行居中固定的话，不管浏览器的分辨率怎么变化，布局都不会出现散架的问题。
下面我将完整的代码附上，首先是css.css样式文件：
/* 为了区分出框架的实现性，我将所有的层都赋予了一定的高度和不同的颜色，在实际中，中间部分的高度并不需要赋值，因为需要利用层的伸缩性*/
#father{
width:950px;
margin:0 auto;
}
#header{
position:relative;
width: 950px;
height:150px;
background:#1a1a1a;
}
#sidebar{ /*width=1200px*/
float:left;
background:#c2c3c2;
width: 200px;
height:400px;
}
#content{ /*width=750px*/
float:right;
width:750px;
height:400px;
background:#ededed;
}
#footer {
clear:both;
height:100px;
background:#4C4C4E;
}
然后是静态布局文件index.htm
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>框架测试</title>
<link href="css.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="father">
<div id="header">
</div>
<div id="sidebar">
</div>
<div id="content">
</div>
<div id="footer">
</div>
</div>
</body>
</html>
上面这是简单的框架布局，或许你还会有边框的样式，等等样式，就像我的博客的主页一样。这些都很能够很简单的实现，这个只是简单的框架方式而已，当然或许你可以讲中间的内容改成三栏，方式一样，左边两个向左浮动，或者都向左浮动，只要三个的整体宽度，或者还要加上内外补丁，边框的宽度与father的宽度一致便可以实现。
P.s.突然发现做这样的内容是一件很累的事情，但是在其中也能寻找到在学习时候的乐趣，这个是一个很简单的CSS样式布局实现方式，没有过于花哨的内容，怎样去美化就是你学会以后怎么做的事情了，至于前短时间说的PHP cookie的实现，因为整个过程比较简单，所以就不特别的做实例怎么实现了，在以后的实例中用到的时候再说。
今天从家里回到了学校，我的端午节也算是提前的结束了，离6月1日的推出平台的时间越来越近了，这两天的时间也会更加的忙碌起来。
Tags:CSS DIV 模板 17 views With
Posted in PHP Programming @ 2009.05.27 (周三) 5:34 下午 by 一兮
smarty
Smarty
Smarty的特点是将模板编译成PHP脚本，然后执行这些脚本。很快，非常灵活。
Heyes Template Class
一个非常容易使用，但功能强大并且快速的模板引擎，它帮助你把页面布局和设计从代码中分离。
FastTemplate
一个简单的变量插值模板类，它分析你的模板，把变量的值从HTML代码中分离处理。
ShellPage
一个简单易用的类，可以让你的整个网站布局基于模板文件，修改模板就能改变整个站点。
STP Simple Template Parser
一个简单、轻量级并且易于使用的模板分析类。它可以从多个模板中组装一个页面，把结果页面输出到浏览器或者文件系统。
OO Template Class
一个你可以用在自己程序中的面向兑现的模板类。
SimpleTemplate
一个可以创建和结构化网站的模板引擎。它可以解析和编译模板。
bTemplate
短小但是快速的模板类，允许你把PHP逻辑代码从HTML修饰代码中分离。
Savant
一个强大且轻量级的PEAR兼容模板系统。它是非编译型的，使用PHP语言本身做为它的模板语言。
ETS – easy template system
可以使用完全相同数据重组模板的模板系统。
EasyTemplatePHP
适用于你的站点的一个简单但是强大的模板系统。
vlibTemplate
一个快速、全能的模板系统，它包含一个缓存和调试类。
AvanTemplate
多字节安全的模板引擎，占用很少系统资源。它支持变量替换，内容块可以设置显示或隐藏。
Grafx Software’s Fast Template
一个修改版本的Fast Template系统，它包括缓存功能，调试控制台以及沉默去除为赋值块。
TemplatePower
一个快速、简单、功能强大的模板类。主要功能有嵌套的动态块支持，块/文件包含支持以及显示/隐藏未赋值的变量。
TagTemplate
这个库的功能被设计来使用模板文件，同时允许你从HTML文件检索信息。
htmltmpl: templating engine
一个适用于Python和PHP的模板引擎。它面向希望在项目中分离代码和设计的web应用开发人员。
PHP Class for Parsing Dreamweaver templates
一个分析Dreamweaver模板的简单类，被用于Gallery 2 和WordPress的自定义模块中。
MiniTemplator (Template Engine)
针对HTML文件的一个紧凑型模板引擎。对于模板变量和块定义它具有简单的语法。其中块可以嵌套。
Layout Solution
简化网站开发和维护。它拥有常用的变量和页面元素使你不需要重复做页面布局工作。
Cached Fast Template
它已经纳入 FastTemplate ，允许你缓存模板文件，甚至可以在分离的块内容上缓存不同的规格。
TinyButStrong
一个支持MySQL, Odbc, Sql-Server和ADODB的模板引擎。它包含7个方法和两个属性。
Brian Lozier’s php based template engine
只有2K大小，非常快并且是面向对象设计。
WACT
一个从设计中分离代码的模板引擎。
PHPTAL
一个PHP下面的XML/XHTML模板库。
P.s.本来昨天说的今天不回家的，但后来想了又想，还是觉得自己应该回来看看，一个月没回来了，放暑假可能会留在学校里做程序开发，还指不定什么时候能回来一次呢，我奶奶他们每周日都会问我爸妈我什么时候回家，所以，我觉得我很有必要回一趟家的，事情虽然重要，但家里的亲情也不能给忘了。爸妈也不为什么，就是想看看我了。
Tags:PHP 模板 13 views With
Posted in 网络琐事 @ 2009.05.26 (周二) 7:50 下午 by 一兮
其实就前断时间琢磨的去掉ShopEx版权的事，也就是一个PHP加密的解密过程，其实不光是PHP，那些只要涉及到所谓的加密的事情，总是就会有解密的人去对着干，就像到现在仍然很流行的号称不可能破解的MD5加密一样，前段时间也有传出了有一个大学老师找到了MD5的反算法，加密和解密永远都是一个亘古不变的问题。就像之前在论坛和学校一个朋友扯到的网络追踪与隐藏的问题一样。
PHP代码的保护一直是许多公司关注的核心问题，例如知名的一些论坛vBulletin、Discuz!、PhpWind及近日很火的ShopEx等等但是PHP反编译系统的出现却迅速引起了Zend公司甚至整个PHP用户群的恐慌，包括上述产品在内的几乎所有大型PHP产品全部出现了破解版本甚至出现了完整的源代码。如此一来，Zend不得不向Cracker们低头，承认所有的加密技术都有破解的办法，并承诺对加密产品进行改进以便提供更强的保护。
PHP加密技术可以追溯到01年，当时PHP已经很火爆，所以许多公司希望能推出商业化的PHP系统，于是PHP加密(编译)产品应运而生，随后PHP大颚Zend公司推出了自己的Zend Encoder，直到现在，Zend的加密产品依然是这个领域的领袖。
PHP解密技术呢？02年初就出现了非常强的解密系统。该系统实际上是由PHP核心成员开发的，直到现在，所有的PHP解密技术都还是依靠02年由PHP核心成员发布的技术进行解密的，而且，目前还没有任何加密产品能避免被该技术破解。（考虑到庞大的PHP开发商的利益，我们在这里就不公开该技术了）
值得一提的是，中国人再次在破解领域露了一脸。05年底时，国内某XX工作室对外称其可将Zend加密过的PHP代码进行还原，并提供了在线测试服务。这倒没有什么特殊之处，因为04年时国外就有数个类似的团队提供PHP破解服务了。不同是该XX工作室的作风非常硬朗，不仅通过各种渠道散布自己的广告，甚至使用虚拟的身份在Zend公司的论坛上发布广告消息，引起PHP业内一片唏嘘。
近日，又在Google的Blog用户中发现某中文用户提供PHP破解服务，同样提供免费的反编译测试服务。
我们曾先后向几个知名的，包括国外老牌的、国内的XX工作室及最近出现在Google Blog上的PHP破解团队提交了相同的编译过的代码，经过对破解后的代码的比较，我们发现所有这些破解技术基本上都是基于同样的原理，只是老牌的公司有更强的实力，破解后的代码更接近源代码，新的技术团队功力显然略逊一筹。
后来我们了解到，实际上国内只有一个XX工作室提供PHP破解服务，Google Blog上的那位用户是国外某老牌PHP破解团队的中国成员，只是近日才低调出现在中文社群内的。
同样的，我们对各个团队的破解技术和服务价格进行了比较，国内的XX工作室虽然价格遥遥领先，但其破解技术却与那些老牌的团队无法相提并论，甚至有朋友称该XX工作室要挟过他们公司：如果不交“保护费”，就要公布他们的源代码。实在让人有些啼笑皆非。
OPENLINK也有大量的PHP产品，也许哪天要被该XX工作室收保护费也未可知
实际上，OPENLINK目前已经基本上专攻解决方案了，用户可以一次性获得全部源代码，所以OPENLINK也不需要去在意破解的问题，但是对于其他兄弟企业而言，的确应该考虑一下知识产权的问题了。
Tags:破解 6 views With
