刚才郭老师的学生和我讨论这个布局：
他的CSS被漂丢了，所以出了些奇怪的BUG。
Shaka说这个其实可以用li来做，不用漂浮。于是，技痒之，搞了个DEMO出来～
DEMO页面在这里，用LI做的，没有使用浮动层。
当然，这是适合左边的图不动的情况，如果左边的图有变化的需求，就不能用background来做了。可以这样：
1、用Table切成2列的 – 不使用漂浮
2、左图向左漂，右字根据实际情况选择漂浮或不漂浮。
Shaka还是建议用Table来做，以便避免使用相对复杂的漂浮层。
南边是技术 | Shaka | 2009 年 03 月 17 日 | 
Comments (0)
函数是这样的：
<ul><li><h2>A random selection of my writing</h2>
<ul>
<?php
$rand_posts = get_posts('numberposts=5&orderby=rand');
foreach( $rand_posts as $post ) :
?>
<li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endforeach; ?>
</ul>
</li></ul>
具体的在这里：http://codex.wordpress.org/Template_Tags/get_posts
南边是技术 | Shaka | 2009 年 03 月 15 日 | Comments (0)
嘿嘿，汉化了个简单的Firefox插件Tea Timer！作为了解Firefox插件开发的第一步。
Tea Timer！泡茶定时器 – 作者愿意就是个泡茶提醒。不过Shaka觉得用作“喝茶”提醒也很不错。比如说设定50分钟弹出一次提示（或者播放音乐），那么就不会因为工作太忙而忘记喝水了～
完成的xpi文件在这里, 已经发给作者了，估计Firfox网站上的下个版会加入中文的文件。
其实汉化Firefox插件是很简单的事情，一般的插件是英文的，只要在local文件夹里添加相应的汉化的文件，然后在chrome.manifest文件里，把汉化文件的位置写进去就可以了。
稍稍总结下就是，Shaka以前一直以为Firefox插件里的所有文件都必须是utf-8编码的，现在知道了对于英文等西文来说只要是普通的文本就可以了，但是对于中文等东文来讲，必须是utf-8编码，否则会导致插件出现奇怪的问题。另外，鄙视自己一下，就是Shaka刚知道Edit plus新版是可以转换编码的…看来对于常用的软件还是要关注下更新的。
南边是技术 | Shaka | 2009 年 02 月 24 日 | Comments (2)
我用的是啥IE?
我一直以为公司给我的机器上是IE7, 而且我看到的也是IE7:
可刚才搞一个极其简单的CSS的时候, 居然出现了双空白边问题, 暴汗~
经多次测试后, 我认为这确实是IE6上才有的双空白边问题, 于是按解决IE6的办法尝试解决这个问题,修改相应的CSS为
margin-right: 2%; *margin-right:1%;
在IE7上运行, 问题解决…汗!!!!
我在Google上搜索了一阵子, 无果… 难道我用的是个披着IE7外皮的IE6? 我yong…
南边是技术 | Shaka | 2009 年 02 月 02 日 | Comments (0)
这篇是复习+总结+转载+解答:
1。行内式
即在标记的style属性中设定css样式，这种方式本质上没体现出css的优势，因此不推荐使用。（不过懒人一般都这么干）
2。嵌入式
在对页面中各种元素的设置集中写在<head>和</head>之间的，如：
<header>
<style >
<!–
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #666666;
}
–>
</style>
</header>
对于单个页面来说，这种方式很方便 – 也是懒人常用的方法。
3。导入式
导入式格式如下：
<style type=”text/css”>
@import “mystyle.css”;
</style>
4。连接式
格式如下：
<link href=”mystyle.css” rel=”stylesheet” type=”text/css”/>
采用后两种方式后的显示效果略有区别，区别如下：
1。连接式：会在装载页面主体部分之前装载css文件，这样显示出来的网页从一开始就是带有样式效果的，
导入式：会在整个页面装载完成后再装载CSS文件，对于有的浏览器来说，在一些情况下，如果网页文件的体积比较大，则会出现先显示无样式的页面，
，闪烁一下之后再出现设置样式后的效果，从浏览者的感受来说，这是导入式的一个缺陷。
对于一些比较大的网站，为了便于维护，可能会希望把所有的css样式分类别放到几个CSS文件中，这样如果使用连接式引入，就需要几个语句分别导入CSS文件
如果要调整CSS文件的分类，就需要同时调整HTML文件，这对于维护工作来说，是一个缺陷，如果使用导入式，则可以只引进一个总的CSS文件，在这个文件中再
导入其他独立CSS文件；而连接则不具备这个特性。
因此给大家的建议是：如果仅需要引入一个CSS文件，则使用连接方式，如果需要引入多个CSS文件，则首先用连接方式引入一个“目录”CSS文件，这个“目录”
CSS文件中再使用导入式引入其他CSS文件。
如果希望用javascript来动态决定引入哪个css文件，则必须使用连接式才能实现。
南边是技术 | Shaka | 2009 年 02 月 01 日 | Comments (0)
昨天有人问我怎么给外链加一个wikipedia那样的外部链接标志
。
其实很简单。
用Firebug看下wikipedia是怎么写的就行了， HTML是这样的：
CSS是这样的：
注：
上述代码及external.png均来自wikipedia.
南边是技术 | Shaka | 2009 年 01 月 31 日 | Comments (0)
一直不知道怎么用CSS实现文字重影的效果，今天溜达到ui.jquery.com，看到了这个实例，用Firebug查看那了下，终于弄明白了。
实现的方法见下图（侧头，哈哈）：
CSS 实现文字重影的效果
至于说为什么要把图竖过来，想不明白的看官可以和我沟通哈哈。
南边是技术 | Shaka | 2008 年 11 月 12 日 | Comments (0)
原文在这里：
http://www.webdesignerwall.com/tutorials/how-to-css-large-background
body {
padding: 0;
margin: 0;
background: #f8f7e5 url(http://www.webdesignerwall.com/wp-content/themes/wdw/images/main-bg.jpg) no-repeat center top;
width: 100%;
display: table;
}
要点是：
center, top
和
width: 100%;
display: table;
南边是技术 | Shaka | 2008 年 10 月 22 日 | Comments (0)
用 PHP 读取文件的正确方法phpma.com
了解如何使用 PHP 的各种文件函数。查看诸如 fopen、fclose 和 feof 之类的基本文件函数；了解诸如 fgets、fgetss 和 fscanf 之类的读取函数。并且发现用一两行代码处理整个文件的函数。phpma.com
让我们算一算有多少种方法phpma.com
处理诸如 PHP 之类的现代编程语言的乐趣之一就是有大量的选项可用。PHP 可以轻松地赢得 Perl 的座右铭“There’s more than one way to do it”（并非只有一种方法可做这件事），尤其是在文件处理上。但是在这么多可用的选项中，哪一种是完成作业的最佳工具？当然，实际答案取决于解析文件的目 标，因此值得花时间探究所有选项。
传统的 fopen 方法phpma.com
fopen 方法可能是以前的 C 和 C++ 程序员最熟悉的，因为如果您使用过这些语言，那么它们或多或少都是您已掌握多年的工具。对于这些方法中的任何一种，通过使用 fopen（用于读取数据的函数）的标准方法打开文件，然后使用 fclose 关闭文件，如清单 1 所示。
清单 1. 用 fgets 打开并读取文件phpma.com
$file_handle = fopen("myfile", "r");
while (!feof($file_handle)) {
$line = fgets($file_handle);
echo $line;
}
fclose($file_handle);
|
虽然大多数具有多年编程经验的程序员都熟悉这些函数，但是让我对这些函数进行分解。有效地执行以下步骤：phpma.com
记住这些步骤，我将回顾在这里使用的每个文件函数。
fopenphpma.com
fopen 函数将创建与文件的连接。我之所以说“创建连接”，是因为除了打开文件之外，fopen 还可以打开一个 URL：
$fh = fopen("http://127.0.0.1/", "r");
|
这行代码将创建一个与以上页面的连接，并允许您开始像读取一个本地文件一样读取它。
注： fopen 中使用的 “r” 将指示文件以只读方式打开。由于将数据写入文件不在本文的讨论范围内，因此我将不列出所有其他选项。但是，如果是从二进制文件读取以获得跨平台兼容性，则应当将 “r” 更改为 “rb”。稍后您将看到这样的示例。phpma.com
feof
feof 命令将检测您是否已经读到文件的末尾并返回 True 或 False。清单 1 中的循环将继续执行，直至您达到文件“myfile”的末尾。注：如果读取的是 URL 并且套接字由于不再有任何数据可以读取而超时，则 feof 也将返回 False。
fclose
向前跳至清单 1 的末尾，fclose 将实现与 fopen 相反的功能：它将关闭指向文件或 URL 的连接。执行此函数后，您将不再能够从文件或套接字中读取任何信息。
fgets
在清单 1 中回跳几行，您就到达了文件处理的核心：实际读取文件。fgets 函数是处理第一个示例的首选武器。它将从文件中提取一行数据并将其作为字符串返回。在那之后，您可以打印或者以别的方式处理数据。清单 1 中的示例将精细地打印整个文件。phpma.com
如果决定限制处理数据块的大小，您可以将一个参数添加到 fgets 中限制最大行长度。例如，使用以下代码将行长度限制为 80 个字符：
$string = fgets($file_handle, 81);
回想 C 中的“\0”字符串末尾终止符，将长度设为比实际所需值大一的数字。因而，如果需要 80 个字符，则以上示例使用 81。应养成以下习惯：只要对此函数使用行限制，就添加该额外字符。phpma.com
fread
fgets 函数是多个文件读取函数中惟一一个可用的。它是一个更常用的函数，因为逐行解析通常会有意义。事实上，几个其他函数也可以提供类似功能。但是，您并非总是需要逐行解析。
这时就需要使用 fread。fread 函数与 fgets 的处理目标略有不同：它趋于从二进制文件（即，并非主要包含人类可阅读的文本的文件）中读取信息。由于“行”的概念与二进制文件无关（逻辑数据结构通常都 不是由新行终止），因此您必须指定需要读入的字节数。phpma.com
$fh = fopen("myfile", "rb");
$data = fread($file_handle, 4096);
|
以上代码将读取 4,096 字节 (4 KB) 的数据。注：不管指定多少字节，fread 都不会读取超过 8,192 个字节 (8 KB)。
假定文件大小不超过 8 KB，则以下代码应当能将整个文件读入一个字符串。
$fh = fopen("myfile", "rb");
$data = fread($fh, filesize("myfile"));
fclose($fh);
|
如果文件长度大于此值，则只能使用循环将其余内容读入。
fscanf
回到字符串处理，fscanf 同样遵循传统的 C 文件库函数。如果您不熟悉它，则 fscanf 将把字段数据从文件读入变量中。
list ($field1, $field2, $field3) = fscanf($fh, "%s %s %s"); |
此函数使用的格式字符串在很多地方都有描述（如 PHP.net 中），故在此不再赘述。可以这样说，字符串格式化极为灵活。值得注意的是所有字段都放在函数的返回值中。（在 C 中，它们都被作为参数传递。）
fgetss
fgetss 函数不同于传统文件函数并使您能更好地了解 PHP 的力量。该函数的功能类似于 fgets 函数，但将去掉发现的任何 HTML 或 PHP 标记，只留下纯文本。查看如下所示的 HTML 文件。
清单 2. 样例 HTML 文件
<html>
<head><title>My title</title></head>
<body>
<p>If you understand what "Cause there ain't no one for to give you no pain"
means then you listen to too much of the band America</p>
</body>
</html>
|
然后通过 fgetss 函数过滤它。phpma.com
清单 3. 使用 fgetss
$file_handle = fopen("myfile", "r");
while (!feof($file_handle)) {
echo = fgetss($file_handle);
}
fclose($file_handle);
以下是输出：
My title
If you understand what "Cause there ain't no one for to give you no pain"
means then you listen to too much of the band America
|
fpassthru 函数
无论怎样读取文件，您都可以使用 fpassthru 将其余数据转储到标准输出通道。
fpassthru($fh); |
此外，此函数将打印数据，因此无需使用变量获取数据。
非线性文件处理：跳跃访问
当然，以上函数只允许顺序读取文件。更复杂的文件可能要求您来回跳转到文件的不同部分。这时就用得着 fseek 了。
fseek($fh, 0); |
以上示例将跳转回文件的开头。如果不需要完全返回 —— 我们可设定返回千字节 —— 然后就可以这样写：
fseek($fh, 1024); |
从 PHP V4.0 开始，您有一些其他选项。例如，如果需要从当前位置向前跳转 100 个字节，则可以尝试使用：phpma.com
fseek($fh, 100, SEEK_CUR); |
类似地，可以使用以下代码向后跳转 100 个字节：
fseek($fh, -100, SEEK_CUR); |
如果需要向后跳转至文件末尾前 100 个字节处，则应使用 SEEK_END。
fseek($fh, -100, SEEK_END); |
在到达新位置后，可以使用 fgets、fscanf 或任何其他方法读取数据。
注：不能将 fseek 用于引用 URL 的文件处理。
提取整个文件phpma.com
现在，我们将接触到一些 PHP 的更独特的文件处理功能：用一两行处理大块数据。例如，如何提取文件并在 Web 页面上显示其全部内容？好的，您看到了 fgets 使用循环的示例。但是如何能够使此过程变得更简单？用 fgetcontents 会使过程超级简单，该方法将把整个文件放入一个字符串中。
$my_file = file_get_contents("myfilename");
echo $my_file;
|
虽然它不是最好的做法，但是可以将此命令更简明地写为：
echo file_get_contents("myfilename");
|
本文主要介绍的是如何处理本地文件，但是值得注意的是您还可以用这些函数提取、回显和解析其他 Web 页面。
echo file_get_contents("http://127.0.0.1/");
此命令等效于：
$fh = fopen("http://127.0.0.1/", "r");
fpassthru($fh);
|
您一定会查看此命令并认为：“那还是太费力”。PHP 开发人员同意您的看法。因此可以将以上命令缩短为：
readfile("http://127.0.0.1/");
|
readfile 函数将把文件或 Web 页面的全部内容转储到默认的输出缓冲区。默认情况下，如果失败，此命令将打印错误消息。要避免此行为（如果需要），请尝试：
@readfile("http://127.0.0.1/");
|
当然，如果确实需要解析文件，则 file_get_contents 返回的单个字符串可能有些让人吃不消。您的第一反应可能是用 split() 函数将它分解一下。phpma.com
$array = split("\n", file_get_contents("myfile"));
|
但是既然已经有一个很好的函数为您执行此操作为什么还要这样大费周章？PHP 的 file() 函数一步即可完成此操作：它将返回分为若干行的字符串数组。
$array = file("myfile");
|
应当注意的是，以上两个示例有一点细微差别。虽然 split 命令将删除新行，但是当使用 file 命令（与 fgets 命令一样）时，新行仍将被附加到数组中的字符串上。
但是，PHP 的力量还远不止于此。您可以在一条命令中使用 parse_ini_file 解析整个 PHP 样式的 .ini 文件。parse_ini_file 命令接受类似清单 4 所示的文件。
清单 4. 样例 .ini 文件phpma.com
; Comment [personal information] name = "King Arthur" quest = To seek the holy grail favorite color = Blue [more stuff] Samuel Clemens = Mark Twain Caryn Johnson = Whoopi Goldberg |
以下命令将把此文件转储为数组，然后打印该数组：phpma.com
$file_array = parse_ini_file("holy_grail.ini");
print_r $file_array;
|
以下输出的是结果：
Listing 5. 输出
Array
(
[name] => King Arthur
[quest] => To seek the Holy Grail
[favorite color] => Blue
[Samuel Clemens] => Mark Twain
[Caryn Johnson] => Whoopi Goldberg
)
|
当然，您可能注意到此命令合并了各个部分。这是默认行为，但是您可以通过将第二个参数传递给 parse_ini_file 轻松地修正它：process_sections，这是一个布尔型变量。将 process_sections 设为 True。phpma.com
$file_array = parse_ini_file("holy_grail.ini", true);
print_r $file_array;
|
并且您将获得以下输出：
清单 6. 输出
Array
(
[personal information] => Array
(
[name] => King Arthur
[quest] => To seek the Holy Grail
[favorite color] => Blue
)
[more stuff] => Array
(
[Samuel Clemens] => Mark Twain
[Caryn Johnson] => Whoopi Goldberg
)
)
|
PHP 将把数据放入可以轻松解析的多维数组中。
对于 PHP 文件处理来说，这只是冰山一角。诸如 tidy_parse_file 和 xml_parse 之类的更复杂的函数可以分别帮助您处理 HTML 和 XML 文档。有关这些特殊函数的使用细节，请参阅 参考资料。如果您要处理那些类型的文件，则那些参考资料值得一看，但不必过度考虑本文中谈到的每种可能遇到的文件类型，下面是一些用于处理到目前为止介绍 的函数的很好的通用规则。
最佳实践phpma.com
绝不要假定程序中的一切都将按计划运行。例如，如果您要查找的文件已被移动该当如何？如果权限已被改变而无法读取其内容又当如何？您可以通过使用 file_exists 和 is_readable 预先检查这些问题。
清单 7. 使用 file_exists 和 is_readable
$filename = "myfile";
if (file_exists($filename) && is_readable ($filename)) {
$fh = fopen($filename, "r");
# Processing
fclose($fh);
}
|
但是，在实践中，用这样的代码可能太繁琐了。处理 fopen 的返回值更简单并且更准确。phpma.com
if ($fh = fopen($filename, "r")) {
# Processing
fclose($fh);
}
|
由于失败时 fopen 将返回 False，这将确保仅当文件成功打开后才执行文件处理。当然，如果文件不存在或者不可读，您可以期望一个负返回值。这将使这个检查可以检查所有可能遇到的问题。此外，如果打开失败，可以退出程序或让程序显示错误消息。
如 fopen 函数一样，file_get_contents、file 和 readfile 函数都在打开失败或处理文件失败时返回 False。fgets、fgetss、fread、fscanf 和 fclose 函数在出错时也返回 False。当然，除 fclose 以外，您可能已经对这些函数的返回值都进行了处理。使用 fclose 时，即使文件处理未正常关闭，也不会执行什么操作，因此通常不必检查 fclose 的返回值。
由您来选择phpma.com
PHP 不缺读取和解析文件的有效方法。诸如 fread 之类的典型函数可能在大多数时候都是最佳的选择，或者当 readfile 刚好能满足任务需要时，您可能会发现自己更为 readfile 的简单所吸引。它实际上取决于所要完成的操作。phpma.com
如果要处理大量数据，fscanf 将能证明自己的价值并比使用 file 附带 split 和 sprintf 命令更有效率。相反，如果要回显只做了少许修改的大量文本，则使用 file、file_get_contents 或 readfile 可能更合适。使用 PHP 进行缓存或者创建权宜的代理服务器时可能就属于这种情况。
PHP 给您提供了大量处理文件的工具。深入了解这些工具并了解哪些工具最适合于要处理的项目。您已拥有很多的选择，因此好好地利用它们享受使用 PHP 处理文件的乐趣。
南边是技术 | Shaka | 2008 年 09 月 26 日 | Comments (2)
CSS教程:简单介绍CSS结合JS的运用
利用CSS配合Javascript的可以做很多更酷的动态页面效果，在本教程的最后给大家简单介绍一下CSS配合JS的应用。首先，我们要搞清楚事件和动作的概念。在客户端脚本中，JavaScript 通过对事件进行响应来获得与用户的交互。例如，当用户单击一个按钮或者在某段文字上移动鼠标时，就触发了一个单击事件或鼠标移动事件，通过对这些事件的响应，可以完成特定的功能（例如，单击按钮弹出对话框，鼠标移动到文本上后文本变色等）。 下面介绍几种常见的事件（还用更多事件，请查阅相关资料）：
onClick：鼠标单击事件。（是指鼠标按下，然后松开时产生。）
onDblClick：鼠标双击事件。（是指鼠标快速按下，松开，并再次按下时产生。）
onMouseDown：鼠标按下事件。（鼠标按下时即产生。）
onMouseUp：鼠标释放事件。（是指鼠标从按下的状态到弹起。）
onMouseMove：鼠标移动事件。（是指在特定元素上移动鼠标。） onMouseOver：鼠标经过事件。（是指，当指针从外界往元素上移动时产生。）
onMouseOut：鼠标离开事件。（是指鼠标从特定元素上离开时产生。）
onLoad：载入事件。（当图象或页面结束载入时产生。）
onUnload：卸载事件。（当访问者离开页面时产生。）
onScroll：滚动条滚动事件。（当访问者使用卷轴上移或下移时产生。）
有了事件以后，我们就为事件加上动作。这里只说改变当前元素自定义样式的动作，我们可以用这个方法先设定好两个自定义的CSS样式，对象原先调用第一种样式，当产生鼠标事件时让对象应用到第二种CSS样式，而产生的鼠标效果，看下面这个例子。
在网页中插入一个图象，自定义一个“.out”样式，用gray滤镜使图片变成黑白的：
将这个自定义样式应用到图片上，在浏览器中预览到图片变成了黑白，我们再定义一个样式“.over”，这个样式没有任何内容，是空样式，样式表代码如下：
然后在图片标记（IMG）里加上“onMouseOver=”this.className=’over’” onMouseOut=”this.className=’out’””，意思为当鼠标经过时，图片为over样式，即彩色正常图象；当鼠标离开时，图片为out样式，即黑白图象。oMouseOver和onMouseOut是鼠标事件，this.className=”…”表示当前对象的class名为…，注意大小写不要写错，JS对大小写非常敏感。
这样这个效果就完成了，保存后在浏览器里打开，图象是黑白的，当鼠标移上去时，图象变成彩色，鼠标离开时，图象又变回黑白。只要发挥你的想象，通过this.className方法还可以做出很多好看的鼠标效果。
到这里，所有css教程的内容就都讲完了，希望大家在学习中能灵活运用属性及方法，深刻理解规律和概念。
如果你能很好地应用CSS，那么你的主页将被打扮得很靓。下面就给大家介绍用CSS做出的一个鼠标单击特殊效果图。
1、将下面的代码复制到你的主页中和之间。
〈STYLE〉.shadow {
FILTER: shadow(color=blue，direction=225)
}
.shadow1 {
FILTER: shadow(color=red，direction=225)
}
.shadow2 {
FILTER: shadow(color=green，direction=225)
}
.div {
CURSOR: move; FILTER: blur(add=ture，direction=135，strength=10); WIDTH: 800px
}
〈/STYLE〉
在这里应用的是blur滤镜。
2、在页面中插入一张图片，比如我插入是〈img border=”0″ src=”/Files/BeyondPic/oldjcwimg/2005-11/15/0511151234155538.jpg” width=”300″ height=”210″〉。在其前加入〈TD id=flttgt style=”filter: light(enabled=1)，’width 300′” width=315〉。
在刚才我们插入图片下一行中加入〈TD style=”VERTICAL-ALIGN: top” width=314〉
3、在设置了图片属性后，我们还要应用JavaScript脚本代码，也就是使图片跟随鼠标移动一些特效，代码如下。
〈SCRIPT language=JavaScript〉
〈!–
var g_numlights=0;
var blurbs= new Array(” 现在的动态滤镜赋予了网页更多的交互性能来响应用户的动作。”，” 我们使用了光源滤镜来响应用户的点击。点击图片可以增加光源。”，” 通过捕捉用户鼠标位置的方法来移动光源。”，” 不需要太多的编程。”);
window.onload=setlights;
document.onclick=keyhandler;
flttgt.onmousemove=mousehandler;
function setlights(){
flttgt.filters[0].clear();
flttgt.filters[0].addcone(0，0，5，100，100，225，225，0，60，15);
if (g_numlights>0){
flttgt.filters[0].addcone(400，170，5，100，100，225，0，0，160，15);
if (g_numlights>1){
flttgt.filters[0].addcone(320，330，5，100，100，0，225，225，60，15);
}
}
}
function keyhandler()
{
g_numlights=(g_numlights+=1)%4;
holder.innerHTML=blurbs[g_numlights];
setlights();
}
function mousehandler()
{
x=(window.event.x-80);
y=(window.event.y-80);
flttgt.filters[0].movelight(1，x，y，5，1);
if(g_numlights>0){
flttgt.filters[0].movelight(1，x，y，5，1);
if(g_numlights>1)
{
flttgt.filters[0].movelight(2，x，y，5，1);
}
}
}
〈/SCRIPT〉
南边是技术, 转载的精彩 | Shaka | 2008 年 09 月 25 日 | Comments (0)
