解读利用PHP JavaScript打造AJAX搜索窗的方法(5)_PHP教程

教程Tag：暂无Tag,欢迎添加,赚取U币!

推荐：解析PHP CSS实现打印简单数据报表功能
PHP CSS实现打印简单数据报表功能功能：实现打印日报表的功能，定义了专门的打印样式，隐藏了不该打印的控件并实现了分页打印功能，表名：rec 字段：rec_id,rec_po,rec_part,rec_plant

如前面所述，该关闭链接的位置是绝对的：

以下为引用的内容：

a.ajaxWebSearchCloseLink
{
　position: absolute;
　right: 5px;
　top: 3px;
　text-decoration: none;
　color: white;
}
a:hover.ajaxWebSearchCloseLink
{
　color: red;
}

该元素被放置在距右边5个像素，距顶部3个像素的位置（该元素被放在右上角）。这个链接没有任何文本修饰并且颜色呈白色。当用户的鼠标停在该链接上时，文本颜色变红。

注意，这里没有使用访问过的或活动的"假"类。这是因为该窗口总是忽略这个链接的href属性(它已经在它的事件处理器中返回了false)。因此，该链接从来不会真正处于活动或被访问状态。

然后，ajaxWebSearchResults类使结果栏的风格如下：

以下为引用的内容：

.ajaxWebSearchResults
{
　background-color: #d3e5fa;
　padding: 5px;
}

这个元素不要求使用CSS属性。现有属性仅用于定义结果栏并且使它比较容易读取。背景颜色是一个浅蓝色并且围绕边缘有5个像素的填充。当然，你能够定制加载消息的风格：

以下为引用的内容：

.ajaxWebSearchResults div
{
　text-align: center;
　font: bold 14px tahoma;
　color:#0a246a;
}

这个元素没有一个类名，但是你仍然能够通过使用前面的示例中展示的parent child标志控制它的风格。这个示例把文本放置在＜div/＞元素的中央，并且给它一个加粗蓝色的字体，且有14个像素高。

最后一个你需要风格化的元素是结果链接。这些链接有一个类名叫ajaxWebSearchLink：

以下为引用的内容：

a.ajaxWebSearchLink
{
　font: 12px tahoma;
　padding: 2px;
　display: block;
　color: #0a246a;
}
a:hover.ajaxWebSearchLink
{
　color: white;
　background-color: #316ac5;
}
a:visited.ajaxWebSearchLink
{
　color: purple;
}